feat: 完成六爻排盘功能开发

- 新增后端六爻排盘API控制器 LiuYaoController
- 新增前端六爻排盘输入页面 liuyao.vue
- 新增前端六爻排盘结果展示页面 result.vue
- 更新前端API接口,添加六爻排盘接口
- 支持时间起卦和手动输入两种起卦方式
- 完整展示本卦、变卦、互卦、错卦、综卦、伏卦信息
- 展示六爻详盘:六神、世应、六亲、干支、五行、纳音等
This commit is contained in:
H1d3rOne committed 2026-03-06 04:14:17 +08:00
1 parent 52bba81729
commit 25ce9c22e1
4 files changed
+1124 -19

No files matched your search

@@ -0,0 +1,219 @@
package xuan.controller;
import org.springframework.web.bind.annotation.*;
import xuan.core.liuyao.LiuYao;
import xuan.core.liuyao.settings.LiuYaoJiChuSetting;
import xuan.core.liuyao.settings.LiuYaoShenShaSetting;
import java.util.HashMap;
import java.util.Map;
@RestController
@RequestMapping("/api/liuyao")
public class LiuYaoController {
@PostMapping("/paipan")
public Map<String, Object> paiPan(@RequestBody LiuYaoRequest request) {
Map<String, Object> result = new HashMap<>();
try {
LiuYaoJiChuSetting setting = new LiuYaoJiChuSetting();
setting.setName(request.getName() != null ? request.getName() : "某人");
setting.setOccupy(request.getOccupy() != null ? request.getOccupy() : "某事");
setting.setSex(request.getSex() != null ? request.getSex() : 1);
setting.setDate(request.getDate() != null ? request.getDate() : "2024-01-01 00:00:00");
setting.setDateType(request.getDateType() != null ? request.getDateType() : 0);
setting.setLeapMonthType(request.getLeapMonthType() != null ? request.getLeapMonthType() : 0);
setting.setXuShiSuiType(request.getXuShiSuiType() != null ? request.getXuShiSuiType() : 0);
setting.setJieQiType(request.getJieQiType() != null ? request.getJieQiType() : 1);
setting.setYearGanZhiType(request.getYearGanZhiType() != null ? request.getYearGanZhiType() : 2);
setting.setMonthGanZhiType(request.getMonthGanZhiType() != null ? request.getMonthGanZhiType() : 1);
setting.setDayGanZhiType(request.getDayGanZhiType() != null ? request.getDayGanZhiType() : 0);
setting.setPaiPanType(request.getPaiPanType() != null ? request.getPaiPanType() : 0);
setting.setLiuYaoYaoXiang(request.getLiuYaoYaoXiang() != null ? request.getLiuYaoYaoXiang() : "——,——,——,——,——,——");
LiuYao liuYao = new LiuYao(setting);
liuYao.liuYaoShenShaSetting(new LiuYaoShenShaSetting());
result.put("success", true);
result.put("data", buildLiuYaoData(liuYao));
} catch (Exception e) {
result.put("success", false);
result.put("error", e.getMessage());
}
return result;
}
private Map<String, Object> buildLiuYaoData(LiuYao liuYao) {
Map<String, Object> data = new HashMap<>();
data.put("name", liuYao.getName());
data.put("sex", liuYao.getSex());
data.put("age", liuYao.getAge());
data.put("solar", liuYao.getSolarStr2());
data.put("lunar", liuYao.getLunarStr2());
data.put("xingQi", liuYao.getXingQi());
data.put("jiJie", liuYao.getJiJie());
data.put("shengXiao", liuYao.getShengXiao());
data.put("xingZuo", liuYao.getXingZuo());
data.put("yueXiang", liuYao.getYueXiang());
data.put("yueJiang", liuYao.getYueJiang());
data.put("yueJiangShen", liuYao.getYueJiangShen());
data.put("wuBuYuShi", liuYao.getWuBuYuShi());
data.put("yearGanZhi", liuYao.getYearGanZhi());
data.put("monthGanZhi", liuYao.getMonthGanZhi());
data.put("dayGanZhi", liuYao.getDayGanZhi());
data.put("hourGanZhi", liuYao.getHourGanZhi());
data.put("shangGuaName", liuYao.getShangGuaName());
data.put("xiaGuaName", liuYao.getXiaGuaName());
data.put("benGuaName", liuYao.getBenGuaName());
data.put("bianGuaName", liuYao.getBianGuaName());
data.put("huGuaName", liuYao.getHuGuaName());
data.put("cuoGuaName", liuYao.getCuoGuaName());
data.put("zongGuaName", liuYao.getZongGuaName());
data.put("fuGuaName", liuYao.getFuGuaName());
data.put("shangGuaAs", liuYao.getShangGuaAs());
data.put("xiaGuaAs", liuYao.getXiaGuaAs());
data.put("benGuaAs", liuYao.getBenGuaAs());
data.put("bianGuaAs", liuYao.getBianGuaAs());
data.put("huGuaAs", liuYao.getHuGuaAs());
data.put("cuoGuaAs", liuYao.getCuoGuaAs());
data.put("zongGuaAs", liuYao.getZongGuaAs());
data.put("fuGuaAs", liuYao.getFuGuaAs());
data.put("benGuaType", liuYao.getBenGuaType());
data.put("bianGuaType", liuYao.getBianGuaType());
data.put("huGuaType", liuYao.getHuGuaType());
data.put("cuoGuaType", liuYao.getCuoGuaType());
data.put("zongGuaType", liuYao.getZongGuaType());
data.put("fuGuaType", liuYao.getFuGuaType());
data.put("benGuaGuaShen", liuYao.getBenGuaGuaShen());
data.put("bianGuaGuaShen", liuYao.getBianGuaGuaShen());
data.put("huGuaGuaShen", liuYao.getHuGuaGuaShen());
data.put("cuoGuaGuaShen", liuYao.getCuoGuaGuaShen());
data.put("zongGuaGuaShen", liuYao.getZongGuaGuaShen());
data.put("fuGuaGuaShen", liuYao.getFuGuaGuaShen());
data.put("benGuaGuaCi", liuYao.getBenGuaGuaCi());
data.put("bianGuaGuaCi", liuYao.getBianGuaGuaCi());
data.put("huGuaGuaCi", liuYao.getHuGuaGuaCi());
data.put("cuoGuaGuaCi", liuYao.getCuoGuaGuaCi());
data.put("zongGuaGuaCi", liuYao.getZongGuaGuaCi());
data.put("fuGuaGuaCi", liuYao.getFuGuaGuaCi());
data.put("benGuaLiuYaoName", liuYao.getBenGuaLiuYaoName());
data.put("bianGuaLiuYaoName", liuYao.getBianGuaLiuYaoName());
data.put("huGuaLiuYaoName", liuYao.getHuGuaLiuYaoName());
data.put("cuoGuaLiuYaoName", liuYao.getCuoGuaLiuYaoName());
data.put("zongGuaLiuYaoName", liuYao.getZongGuaLiuYaoName());
data.put("fuGuaLiuYaoName", liuYao.getFuGuaLiuYaoName());
data.put("benGuaLiuYaoAs", liuYao.getBenGuaLiuYaoAs());
data.put("bianGuaLiuYaoAs", liuYao.getBianGuaLiuYaoAs());
data.put("huGuaLiuYaoAs", liuYao.getHuGuaLiuYaoAs());
data.put("cuoGuaLiuYaoAs", liuYao.getCuoGuaLiuYaoAs());
data.put("zongGuaLiuYaoAs", liuYao.getZongGuaLiuYaoAs());
data.put("fuGuaLiuYaoAs", liuYao.getFuGuaLiuYaoAs());
data.put("benGuaLiuYaoShiYing", liuYao.getBenGuaLiuYaoShiYing());
data.put("bianGuaLiuYaoShiYing", liuYao.getBianGuaLiuYaoShiYing());
data.put("huGuaLiuYaoShiYing", liuYao.getHuGuaLiuYaoShiYing());
data.put("cuoGuaLiuYaoShiYing", liuYao.getCuoGuaLiuYaoShiYing());
data.put("zongGuaLiuYaoShiYing", liuYao.getZongGuaLiuYaoShiYing());
data.put("fuGuaLiuYaoShiYing", liuYao.getFuGuaLiuYaoShiYing());
data.put("benGuaLiuYaoLiuQin", liuYao.getBenGuaLiuYaoLiuQin());
data.put("bianGuaLiuYaoLiuQin", liuYao.getBianGuaLiuYaoLiuQin());
data.put("huGuaLiuYaoLiuQin", liuYao.getHuGuaLiuYaoLiuQin());
data.put("cuoGuaLiuYaoLiuQin", liuYao.getCuoGuaLiuYaoLiuQin());
data.put("zongGuaLiuYaoLiuQin", liuYao.getZongGuaLiuYaoLiuQin());
data.put("fuGuaLiuYaoLiuQin", liuYao.getFuGuaLiuYaoLiuQin());
data.put("benGuaLiuYaoGanZhi", liuYao.getBenGuaLiuYaoGanZhi());
data.put("bianGuaLiuYaoGanZhi", liuYao.getBianGuaLiuYaoGanZhi());
data.put("huGuaLiuYaoGanZhi", liuYao.getHuGuaLiuYaoGanZhi());
data.put("cuoGuaLiuYaoGanZhi", liuYao.getCuoGuaLiuYaoGanZhi());
data.put("zongGuaLiuYaoGanZhi", liuYao.getZongGuaLiuYaoGanZhi());
data.put("fuGuaLiuYaoGanZhi", liuYao.getFuGuaLiuYaoGanZhi());
data.put("benGuaLiuYaoWuXing", liuYao.getBenGuaLiuYaoWuXing());
data.put("bianGuaLiuYaoWuXing", liuYao.getBianGuaLiuYaoWuXing());
data.put("huGuaLiuYaoWuXing", liuYao.getHuGuaLiuYaoWuXing());
data.put("cuoGuaLiuYaoWuXing", liuYao.getCuoGuaLiuYaoWuXing());
data.put("zongGuaLiuYaoWuXing", liuYao.getZongGuaLiuYaoWuXing());
data.put("fuGuaLiuYaoWuXing", liuYao.getFuGuaLiuYaoWuXing());
data.put("benGuaLiuYaoLiuShen", liuYao.getBenGuaLiuYaoLiuShen());
data.put("bianGuaLiuYaoLiuShen", liuYao.getBianGuaLiuYaoLiuShen());
data.put("huGuaLiuYaoLiuShen", liuYao.getHuGuaLiuYaoLiuShen());
data.put("cuoGuaLiuYaoLiuShen", liuYao.getCuoGuaLiuYaoLiuShen());
data.put("zongGuaLiuYaoLiuShen", liuYao.getZongGuaLiuYaoLiuShen());
data.put("fuGuaLiuYaoLiuShen", liuYao.getFuGuaLiuYaoLiuShen());
data.put("benGuaLiuYaoYaoCi", liuYao.getBenGuaLiuYaoYaoCi());
data.put("bianGuaLiuYaoYaoCi", liuYao.getBianGuaLiuYaoYaoCi());
data.put("huGuaLiuYaoYaoCi", liuYao.getHuGuaLiuYaoYaoCi());
data.put("cuoGuaLiuYaoYaoCi", liuYao.getCuoGuaLiuYaoYaoCi());
data.put("zongGuaLiuYaoYaoCi", liuYao.getZongGuaLiuYaoYaoCi());
data.put("fuGuaLiuYaoYaoCi", liuYao.getFuGuaLiuYaoYaoCi());
data.put("benGuaLiuYaoNaYin", liuYao.getBenGuaLiuYaoNaYin());
data.put("bianGuaLiuYaoNaYin", liuYao.getBianGuaLiuYaoNaYin());
data.put("huGuaLiuYaoNaYin", liuYao.getHuGuaLiuYaoNaYin());
data.put("cuoGuaLiuYaoNaYin", liuYao.getCuoGuaLiuYaoNaYin());
data.put("zongGuaLiuYaoNaYin", liuYao.getZongGuaLiuYaoNaYin());
data.put("fuGuaLiuYaoNaYin", liuYao.getFuGuaLiuYaoNaYin());
data.put("fuGuaLiuYaoFuShen", liuYao.getFuGuaLiuYaoFuShen());
data.put("shenSha", liuYao.getShenSha());
return data;
}
public static class LiuYaoRequest {
private String name;
private String occupy;
private Integer sex;
private String date;
private Integer dateType;
private Integer leapMonthType;
private Integer xuShiSuiType;
private Integer jieQiType;
private Integer yearGanZhiType;
private Integer monthGanZhiType;
private Integer dayGanZhiType;
private Integer paiPanType;
private String liuYaoYaoXiang;
public String getName() { return name; }
public void setName(String name) { this.name = name; }
public String getOccupy() { return occupy; }
public void setOccupy(String occupy) { this.occupy = occupy; }
public Integer getSex() { return sex; }
public void setSex(Integer sex) { this.sex = sex; }
public String getDate() { return date; }
public void setDate(String date) { this.date = date; }
public Integer getDateType() { return dateType; }
public void setDateType(Integer dateType) { this.dateType = dateType; }
public Integer getLeapMonthType() { return leapMonthType; }
public void setLeapMonthType(Integer leapMonthType) { this.leapMonthType = leapMonthType; }
public Integer getXuShiSuiType() { return xuShiSuiType; }
public void setXuShiSuiType(Integer xuShiSuiType) { this.xuShiSuiType = xuShiSuiType; }
public Integer getJieQiType() { return jieQiType; }
public void setJieQiType(Integer jieQiType) { this.jieQiType = jieQiType; }
public Integer getYearGanZhiType() { return yearGanZhiType; }
public void setYearGanZhiType(Integer yearGanZhiType) { this.yearGanZhiType = yearGanZhiType; }
public Integer getMonthGanZhiType() { return monthGanZhiType; }
public void setMonthGanZhiType(Integer monthGanZhiType) { this.monthGanZhiType = monthGanZhiType; }
public Integer getDayGanZhiType() { return dayGanZhiType; }
public void setDayGanZhiType(Integer dayGanZhiType) { this.dayGanZhiType = dayGanZhiType; }
public Integer getPaiPanType() { return paiPanType; }
public void setPaiPanType(Integer paiPanType) { this.paiPanType = paiPanType; }
public String getLiuYaoYaoXiang() { return liuYaoYaoXiang; }
public void setLiuYaoYaoXiang(String liuYaoYaoXiang) { this.liuYaoYaoXiang = liuYaoYaoXiang; }
}
}
+384 -19
View File
@@ -1,17 +1,179 @@
<template>
<view class="container">
<view class="developing">
<text class="developing-icon">🔮</text>
<text class="developing-title">六爻排盘</text>
<text class="developing-desc">功能开发中,敬请期待...</text>
<view class="header-card">
<view class="header-icon">
<text class="icon-text">爻</text>
</view>
<text class="header-title">六爻排盘</text>
<text class="header-subtitle">易经占卜 · 预测吉凶</text>
</view>
<view class="form-card">
<view class="form-section">
<view class="section-header">
<view class="section-dot"></view>
<text class="section-title">起卦信息</text>
</view>
<view class="form-item">
<view class="form-label-wrapper">
<text class="form-label">姓名</text>
</view>
<input class="form-input" v-model="name" placeholder="请输入姓名" />
</view>
<view class="form-item">
<view class="form-label-wrapper">
<text class="form-label">占事</text>
</view>
<input class="form-input" v-model="occupy" placeholder="请输入占问事项" />
</view>
<view class="form-item">
<view class="form-label-wrapper">
<text class="form-label">起卦日期</text>
</view>
<picker mode="date" :value="solarDate" @change="onDateChange" class="form-picker">
<view class="picker-content">
<text class="picker-value">{{ solarDate }}</text>
<text class="picker-arrow">›</text>
</view>
</picker>
</view>
<view class="form-item">
<view class="form-label-wrapper">
<text class="form-label">起卦时间</text>
</view>
<picker mode="time" :value="birthTime" @change="onTimeChange" class="form-picker">
<view class="picker-content">
<text class="picker-value">{{ birthTime }}</text>
<text class="picker-arrow">›</text>
</view>
</picker>
</view>
<view class="form-item">
<view class="form-label-wrapper">
<text class="form-label">性别</text>
</view>
<view class="gender-group">
<view class="gender-item" :class="{ active: gender === '男' }" @click="gender = '男'">
<text class="gender-text">男</text>
</view>
<view class="gender-item" :class="{ active: gender === '女' }" @click="gender = '女'">
<text class="gender-text">女</text>
</view>
</view>
</view>
</view>
<view class="form-section" style="margin-top: 30rpx;">
<view class="section-header">
<view class="section-dot"></view>
<text class="section-title">起卦方式</text>
</view>
<view class="form-item">
<view class="form-label-wrapper">
<text class="form-label">起卦方法</text>
</view>
<view class="gender-group">
<view class="gender-item" :class="{ active: paiPanType === 0 }" @click="paiPanType = 0">
<text class="gender-text">时间起卦</text>
</view>
<view class="gender-item" :class="{ active: paiPanType === 1 }" @click="paiPanType = 1">
<text class="gender-text">手动输入</text>
</view>
</view>
</view>
<view v-if="paiPanType === 1" class="yao-input-section">
<text class="yao-input-title">请输入六爻(用逗号分隔)</text>
<text class="yao-input-desc">格式示例:—,—,--,--,--,—(阳爻用"—",阴爻用"--")</text>
<input class="yao-input" v-model="liuYaoYaoXiang" placeholder="—,—,--,--,--,—" />
</view>
</view>
</view>
<view class="tips-card">
<text class="tips-title">起卦说明</text>
<text class="tips-content">六爻排盘通过起卦时间或手动输入卦象,推算本卦、变卦、互卦、错卦、综卦等信息,预测事物发展趋势。</text>
</view>
<view class="btn-wrapper">
<button class="submit-btn" @click="calculate" :disabled="loading">
<text class="btn-text">{{ loading ? '排盘中...' : '开始排盘' }}</text>
</button>
</view>
</view>
</template>
<script>
import api from '@/utils/api.js'
export default {
data() {
return {}
return {
name: '',
occupy: '',
solarDate: '2000-01-01',
birthTime: '12:00',
gender: '男',
paiPanType: 0,
liuYaoYaoXiang: '—,—,--,--,--,—',
loading: false
}
},
methods: {
onDateChange(e) {
this.solarDate = e.detail.value
},
onTimeChange(e) {
this.birthTime = e.detail.value
},
async calculate() {
if (this.loading) return
this.loading = true
uni.showLoading({
title: '排盘中...',
mask: true
})
try {
const dateStr = this.solarDate + ' ' + this.birthTime + ':00'
const result = await api.liuyaoApi.paiPan({
name: this.name || '某人',
occupy: this.occupy || '某事',
sex: this.gender === '男' ? 1 : 0,
date: dateStr,
dateType: 0,
paiPanType: this.paiPanType,
liuYaoYaoXiang: this.liuYaoYaoXiang
})
getApp().globalData.liuyaoResult = result
uni.hideLoading()
uni.navigateTo({
url: '/pages/liuyao/result'
})
} catch (e) {
uni.hideLoading()
console.error('排盘错误:', e)
uni.showToast({
title: '排盘失败:' + (e.message || '未知错误'),
icon: 'none',
duration: 3000
})
} finally {
this.loading = false
}
}
}
}
</script>
@@ -21,32 +183,235 @@ export default {
padding: 20rpx;
background-color: #f5f5f5;
min-height: 100vh;
}
.header-card {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-radius: 20rpx;
padding: 40rpx;
margin-bottom: 20rpx;
text-align: center;
box-shadow: 0 4rpx 20rpx rgba(102, 126, 234, 0.3);
}
.header-icon {
width: 80rpx;
height: 80rpx;
background: rgba(255, 255, 255, 0.2);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin: 0 auto 20rpx;
}
.developing {
text-align: center;
padding: 60rpx;
}
.developing-icon {
font-size: 120rpx;
display: block;
margin-bottom: 40rpx;
}
.developing-title {
.icon-text {
font-size: 40rpx;
color: #fff;
font-weight: bold;
color: #333;
}
.header-title {
font-size: 36rpx;
font-weight: bold;
color: #fff;
display: block;
margin-bottom: 10rpx;
}
.header-subtitle {
font-size: 24rpx;
color: rgba(255, 255, 255, 0.8);
}
.form-card {
background: #fff;
border-radius: 20rpx;
padding: 30rpx;
margin-bottom: 20rpx;
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
}
.form-section {
margin-bottom: 20rpx;
}
.developing-desc {
.section-header {
display: flex;
align-items: center;
margin-bottom: 20rpx;
}
.section-dot {
width: 8rpx;
height: 8rpx;
background: #667eea;
border-radius: 50%;
margin-right: 10rpx;
}
.section-title {
font-size: 28rpx;
font-weight: bold;
color: #333;
}
.form-item {
margin-bottom: 25rpx;
}
.form-label-wrapper {
margin-bottom: 10rpx;
}
.form-label {
font-size: 26rpx;
color: #666;
}
.form-input {
width: 100%;
height: 80rpx;
background: #f8f8f8;
border-radius: 10rpx;
padding: 0 20rpx;
font-size: 28rpx;
color: #333;
box-sizing: border-box;
}
.form-picker {
width: 100%;
}
.picker-content {
width: 100%;
height: 80rpx;
background: #f8f8f8;
border-radius: 10rpx;
padding: 0 20rpx;
display: flex;
align-items: center;
justify-content: space-between;
box-sizing: border-box;
}
.picker-value {
font-size: 28rpx;
color: #333;
}
.picker-arrow {
font-size: 32rpx;
color: #999;
}
.gender-group {
display: flex;
gap: 20rpx;
}
.gender-item {
flex: 1;
height: 80rpx;
background: #f8f8f8;
border-radius: 10rpx;
display: flex;
align-items: center;
justify-content: center;
transition: all 0.3s;
}
.gender-item.active {
background: #667eea;
}
.gender-text {
font-size: 28rpx;
color: #666;
}
.gender-item.active .gender-text {
color: #fff;
}
.yao-input-section {
margin-top: 20rpx;
padding: 20rpx;
background: #f8f8f8;
border-radius: 10rpx;
}
.yao-input-title {
font-size: 26rpx;
color: #333;
font-weight: bold;
display: block;
margin-bottom: 10rpx;
}
.yao-input-desc {
font-size: 22rpx;
color: #999;
display: block;
margin-bottom: 15rpx;
}
.yao-input {
width: 100%;
height: 80rpx;
background: #fff;
border-radius: 10rpx;
padding: 0 20rpx;
font-size: 28rpx;
color: #333;
box-sizing: border-box;
}
.tips-card {
background: #fff5e6;
border-radius: 20rpx;
padding: 30rpx;
margin-bottom: 20rpx;
border-left: 6rpx solid #ffa500;
}
.tips-title {
font-size: 28rpx;
font-weight: bold;
color: #ff8c00;
display: block;
margin-bottom: 10rpx;
}
.tips-content {
font-size: 24rpx;
color: #666;
line-height: 1.6;
}
.btn-wrapper {
padding: 20rpx 0;
}
.submit-btn {
width: 100%;
height: 90rpx;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-radius: 45rpx;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 4rpx 15rpx rgba(102, 126, 234, 0.4);
}
.submit-btn[disabled] {
opacity: 0.6;
}
.btn-text {
font-size: 32rpx;
color: #fff;
font-weight: bold;
}
</style>
@@ -0,0 +1,496 @@
<template>
<view class="container">
<view class="header-card">
<view class="header-row">
<view class="header-icon">
<text class="icon-text">爻</text>
</view>
<view class="header-info">
<text class="header-title">{{ result.name || '六爻卦象' }}</text>
<text class="header-subtitle">{{ result.benGuaName }} · {{ result.benGuaType }}</text>
</view>
</view>
</view>
<view class="info-card">
<view class="info-row">
<view class="info-item">
<text class="info-label">公历</text>
<text class="info-value">{{ result.solar || '-' }}</text>
</view>
<view class="info-divider"></view>
<view class="info-item">
<text class="info-label">农历</text>
<text class="info-value">{{ result.lunar || '-' }}</text>
</view>
</view>
</view>
<view class="gua-card">
<view class="card-header">
<view class="card-dot"></view>
<text class="card-title">卦象总览</text>
</view>
<view class="gua-overview">
<view class="gua-item">
<text class="gua-label">本卦</text>
<text class="gua-symbol">{{ result.benGuaAs }}</text>
<text class="gua-name">{{ result.benGuaName }}</text>
</view>
<view class="gua-arrow">→</view>
<view class="gua-item">
<text class="gua-label">变卦</text>
<text class="gua-symbol">{{ result.bianGuaAs }}</text>
<text class="gua-name">{{ result.bianGuaName }}</text>
</view>
</view>
<view class="gua-grid">
<view class="gua-grid-item">
<text class="grid-label">互卦</text>
<text class="grid-value">{{ result.huGuaName }} {{ result.huGuaAs }}</text>
</view>
<view class="gua-grid-item">
<text class="grid-label">错卦</text>
<text class="grid-value">{{ result.cuoGuaName }} {{ result.cuoGuaAs }}</text>
</view>
<view class="gua-grid-item">
<text class="grid-label">综卦</text>
<text class="grid-value">{{ result.zongGuaName }} {{ result.zongGuaAs }}</text>
</view>
<view class="gua-grid-item">
<text class="grid-label">伏卦</text>
<text class="grid-value">{{ result.fuGuaName }} {{ result.fuGuaAs }}</text>
</view>
</view>
</view>
<view class="liuyao-card">
<view class="card-header">
<view class="card-dot cyan"></view>
<text class="card-title">六爻详盘</text>
</view>
<view class="liuyao-table">
<view class="liuyao-row liuyao-header">
<view class="liuyao-cell header-cell">爻位</view>
<view class="liuyao-cell header-cell">六神</view>
<view class="liuyao-cell header-cell">世应</view>
<view class="liuyao-cell header-cell">卦象</view>
<view class="liuyao-cell header-cell">六亲</view>
<view class="liuyao-cell header-cell">干支</view>
<view class="liuyao-cell header-cell">五行</view>
<view class="liuyao-cell header-cell">纳音</view>
</view>
<view v-for="(yao, index) in liuYaoData" :key="index" class="liuyao-row">
<view class="liuyao-cell label-cell">{{ yao.name }}</view>
<view class="liuyao-cell">{{ yao.liuShen }}</view>
<view class="liuyao-cell">{{ yao.shiYing }}</view>
<view class="liuyao-cell yao-cell">{{ yao.yaoXiang }}</view>
<view class="liuyao-cell">{{ yao.liuQin }}</view>
<view class="liuyao-cell">{{ yao.ganZhi }}</view>
<view class="liuyao-cell">{{ yao.wuXing }}</view>
<view class="liuyao-cell small-cell">{{ yao.naYin }}</view>
</view>
</view>
</view>
<view class="guaci-card">
<view class="card-header">
<view class="card-dot orange"></view>
<text class="card-title">卦辞爻辞</text>
</view>
<view class="guaci-section">
<text class="guaci-title">本卦卦辞</text>
<text class="guaci-content">{{ result.benGuaGuaCi || '暂无' }}</text>
</view>
<view class="guaci-section">
<text class="guaci-title">变卦卦辞</text>
<text class="guaci-content">{{ result.bianGuaGuaCi || '暂无' }}</text>
</view>
<view class="yaoci-section">
<text class="yaoci-title">本卦爻辞</text>
<view v-for="(yaoCi, index) in result.benGuaLiuYaoYaoCi" :key="index" class="yaoci-item">
<text class="yaoci-name">{{ result.benGuaLiuYaoName[index] }}:</text>
<text class="yaoci-text">{{ yaoCi }}</text>
</view>
</view>
</view>
<view class="extra-card">
<view class="card-header">
<view class="card-dot purple"></view>
<text class="card-title">其他信息</text>
</view>
<view class="extra-grid">
<view class="extra-item">
<text class="extra-label">上卦</text>
<text class="extra-value">{{ result.shangGuaName }} {{ result.shangGuaAs }}</text>
</view>
<view class="extra-item">
<text class="extra-label">下卦</text>
<text class="extra-value">{{ result.xiaGuaName }} {{ result.xiaGuaAs }}</text>
</view>
<view class="extra-item">
<text class="extra-label">本卦卦身</text>
<text class="extra-value">{{ result.benGuaGuaShen || '-' }}</text>
</view>
<view class="extra-item">
<text class="extra-label">变卦卦身</text>
<text class="extra-value">{{ result.bianGuaGuaShen || '-' }}</text>
</view>
<view class="extra-item">
<text class="extra-label">月相</text>
<text class="extra-value">{{ result.yueXiang || '-' }}</text>
</view>
<view class="extra-item">
<text class="extra-label">月将</text>
<text class="extra-value">{{ result.yueJiang || '-' }}</text>
</view>
<view class="extra-item">
<text class="extra-label">月将神</text>
<text class="extra-value">{{ result.yueJiangShen || '-' }}</text>
</view>
<view class="extra-item">
<text class="extra-label">五不遇时</text>
<text class="extra-value">{{ result.wuBuYuShi ? '是' : '否' }}</text>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
result: {}
}
},
computed: {
liuYaoData() {
if (!this.result.benGuaLiuYaoName) return []
const data = []
for (let i = 0; i < 6; i++) {
data.push({
name: this.result.benGuaLiuYaoName[i] || '-',
liuShen: this.result.benGuaLiuYaoLiuShen[i] || '-',
shiYing: this.result.benGuaLiuYaoShiYing[i] || '-',
yaoXiang: this.result.benGuaLiuYaoAs[i] || '-',
liuQin: this.result.benGuaLiuYaoLiuQin[i] || '-',
ganZhi: this.result.benGuaLiuYaoGanZhi[i] || '-',
wuXing: this.result.benGuaLiuYaoWuXing[i] || '-',
naYin: this.result.benGuaLiuYaoNaYin[i] || '-'
})
}
return data.reverse()
}
},
onLoad() {
this.result = getApp().globalData.liuyaoResult || {}
}
}
</script>
<style scoped>
.container {
padding: 20rpx;
background-color: #f5f5f5;
min-height: 100vh;
}
.header-card {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
border-radius: 20rpx;
padding: 30rpx;
margin-bottom: 20rpx;
box-shadow: 0 4rpx 20rpx rgba(102, 126, 234, 0.3);
}
.header-row {
display: flex;
align-items: center;
}
.header-icon {
width: 70rpx;
height: 70rpx;
background: rgba(255, 255, 255, 0.2);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
margin-right: 20rpx;
}
.icon-text {
font-size: 36rpx;
color: #fff;
font-weight: bold;
}
.header-info {
flex: 1;
}
.header-title {
font-size: 32rpx;
font-weight: bold;
color: #fff;
display: block;
margin-bottom: 8rpx;
}
.header-subtitle {
font-size: 24rpx;
color: rgba(255, 255, 255, 0.8);
}
.info-card {
background: #fff;
border-radius: 20rpx;
padding: 25rpx;
margin-bottom: 20rpx;
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
}
.info-row {
display: flex;
align-items: center;
}
.info-item {
flex: 1;
text-align: center;
}
.info-label {
font-size: 24rpx;
color: #999;
display: block;
margin-bottom: 8rpx;
}
.info-value {
font-size: 26rpx;
color: #333;
}
.info-divider {
width: 1rpx;
height: 50rpx;
background: #eee;
}
.gua-card, .liuyao-card, .guaci-card, .extra-card {
background: #fff;
border-radius: 20rpx;
padding: 25rpx;
margin-bottom: 20rpx;
box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
}
.card-header {
display: flex;
align-items: center;
margin-bottom: 20rpx;
}
.card-dot {
width: 8rpx;
height: 8rpx;
background: #667eea;
border-radius: 50%;
margin-right: 10rpx;
}
.card-dot.cyan {
background: #00bcd4;
}
.card-dot.orange {
background: #ff9800;
}
.card-dot.purple {
background: #9c27b0;
}
.card-title {
font-size: 28rpx;
font-weight: bold;
color: #333;
}
.gua-overview {
display: flex;
align-items: center;
justify-content: space-around;
padding: 30rpx 0;
margin-bottom: 20rpx;
}
.gua-item {
text-align: center;
}
.gua-label {
font-size: 24rpx;
color: #999;
display: block;
margin-bottom: 10rpx;
}
.gua-symbol {
font-size: 60rpx;
color: #667eea;
display: block;
margin-bottom: 10rpx;
}
.gua-name {
font-size: 26rpx;
color: #333;
font-weight: bold;
}
.gua-arrow {
font-size: 40rpx;
color: #999;
}
.gua-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 15rpx;
}
.gua-grid-item {
background: #f8f8f8;
padding: 15rpx;
border-radius: 10rpx;
}
.grid-label {
font-size: 22rpx;
color: #999;
display: block;
margin-bottom: 5rpx;
}
.grid-value {
font-size: 24rpx;
color: #333;
}
.liuyao-table {
width: 100%;
overflow-x: auto;
}
.liuyao-row {
display: flex;
border-bottom: 1rpx solid #f0f0f0;
}
.liuyao-row:last-child {
border-bottom: none;
}
.liuyao-cell {
flex: 1;
min-width: 80rpx;
padding: 15rpx 5rpx;
text-align: center;
font-size: 22rpx;
color: #333;
}
.liuyao-cell.header-cell {
font-weight: bold;
color: #666;
background: #f8f8f8;
}
.liuyao-cell.label-cell {
font-weight: bold;
color: #667eea;
}
.liuyao-cell.yao-cell {
font-size: 28rpx;
font-weight: bold;
color: #333;
}
.liuyao-cell.small-cell {
font-size: 20rpx;
}
.guaci-section, .yaoci-section {
margin-bottom: 20rpx;
}
.guaci-title, .yaoci-title {
font-size: 26rpx;
font-weight: bold;
color: #333;
display: block;
margin-bottom: 10rpx;
}
.guaci-content {
font-size: 24rpx;
color: #666;
line-height: 1.6;
}
.yaoci-item {
margin-bottom: 10rpx;
padding: 10rpx;
background: #f8f8f8;
border-radius: 8rpx;
}
.yaoci-name {
font-size: 24rpx;
font-weight: bold;
color: #667eea;
}
.yaoci-text {
font-size: 24rpx;
color: #666;
}
.extra-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 15rpx;
}
.extra-item {
background: #f8f8f8;
padding: 15rpx;
border-radius: 10rpx;
}
.extra-label {
font-size: 22rpx;
color: #999;
display: block;
margin-bottom: 5rpx;
}
.extra-value {
font-size: 24rpx;
color: #333;
}
</style>
+25
View File
@@ -53,7 +53,32 @@ const baziApi = {
}
}
const liuyaoApi = {
paiPan: (data) => {
return request({
url: '/liuyao/paipan',
method: 'POST',
data: {
name: data.name || '某人',
occupy: data.occupy || '某事',
sex: data.sex || 1,
date: data.date,
dateType: data.dateType || 0,
leapMonthType: data.leapMonthType || 0,
xuShiSuiType: data.xuShiSuiType || 0,
jieQiType: data.jieQiType || 1,
yearGanZhiType: data.yearGanZhiType || 2,
monthGanZhiType: data.monthGanZhiType || 1,
dayGanZhiType: data.dayGanZhiType || 0,
paiPanType: data.paiPanType || 0,
liuYaoYaoXiang: data.liuYaoYaoXiang || '—,—,--,--,--,—'
}
})
}
}
export default {
baziApi,
liuyaoApi,
request
}