Skip to content

Commit

Permalink
feature: add about (#24)
Browse files Browse the repository at this point in the history
  • Loading branch information
@dreamhunter2333
dreamhunter2333 authored May 23, 2023
1 parent f997bf5 commit d633ee7
Show file tree
Hide file tree
Showing 2 changed files with 172 additions and 61 deletions.
144 changes: 83 additions & 61 deletions frontend/src/App.vue
View file
Original file line number Diff line number Diff line change
@@ -1,16 +1,20 @@
<script setup>
import { NGrid, NGi, NInput, NButton, NSpace, NCard, NSpin, NTabs, NTabPane, NDatePicker, NSelect, NFormItem, NInputNumber } from 'naive-ui'
import { NGrid, NGi, NInput, NButton, NSpace, NCard, NSpin, NDatePicker, NSelect, NFormItem, NInputNumber, NLayout, NMenu, NTabs, NTabPane } from 'naive-ui'
import { watch, onMounted, ref } from "vue";
import MarkdownIt from 'markdown-it';
import { DIVINATION_OPTIONS, ABOUT } from "./constants"
const prompt = ref("");
const result = ref("");
const prompt_type = ref("tarot");
const menu_type = ref("divination");
const lunarBirthday = ref('龙年 庚辰年 七月十八 巨蟹座')
const birthday = ref("2000-08-17 00:00:00");
const loading = ref(false);
const API_BASE = import.meta.env.VITE_API_BASE || "";
const md = new MarkdownIt();
const about = md.render(ABOUT);
const sex = ref("")
const surname = ref("")
const new_name_prompt = ref("")
Expand Down Expand Up @@ -82,67 +86,85 @@ onMounted(() => {
<n-spin :show="loading">
<div class="main">
<n-space vertical>
<h1>AI 占卜</h1>
<h4>本项目仅供娱乐</h4>
<n-tabs v-model:value="prompt_type" type="segment" animated>
<n-tab-pane name="tarot" tab="塔罗牌">
<n-input v-model:value="prompt" type="textarea" round maxlength="40" :autosize="{ minRows: 3 }"
placeholder="我的财务状况如何" />
</n-tab-pane>
<n-tab-pane name="birthday" tab="生辰八字">
<div style="display: inline-block;">
<n-form-item label="生日" label-placement="left">
<n-date-picker v-model:formatted-value="birthday" value-format="yyyy-MM-dd HH:mm:ss"
type="datetime" />
</n-form-item>
<p>农历: {{ lunarBirthday }}</p>
</div>
</n-tab-pane>
<n-tab-pane name="new_name" tab="起名">
<div style="display: inline-block;">
<n-form-item label="姓氏" label-placement="left">
<n-input v-model:value="surname" type="text" maxlength="2" placeholder="请输入姓氏" />
</n-form-item>
<n-form-item label="性别" label-placement="left">
<n-select v-model:value="sex" :options="sexOptions" />
</n-form-item>
<n-form-item label="生日" label-placement="left">
<n-date-picker v-model:formatted-value="birthday" value-format="yyyy-MM-dd HH:mm:ss"
type="datetime" />
</n-form-item>
<n-form-item label="附加" label-placement="left">
<n-input v-model:value="new_name_prompt" type="text" maxlength="20" placeholder="" />
</n-form-item>
<p>农历: {{ lunarBirthday }}</p>
</div>
</n-tab-pane>
<n-tab-pane name="name" tab="姓名五格">
<n-input v-model:value="prompt" type="text" maxlength="10" round placeholder="请输入姓名" />
</n-tab-pane>
<n-tab-pane name="dream" tab="周公解梦">
<n-input v-model:value="prompt" type="textarea" round maxlength="40" :autosize="{ minRows: 3 }"
placeholder="请输入你的梦境" />
</n-tab-pane>
<n-tab-pane name="plum_flower" tab="梅花易数">
<div style="display: inline-block;">
<h4>请随机输入两个 0-1000 的数字</h4>
<n-form-item label="数字一" label-placement="left">
<n-input-number v-model:value="plum_flower.num1" :min="0" :max="1000" />
</n-form-item>
<n-form-item label="数字二" label-placement="left">
<n-input-number v-model:value="plum_flower.num2" :min="0" :max="1000" />
</n-form-item>
<h2>AI 占卜 - 本项目仅供娱乐</h2>
<n-layout>
<n-layout>
<n-tabs v-model:value="menu_type" type="segment" animated>
<n-tab-pane name="divination" tab="占卜">
</n-tab-pane>
<n-tab-pane name="about" tab=" 关于">
</n-tab-pane>
</n-tabs>
<div v-if="menu_type == 'divination'">
<div style="display: inline-block;">
<n-form-item label="占卜方式" label-placement="left">
<n-select v-model:value="prompt_type" :consistent-menu-width="false" value-field="key"
:options="DIVINATION_OPTIONS" />
</n-form-item>
</div>
<div v-if="prompt_type == 'tarot'">
<n-input v-model:value="prompt" type="textarea" round maxlength="40" :autosize="{ minRows: 3 }"
placeholder="我的财务状况如何" />
</div>
<div v-if="prompt_type == 'birthday'">
<div style="display: inline-block;">
<n-form-item label="生日" label-placement="left">
<n-date-picker v-model:formatted-value="birthday" value-format="yyyy-MM-dd HH:mm:ss"
type="datetime" />
</n-form-item>
<p>农历: {{ lunarBirthday }}</p>
</div>
</div>
<div v-if="prompt_type == 'new_name'">
<div style="display: inline-block;">
<n-form-item label="姓氏" label-placement="left">
<n-input v-model:value="surname" type="text" maxlength="2" placeholder="请输入姓氏" />
</n-form-item>
<n-form-item label="性别" label-placement="left">
<n-select v-model:value="sex" :options="sexOptions" />
</n-form-item>
<n-form-item label="生日" label-placement="left">
<n-date-picker v-model:formatted-value="birthday" value-format="yyyy-MM-dd HH:mm:ss"
type="datetime" />
</n-form-item>
<n-form-item label="附加" label-placement="left">
<n-input v-model:value="new_name_prompt" type="text" maxlength="20" placeholder="" />
</n-form-item>
<p>农历: {{ lunarBirthday }}</p>
</div>
</div>
<div v-if="prompt_type == 'name'">
<div style="display: inline-block;">
<n-input v-model:value="prompt" type="text" maxlength="10" round placeholder="请输入姓名" />
</div>
</div>
<div v-if="prompt_type == 'dream'">
<n-input v-model:value="prompt" type="textarea" round maxlength="40" :autosize="{ minRows: 3 }"
placeholder="请输入你的梦境" />
</div>
<div v-if="prompt_type == 'plum_flower'">
<div style="display: inline-block;">
<h4>请随机输入两个 0-1000 的数字</h4>
<n-form-item label="数字一" label-placement="left">
<n-input-number v-model:value="plum_flower.num1" :min="0" :max="1000" />
</n-form-item>
<n-form-item label="数字二" label-placement="left">
<n-input-number v-model:value="plum_flower.num2" :min="0" :max="1000" />
</n-form-item>
</div>
</div>
<div v-if="menu_type != 'about'" class="button-container">
<n-button class="center" @click="onSubmit" tertiary round type="primary">
占卜
</n-button>
</div>
</div>
</n-tab-pane>
</n-tabs>
<div class="button-container">
<n-button class="center" @click="onSubmit" tertiary round type="primary">
占卜
</n-button>
</div>
<n-card title="占卜结果">
<div class="result" v-html="result"></div>
</n-card>
<n-card :title="menu_type == 'about' ? '' : '占卜结果'">
<div v-if="menu_type != 'about'" class="result" v-html="result"></div>
<div v-else class="result" v-html="about"></div>
</n-card>
</n-layout>
</n-layout>
</n-space>
</div>
</n-spin>
Expand Down
89 changes: 89 additions & 0 deletions frontend/src/constants.js
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
export const DIVINATION_OPTIONS = [
{
label: '塔罗牌',
key: 'tarot',
},
{
label: '生辰八字',
key: 'birthday',
},
{
label: '起名',
key: 'new_name',
},
{
label: '姓名五格',
key: 'name',
},
{
label: '周公解梦',
key: 'dream',
},
{
label: '梅花易数',
key: 'plum_flower',
},
];

export const ABOUT = `# 关于 & 名词解释
## 姓名五格
姓名五格是一种基于姓名的命理学系统，用于分析和推测个人的性格特点、潜能、运势等。它认为每个汉字都有特定的音、义、形，通过对姓名中每个字的五行属性、音数、字义等进行综合分析，来揭示人的命运和性格。
姓名五格通常包括以下几个要素：
- 姓名的五行属性：每个字都有对应的五行属性（木、火、土、金、水），通过分析姓名中每个字的五行属性及其相互关系，推断个人的五行特征和命理属性。
- 音数：每个汉字都有对应的音数，即字的发音。根据姓名中每个字的音数，结合五行属性进行分析，推测个人的气场、性格倾向等。
- 字义：每个汉字都有独特的字义，即字的含义。通过分析姓名中每个字的字义，可以了解个人的个性、才能、命运走势等方面的特点。
- 五格相生相克：根据五行相生相克的原理，分析姓名中字的相生相克关系，推断个人的五行平衡度和命运趋势。
基于以上要素，姓名五格系统可以提供一些关于个人性格、潜能、事业、婚姻、健康等方面的推测和指导。然而，需要注意的是，姓名五格只是命理学的一种方法，它并不能完全决定一个人的命运，人的成长和发展还受到多种其他因素的影响，如个人的努力、环境等。因此，对于姓名五格的解读，可以作为参考和思考的一部分，但并不是唯一的决定因素。
## 梅花易数
梅花易数，也被称为梅花课，是中国古代的一种占卜方法，用于预测未来的情况或获取对事物的洞察。它是基于易经的原理和符号体系，并结合了数学计算、象征意义和直观感知等元素。
梅花易数的核心是八卦和六十四卦的应用。八卦是易经中的基本符号，由三个连续的爻线组成，每个爻线可以是阳爻（实线）或阴爻（虚线）。六十四卦是由八卦的各种组合形成的，每个卦象都具有特定的含义和象征。
在梅花易数中，通过抛掷三枚硬币或使用梅花签等方式，得到一个具体的卦象，然后根据卦象的含义和相关的解释进行解读和分析。这包括卦象的上下卦、爻辞、彖象等内容，以及与个人问题或事物相关联的其他因素。
梅花易数被认为是一种超越时间和空间的智慧系统，可以帮助人们了解自己和周围世界的变化，并提供一种思考和决策的方法。它在历史上广泛应用于预测、决策、命理等方面，被视为一种神秘而有用的工具。然而，解读梅花易数需要一定的学习和实践，通常由梅花易数的专家或者经验丰富的人来进行。
## 周公解梦
周公解梦是古代中国的一种解梦方法，相传源于周公旦（姬旦），是西周时期的著名政治家和周朝的创立者之一。根据传说，周公旦具有解梦的能力，他能够解读人们在睡梦中所见到的各种象征和意象，并给予相应的解释和指导。
周公解梦的理论基础是根据梦境中的符号、情节、动作等来推测梦的含义和预示，认为梦境是人的内心活动和潜意识的表达。根据不同的梦境内容，周公解梦给出了相应的解释和预测，帮助人们理解梦境中的信息，以及对未来的一些暗示。
周公解梦在古代中国的文化中有着重要的地位，被广泛应用于各个领域，包括政治、官场、军事、家庭生活等。人们常常通过周公解梦来寻求对未来的预测和指导，以及对自己内心深处的追求和疑问的解答。
然而，需要注意的是，周公解梦属于民间迷信范畴，其解释和预测并没有科学依据，仅供娱乐和参考之用。梦境的解读还需要结合个人的具体情境和经历，不能过分依赖解梦结果对自己的决策和行为产生影响。
## 塔罗牌
塔罗牌（Tarot Cards）是一种起源于欧洲的占卜工具，常用于预测未来、探索内心和提供指导。它由一副包含78张卡牌的牌组组成，每张牌都有特定的图案和象征意义。
塔罗牌最早被认为起源于15世纪的意大利，最初并非用于占卜，而是用作纸牌游戏。然而，随着时间的推移，人们开始将其用于占卜和心灵探索。塔罗牌在18世纪末和19世纪初逐渐流行起来，成为心灵和神秘主义领域的重要工具。
一副标准的塔罗牌包含两个主要部分：大阿卡纳（Major Arcana）和小阿卡纳（Minor Arcana）。大阿卡纳由22张牌组成，每张牌都代表着不同的象征和主题，如命运、力量、正义等。小阿卡纳则包含56张牌，分为四个花色，分别是权杖、圣杯、宝剑和金币，每个花色包含10张数值牌和4张面值牌。
使用塔罗牌进行占卜时，占卜者通常会根据提问者的问题或者目的，从牌组中抽取一定数量的牌，并根据牌面的象征意义进行解读。每张牌都有独特的含义，结合占卜者的直觉和经验，可以提供对过去、现在和未来的洞察，以及对个人内在世界的反思和指导。
需要注意的是，塔罗牌不是预测命运的工具，而是提供了一种反思和指导的方式。占卜的结果和解读可以因个人的解读角度、经验和直觉而有所不同。因此，使用塔罗牌时应持有开放的心态，将其作为一个工具来启发思考和探索内心世界，而不是将其作为绝对真理。
## 生辰八字
生辰八字测算是一种中华民族传统的命理学方法，也称为八字命理或八字算命。它基于农历出生日期和时间，通过八个字来揭示个人的命运、性格特点和吉凶运势等信息。
八字指的是年、月、日、时四个单位的天干和地支。天干由十个干支（甲、乙、丙、丁、戊、己、庚、辛、壬、癸）组成，地支由十二个生肖（鼠、牛、虎、兔、龙、蛇、马、羊、猴、鸡、狗、猪）组成。根据出生年份的天干地支，可以推算出对应的年柱；根据出生月、日、时的天干地支，可以推算出对应的月柱、日柱和时柱。
生辰八字的过程涉及到天干地支的相应计算和推算方法。一旦生成了八字，就可以根据八字的组合和相互关系，结合命理学理论，进行测算和解读。通过分析八字的五行属性、阴阳平衡、天干地支的相生相克关系等，可以推断出个人的命运走势、事业发展、婚姻状况、健康状况等方面的特点和趋势。
生辰八字和进行八字测算通常需要借助专业的命理学软件、书籍或请教命理师。同时，八字测算是一门复杂的学问，需要深入的学习和实践才能准确解读和理解。因此，在进行八字测算时，建议寻求专业人士的指导和解读，以获取更准确的结果和指导。
`

export default {}

0 comments on commit d633ee7

Please sign in to comment.