六十四卦象 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <!-- 引入样式 -->
        <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
        <!-- 引入组件库 -->
        <script src="https://unpkg.com/vue@2.6.14/dist/vue.js"></script>
        <script src="https://unpkg.com/element-ui/lib/index.js"></script>
        <title></title>
    </head>
    <body>
        <div id="app">
            <h1>六十四卦</h1>
            <el-input  placeholder="可请输入卦象模糊查询" v-model="searchVal" rows="2" style="width:350px;margin-right:30px;"></el-input>
            <el-table
                :data="querySearch"
                :height="screenHeight"
                border
                stripe
                style="width: 100%">
                <el-table-column  prop="name" label="卦象" width="180"></el-table-column>
                <el-table-column  prop="desc" label="卦辞" width="auto"></el-table-column>
            </el-table>
        </div>
        
        <script>
            new Vue({
                el:'#app',
                data: function() {
                    return {
                        searchVal:'',
                        tableData:[
                            {name:'乾为天', desc: '虽无情，但纯正'},
                            {name:'水雷屯', desc: '雨水屯集在雷层，等待时机，便会惊雷降雨'},
                            {name:'山水蒙', desc: '坎为泉，山下出泉。泉水始流出山，则必将渐汇成江河，正如蒙稚渐启，又山下有险，因为有险停止不前，所以蒙昧不明。另记：山中有雾（水）气萦绕，故有朦胧之象'},
                            {name:'水天需', desc: '雨水顺应天道，适时而降'},
                            {name:'天水讼', desc: '相争之口水犹如九天之水，故有讼'},
                            {name:'地水师', desc: '地下之水默默地滋润大地万物，好似老师的迁移默化'},
                            {name:'水地比', desc: '水在大地之上形成江河湖泊，此乃相亲相比和睦之象'},
                            {name:'风天小畜', desc: '风只在天上吹，难积云成雨，气候不好不坏，收成一般，所以只能小有积蓄'},
                            {name:'天泽履', desc: '君子(乾为君)处世为人，如行于沼泽之上，只有行事谨慎，遵循道义，才能履险如夷'},
                            {name:'地天泰', desc: '乾下坤上，地气上升，乾气下降，阴阳二气一升一降，互相交合，顺畅通达，万物安泰祥和。另记，人民大众(地)翻身做主(天)，呈现民安民安乐泰之象'},
                            {name:'天地否', desc: '天气上升，地气下降，天地之气不交，闭塞不通。 (否:闭塞，不好。) 另记，富在高高在上，贫在卑贱处下，贫富差距大，否态终会出现'},
                            {name:'天火同人', desc: '天居高处，火势熊熊而上，喻指众人拾材火焰高，象征团结。另记：君子天火如太阳，永远对万物一视同人(同仁)'},
                            {name:'火天大有', desc: '太阳在天，普照大地，促万物生长，使万物大有'},
                            {name:'地山谦', desc: '为高山隐藏于地中之象，象征高才美德隐于心中而不外露，是为谦'},
                            {name:'雷地豫', desc: '雷惊于地，预示大地回春，万物欣欣向荣。(豫:欢喜，快乐，安乐，舒服，同“预”。)'},
                            {name:'泽雷随', desc: '震木在兑泽之下，木必随水飘荡，随着，顺也'},
                            {name:'山风蛊', desc: '山中内部虚空，起乱象之风，因此需救弊治乱、拨乱反正'},
                            {name:'地泽临', desc: '地上泽下，地居高临下，润泽于四方，象征督导。(临：表示从上向下看，在高处朝向低处，到，来，遭遇，碰到等。)'},
                            {name:'风地观', desc: '风运行于地之上，周游观览，俯察万物'},
                            {name:'火雷噬嗑', desc: '震雷下离火之上，为雷电交击之表象。雷电交击，就像咬合一样；雷有威慑力，电能放光明，古代帝王效法这一现象，明其刑法，正其法令。另记：上有火山喷发，下有地震四方，大自然遵循天道的法则而得以长久运行，人类更应明其刑法，正其法令，才能长足发展'},
                            {name:'山火贲', desc: '山下火焰把山上草木万物照得通明，如同披彩，这就叫装饰。(贲:装饰。)'},
                            {name:'山地剥', desc: '山附于地，喻山石崩而剥落于地面上。另解：高山受侵蚀风化，逐渐接近地表之象，因而象征剥落'},
                            {name:'地雷复', desc: '雷在地中，阳气微弱的活动之表象，象征复归'},
                            {name:'天雷无妄', desc: '天下有雷动之象，象征着天用雷的威势警戒万物，并赋予万物不妄动妄求的本性'},
                            {name:'山天大畜', desc: '山天合象，为天被包含在山里之象，象征大量的蓄养积聚，意为积累'},
                            {name:'山雷颐', desc: '震雷在艮上下，引申为咀嚼(震)食物而止(艮)于张口之状，故象征颐养之意'},
                            {name:'泽风大过', desc: '巽木处兑泽之下，表有大过错，为泽水淹没树木(水覆舟)之象'},
                            {name:'水为坎', desc: '坎为水、为险，两坎相重，险上加险，险阻重重'},
                            {name:'火为离', desc: '内空外明，离为火、为明、太阳反复升落，运行不息，柔顺为心'},
                            {name:'泽山咸', desc: '上卦为兑，兑为泽，山上有泽，山气水息，互相感应。(咸象征感应。)另记：山上有湖泽之水，其味为咸。'},
                            {name:'雷风恒', desc: '巽风下震雷上，为风雷交加之表象，二者相辅相成而不停地活动的形象，因而象征常久。另解：震巽木同为一气，一刚一柔，刚柔并济，相互助长，能常久，故为恒。'},
                            {name:'天山遁', desc: '天下有山，山高天退，山逼近天，天步步后退。阴长阳消，小人得势，君子退隐，明哲保身，伺机拯救天下。'},
                            {name:'雷天大壮', desc: '雷声响亮，光明天际，为正大光明，阳气盛壮，万物生长之象'},
                            {name:'火地晋', desc: '日出地面，普照大地，象征着前进和昌盛'},
                            {name:'地火明夷', desc: '日没入地，光明受损，前途不明，环境困难，宜遵时养晦，坚守正道，外愚内慧，韬光养晦。 (明夷：卦名。夷，通痍，为伤。离为日为明。明夷即光明损伤。此指日蚀。)'},
                            {name:'风火家人', desc:'风吹火之象，助火之威，喻家人同心协力，发展事业'},
                            {name:'火泽睽', desc:'离火上兑泽下，两者接近则水火不容而相违，又二女同居不得正之象。(睽:相违，矛盾，读音同“葵”。)'},
                            {name:'水山蹇', desc:'高山积水，难以行进，象征艰难险阻，困难重重。(蹇：艰难，读音同“剪”。)'},
                            {name:'雷水解', desc:'惊雷阵阵，春雨潇潇，万物从寒冷冰冻之中舒解，呈现蓬勃生机之象'},
                            {name:'山泽损', desc:'上山下泽，大泽浸蚀山根，象征着减损。'},
                            {name:'风雷益', desc:'风雷激荡，风顺雷声，雷助风势，雷风相互增益威势。（记忆诀窍:和雷风 恒相比，风雷益，先有风，主导为风，有助益。雷风恒，先有雷， 有威严，阳刚，故能恒）'},
                            {name:'泽天夬', desc:'湖水蒸发上天，即将化雨倾注而下之表象，以此象征决断。 (夬：guài，果决也，刚决柔也。)另记：兑上乾下，有湖泽之水涨上天之象，洪水滔天，必冲决堤防，所以卦名曰夬。'},
                            {name:'天风姤', desc:'天下有风，吹遍大地，阴阳交合，万物茂盛。(姤：gòu ，相遇也,柔遇刚也)另解：喻君王在上，颁教命于下，风行天下，洽合人意，治道大行，所以卦名曰姤另记：天下有风，是风行天下，无处不在，能与万物相遇。'},
                            {name:'泽地萃', desc:'湖泽在地上，四面八方的细流都源源不断汇入湖中之表象，象征着聚合水聚于泥土中，滋养草木，生长茂盛。另记：湖泽泛滥淹没大地，应团结一心，共度难关。'},
                            {name:'地风升', desc:'地中生木之象，树木由矮小到高大，象征上升。 泽水困：泽中无水，而水在泽下，困之象也。'},
                            {name:'水风井', desc:'水分沿着树身向上运行，直达树冠，为井水源源不断地被汲引到地面之表象，因此象征无穷。另解：井水为暗流，像风的去向一样，想不到它会通往何方。引喻为具有不可预见的人脉和资源，也会多出奇人异事。'},
                            {name:'泽火革', desc:'为泽中有火之表象。火旺水干，水大火熄。二者相生亦相克，必然出现变革。'},
                            {name:'火风鼎', desc:'木之上有离火，为燃炊烹饪之象，鼎有去旧立新，改过迁善之意。'},
                            {name:'震为雷', desc:'重雷发向，千里传声，有惊无险之象，亦有变动，当警惕之意。'},
                            {name:'艮为山', desc:'两山相阻，宜止不宜进，阻塞之象。'},
                            {name:'风山渐', desc:'山上有风，木植山上，不断生长，山也随着增高，比喻循序渐进。'},
                            {name:'雷泽归妹', desc:'震长男在上，兑少女在下，女必归从，归即是出嫁。'},
                            {name:'雷火丰', desc:'电闪雷鸣，成就巨大，如日中天，喻达到顶峰。另记：用锣鼓(震为鼓)，火把来庆祝大丰收。'},
                            {name:'火山旅', desc:'山中火势匆匆蔓延，如同途中行旅之人匆匆赶路。另记：火烧山野，所到之处，流离失所，只得行旅寄宿他乡。'},
                            {name:'巽为风', desc:'风行起来无所不入之表象，由此表示顺从。'},
                            {name:'兑为泽', desc:'泽水相互流通滋润，彼此受益，因而又象征喜悦。'},
                            {name:'风水涣', desc:'风行水上之表象，流动四散，象征涣散、离散。'},
                            {name:'水泽节', desc:'泽上有水，喻蓄积不使水流失，一旦泽满而有水溢出，致使水位过高，则成泛滥，故应堤防以节制。'},
                            {name:'风泽中孚', desc:'泽上有风，风吹动着泽水之表象，比喻没有诚信之德施及不到的地方，说明极为诚信。(孚：信服，信任。中孚象征诚信。)'},
                            {name: '雷山小过', desc: '惊雷落于山，警示人们，做事应把握尺度，不可好高骛远。(过：超过，越过。小过：行动有度。)'},
                            {name: '火水未济', desc: '火上水下，火势难以压倒水势 ，救火大功未成，故称未济。(未济：未能成功。)'},
                            {name: '水火既济', desc: '为水在火上之表象，比喻用火煮食物，食物已熟，象征事情已经成功。(既：已经；济成也。既济：事情已经成功，但终将发生变故'}
                        ]
                    }
                },
                created() {
                    this.screenHeight = innerHeight - 100
                    console.log(this.tableData.length)
                },
                computed: {
                    querySearch() {
                     let searchStr = this.searchVal
                     if(!searchStr) {
                        return this.tableData
                     }
                     return this.tableData.filter( item => {
                         return item.name.includes(searchStr)
                     })
                 }
                },
                methods:{
                    
                }
            })
        </script>
    </body>
</html>

 

posted @ 2022-03-18 16:09  骑车帅小子  阅读(126)  评论(0)    收藏  举报