init

README.md

-# wuxing
-计算生辰八字和五行的小程序
 
 
-![gh_2a8469b335b5_258](https://github.com/1091214370/wuxing/assets/17852999/9c3b3a45-7442-4f04-a30d-b2deb929e89f)
-
 

api.js

+var WxApiRoot = 'https://quanku.wanwudezhi.com/wx/xundao/';
+// var WxApiRoot = 'http://127.0.0.1:5555/wx/xundao/';
+
+module.exports = {
+    WuxingCalcUrl: WxApiRoot + 'wuxing/calc', //获取五行计算结果
+    WuxingRecommend: WxApiRoot + 'wuxing/get_wx_items', //获取五行推荐好物
+}
\ No newline at end of file

app.json

 {
-  "pages":[
+  "pages": [
     "pages/index/index",
-    "pages/wuxingres/index"
+    "pages/wuxingres/index",
+    "pages/recommend/index"
   ],
-  "window":{
-    "backgroundTextStyle":"light",
+  "window": {
+    "backgroundTextStyle": "light",
     "navigationBarBackgroundColor": "#fff",
-    "navigationBarTitleText": "快捷计算",
-    "navigationBarTextStyle":"black"
+    "navigationBarTitleText": "巽岛",
+    "navigationBarTextStyle": "black",
+    "navigationStyle": "default"
   },
   "style": "v2",
   "sitemapLocation": "sitemap.json"
-}
+}
\ No newline at end of file

components/card/index.js

+Component({
+  properties: {
+    item: {
+      type: Object,
+      value: {}
+    }
+  },
+  methods: {
+    gotoHC(e) {
+      /**
+       * 跳到换藏去购买
+       */
+      wx.navigateToMiniProgram({
+        appId: 'wx5b4409448bf2c72b',
+        path: this.data.item.url, //要打开B小程序的页面
+        extraData: {}, //需要传递给目标小程序的数据，目标小程序可在 App.onLaunch，App.onShow 中获取到这份数据
+        envVersion: 'release', //打开的对应小程序环境：开发develop、体验trial、生产release
+        success(res) {
+          console.log('打开成功', res)
+        },
+        fail(err) {
+          console.log('失败', err)
+        }
+      })
+    }
+  }
+});
\ No newline at end of file

components/card/index.json

+{
+  "component": true,
+  "usingComponents": {}
+}
\ No newline at end of file

components/card/index.wxml

+<view class="item-c" bindtap="gotoHC">
+  <view class="item-img">
+     <image src="{{item.img}}" mode="scaleToFill" style="border-radius: 20rpx;"></image>
+  </view>
+  <view style="background-color: white; height: 80rpx;width: 100%; display: flex; flex-direction: column;">
+     <text style="font-size: small; margin-left: 10rpx;">{{item.name}}</text>
+	 <text style="font-size: small; margin-left: 10rpx; font-weight: bolder;">{{item.price}}</text>
+  </view>
+</view>
\ No newline at end of file

components/card/index.wxss

+.item-c {
+	display: flex;
+	/* justify-content: center; */
+	align-items: center;
+	margin-bottom: 20rpx;
+	/* left: -20rpx; */
+	flex-direction: column;
+  }
+
+.item-img {
+	/* background-size: cover; */
+	/* justify-content: center;
+	background-repeat: no-repeat;
+	width: 100%; */
+	/* height: 400rpx; */
+	width: 500rpx;
+	margin-bottom: -10rpx;
+}
\ No newline at end of file

components/fall/index.js

+/**
+ * 一个奇葩的瀑布流组件
+ * 组件暂时只支持双列流
+ */
+Component({
+  properties: {
+    // 整体宽度，单位rpx
+    containerWidth: {
+      type: Number,
+      value: 750
+    },
+    // 流间距
+    gapWidth: {
+      type: Number,
+      value: 10
+    },
+    // 数据
+    items: {
+      type: Array,
+      value: [],
+      observer: function (newVal, oldVal) {
+        this._readyData = this._readyData.concat(newVal.slice(oldVal.length, newVal.length));
+        // 仅在追加时或数据异步时执行这个render
+        if (oldVal.length > 0 || this._isReadyRender) {
+          this._render();
+        }
+      }
+    }
+  },
+
+  data: {
+    // 流数（当前只支持两条流）
+    fallNum: 2,
+    // 分流后数据
+    itemArray: []
+  },
+
+  created () {
+    // 待渲染数据
+    this._readyData = [];
+    // 当前激活流
+    this._activeFall = 0;
+  },
+
+  attached () {
+    /**
+     * 数据初始化
+     */
+    this.setData({
+      itemArray: Array(this.data.fallNum).fill().map(() => [])
+    });
+  },
+
+  ready () {
+    // 首次渲染数据
+    this._render();
+    // 主要用于处理异步数据
+    this._isReadyRender = true;
+    // 添加监听器（需要写在ready里，否则基础库2.7.1（含）以下不生效）
+    // https://developers.weixin.qq.com/community/develop/doc/000e20e79ecf789290399941a51000
+    this._addOberver();
+  },
+
+  detached () {
+    for (const o of this._obervers) {
+      o.disconnect();
+    }
+  },
+
+  methods: {
+    /**
+     * 添加触达监听
+     */
+    _addOberver () {
+      // 存储监听器
+      this._obervers = [];
+      // 首排标识
+      let flag = 1;
+
+      for (let i = 0; i < this.data.fallNum; i++) {
+        const o = this.createIntersectionObserver();
+        o.relativeTo('.f-detector').observe(`.f-l${i}`, res => {
+
+          // 判断渲染流
+          if (flag < this.data.fallNum) {
+            this._activeFall++;
+            this._render();
+            flag++;
+          } else if (res.intersectionRatio === 0) {
+            this._activeFall = i;
+            this._render();
+          } else {
+            this._activeFall = 0;
+          }
+
+        });
+        this._obervers.push(o)
+      }
+    },
+
+    /**
+     * 数据分流渲染
+     */
+    _render () {
+      if (this._readyData.length > 0) {
+        const i = this.data.itemArray[this._activeFall].length;
+        this.setData({
+          [`itemArray[${this._activeFall}][${i}]`]: this._readyData.shift()
+        }, () => {
+          // 超时处理
+          clearTimeout(this._renderTimeout);
+          this._renderTimeout = setTimeout(() => {
+            this._render();
+          }, 100);
+        });
+      }
+    }
+  }
+});

components/fall/index.json

+{
+  "component": true,
+  "usingComponents": {},
+  "componentGenerics": {
+    "card": true
+  }
+}
\ No newline at end of file

components/fall/index.wxml

+<!-- 瀑布流 -->
+<view class="f-container" style="width: {{containerWidth}}rpx;">
+  <!-- 瀑布流容器 -->
+  <view class="f-layout">
+    <!-- 单流容器 -->
+    <view 
+      wx:for="{{fallNum}}"
+      wx:key="index"
+      class="f-onefall f-l{{index}}"
+      style="margin-left: {{index && gapWidth}}rpx;">
+      <view 
+        wx:for="{{itemArray[index]}}"
+        wx:for-index="i"
+        wx:key="_{{index}}{{i}}">
+        <card item="{{item}}"></card>
+      </view>
+    </view>
+  </view>
+  <!-- 检测元素 -->
+  <view class="f-detector"></view>
+</view>
\ No newline at end of file

components/fall/index.wxss

+.f-container {
+	position: relative;
+	overflow: hidden;
+  }
+  
+  .f-layout {
+	overflow: hidden;
+	display: flex;
+	justify-content: space-between;
+	align-items: flex-start;
+  }
+  
+  .f-onefall {
+	flex: 1;
+	overflow: hidden;
+  }
+  
+  .f-detector {
+	height: 1rpx;
+	width: 100%;
+	position: absolute;
+	bottom: 0;
+	opacity: 0;
+	z-index: -1;
+  }
\ No newline at end of file

pages/index/index.js

@@ -2,7 +2,13 @@ import {formatTime} from '../../utils/util';
 
 const DATAH = [];
 for (let i = 0; i< 24; i++) {
-  DATAH.push({value: i, label: `${i}点`})
+  DATAH.push({value: i, label: `${i}时`})
+}
+
+const DATAR = []
+const RAW_PROVINCE = ["浙江","江苏","山东","安徽","福建","江西","河南","湖北","湖南","广东","广西","海南","四川","贵州","云南","重庆","上海","北京","天津","河北","山西","内蒙古","辽宁","吉林","黑龙江","西藏","青海","陕西","甘肃","新疆","宁夏","台湾"]
+for (let i = 0; i< RAW_PROVINCE.length; i++) {
+  DATAR.push({value: i, label: RAW_PROVINCE[i]})
 }
 Page({
   data: {
@@ -10,29 +16,31 @@ Page({
     valueH: '0',
     res: {},
     dataH: DATAH,
+    dataR: DATAR,
+    dataRP: RAW_PROVINCE
   },
 
   onLoad() {
-    this.echart =this.selectComponent('#mychart');
+    // this.echart =this.selectComponent('#mychart');
     // 在页面中定义插屏广告
-let interstitialAd = null
+// let interstitialAd = null
 
-// 在页面onLoad回调事件中创建插屏广告实例
-if (wx.createInterstitialAd) {
-  interstitialAd = wx.createInterstitialAd({
-    adUnitId: 'adunit-a4fab2c7a6cb6510'
-  })
-  interstitialAd.onLoad(() => {})
-  interstitialAd.onError((err) => {})
-  interstitialAd.onClose(() => {})
-}
+// // 在页面onLoad回调事件中创建插屏广告实例
+// if (wx.createInterstitialAd) {
+//   interstitialAd = wx.createInterstitialAd({
+//     adUnitId: 'adunit-a4fab2c7a6cb6510'
+//   })
+//   interstitialAd.onLoad(() => {})
+//   interstitialAd.onError((err) => {})
+//   interstitialAd.onClose(() => {})
+// }
 
-// 在适合的场景显示插屏广告
-if (interstitialAd) {
-  interstitialAd.show().catch((err) => {
-    console.error(err)
-  })
-}
+// // 在适合的场景显示插屏广告
+// if (interstitialAd) {
+//   interstitialAd.show().catch((err) => {
+//     console.error(err)
+//   })
+// }
   },
 
   handleDate(e) {
@@ -45,10 +53,15 @@ if (interstitialAd) {
       valueH: e.detail.value,
     })
   },
+  handleRegion(e) {
+    this.setData({
+      valueR: e.detail.value,
+    })
+  },
   handleScle() {
-    const { valueDate, valueH } = this.data;
+    const { valueDate, valueH, valueR, dataRP} = this.data;
     wx.redirectTo({
-      url: `/pages/wuxingres/index?valueDate=${valueDate}&valueH=${valueH}&flag=1`,
+      url: `/pages/wuxingres/index?valueDate=${valueDate}&valueH=${valueH}&valueR=${dataRP[valueR]}&flag=1`,
     })
   },
 })

pages/index/index.wxml

 <view class="page">
   <view class="header">
-    <view class="title">选择日期时间计算</view>
+    <view class="title">选择出生时间</view>
   </view>
   <view class="center">
     <view>
@@ -12,12 +12,17 @@
       <date-picker />
       <picker bindchange="handleHour" range-key="label" value="{{valueH}}" range="{{dataH}}">
         <view class="form-item">
-          选择时间：{{valueH}}点
+          选择时间：{{valueH}}时
+        </view>
+      </picker>
+      <picker bindchange="handleRegion" range-key="label" value="{{valueR}}" range="{{dataR}}">
+        <view class="form-item">
+          选择出生省：{{dataRP[valueR]}}
         </view>
       </picker>
     </view>
   </view>
-  <button type="primary" class="button" bind:tap="handleScle">计算</button>
+  <button type="primary" class="button" bind:tap="handleScle">测一测</button>
   <view style="position: absolute; bottom: 0;width: 100%;">
     <ad unit-id="adunit-3c035a6664e81e3b" ad-type="video" ad-theme="white"></ad>
   </view>

pages/recommend/index.js

+const api = require('../../api.js');
+const util = require('../../utils/util.js')
+
+Page({
+  data: {
+    isEnd: false,
+    items: [],
+    need_wx: "",
+  },
+
+  _id: 0,
+
+  onLoad (options) {
+    this.setData({
+      need_wx:options.need_wx
+    })
+    this._render();
+  },
+
+  onReachBottom () {
+    // this._render();
+  },
+
+  _render () {
+
+    if (this.data.isEnd) {
+      return;
+    }
+
+    wx.showLoading({
+      title: '数据加载中'
+    });
+
+    this._getItems().then(({isEnd, data}) => {
+      wx.hideLoading();
+      // 优化数据的添加
+      let items = this.data.items;
+      let index = items.length++;
+      let newObj = {};
+      data.forEach(item => {
+        newObj[`items[${index++}]`] = item;
+      });
+      if (isEnd) newObj.isEnd = isEnd;
+      this.setData(newObj);
+    });
+  },
+
+  getWxItems() {
+    let that = this;
+    util.request(api.WuxingRecommend, {
+      need_wx:this.data.need_wx 
+    }).then(function(res) {
+      if (res.code === 1001) {
+        that.setData({
+           items:res.data.items
+        });
+      }
+    });
+  },
+
+  /**
+   * 模拟获取数据
+   */
+  _getItems () {
+    let data = [];
+    this.getWxItems();
+    let dataLen = this.data.items.length
+    for (let i = 0; i < dataLen; i++) {
+      data.push({
+        name: items[i].name,
+        img: items[i].img,
+        price: items[i].price,
+        url: items[i].url
+      });
+    }
+    return new Promise (resolve => {
+      setTimeout(() => {
+        resolve({
+          isEnd: true,
+          data
+        });
+      }, 250);
+    });
+  }
+});

pages/recommend/index.json

+{
+  "onReachBottomDistance": 100,
+  "usingComponents": {
+    "fall": "../../components/fall",
+    "card": "../../components/card"
+  }
+}
\ No newline at end of file

pages/recommend/index.wxml

+<view class="fall-box">
+  <view style="text-align: center;margin-bottom: 10rpx;background-color: burlywood;">
+     <text style="color: white;font-weight: bolder; font-size: x-large;" >增补{{need_wx}}的好物</text>
+  </view>
+  <fall 
+    items="{{items}}" 
+    container-width="690" 
+    gap-width="20"
+    generic:card="card"></fall>
+  <view wx:if="{{isEnd}}" class="no-more">没有更多了~</view>
+</view>
\ No newline at end of file

pages/recommend/index.wxss

+.fall-box {
+	background: #eee;
+	padding: 30rpx;
+  }
+  
+  .no-more {
+	display: flex;
+	justify-content: center;
+	align-items: center;
+	font-size: 24rpx;
+	color: #8799a3;
+	margin-top: 20rpx;
+	margin-bottom: 50rpx;
+  }

pages/wuxingres/index.js

-import calendarFormatter from '../../utils/calendarFormatter';
 import * as echarts from '../../components/ec-canvas/echarts';
+const api = require('../../api.js');
+const util = require('../../utils/util.js')
 
 const G = ["甲","乙","丙","丁","戊","己","庚","辛","壬","癸"]
 const Z = ["子","丑","寅","卯","辰","巳","午","未","申","酉","戌","亥"]
@@ -19,17 +20,16 @@ Page({
   data: {
     valueDate: undefined,
     valueH: undefined,
+    valueR: undefined,
     flag: false,
     pengyouquan: false,
     res: {},
     dataH: DATAH,
-    wuxing: {
-      jin: 0,
-      mu: 0,
-      shui: 0,
-      huo: 0,
-      tu: 0,
-    },
+    bazi:{},
+    loc_wx:"",
+    bz_wx:{},
+    now_wx:{},
+    stat_wx:{},
     ec: {
       lazyLoad: true,
     },
@@ -45,16 +45,21 @@ Page({
       'rgb(98,92,51)',
       'rgb(179,214,110)',
     ],
+    xtWxChart: undefined,
+    slWxChart: undefined,
+    statWxChart: undefined,
+    lunarInfo: {},
+    recommend: "",
+    need_wx:"",
   },
 
   onLoad(e) {
-    const { valueDate, valueH, flag, pengyouquan } = e;
-    this.setData({valueDate, valueH, flag: flag === '1', pengyouquan: pengyouquan === '1' });
+    const { valueDate, valueH, valueR, flag, pengyouquan } = e;
+    this.setData({valueDate, valueH, valueR, flag: flag === '1', pengyouquan: pengyouquan === '1' });
+    this.calcWuXing();
   },
 
   onShow(){
-    this.echart =this.selectComponent('#mychart');
-    this.handleScle();
   },
 
   onShareAppMessage() {
@@ -71,67 +76,73 @@ Page({
       promise 
     }
   },
+
+
+  calcWuXing() {
+    let that = this;
+    util.request(api.WuxingCalcUrl, {
+      born_time: that.data.valueDate + "-" + that.data.valueH,
+      province: that.data.valueR,
+    }).then(function(res) {
+      if (res.code === 1001) {
+        that.setData({
+           bazi : res.data.bazi,
+           loc_wx : res.data.loc_wx,
+           bz_wx : res.data.bz_wx,
+           now_wx : res.data.now_wx,
+           stat_wx : res.data.stat_wx,
+           lunarInfo : res.data.lunarInfo,
+           recommend : res.data.recommend.join("\n"),
+           need_wx:res.data.need_wx,
+        });
+        // that.setData({
+        //   goodsList: that.data.goodsList.concat(res.data.goodsList),
+        //   totalPages: res.data.totalPages
+        // });
+        that.xtWxChart = that.selectComponent('#xtWxChart');
+        that.slWxChart = that.selectComponent('#slWxChart');
+        that.statWxChart = that.selectComponent('#statWxChart');
+        // that.handleXtScle();
+        // that.handleSlScle();
+        that.handleStatScle();
+      }
+    });
+  },
   onShareTimeline() {
-    const { valueDate, valueH } = this.data;
+    const { valueDate, valueH, valueR } = this.data;
     return {
       title: '我的八字与五行分布',
-      query: `valueDate=${valueDate}&valueH=${valueH}&pengyouquan=1`,
+      query: `valueDate=${valueDate}&valueH=${valueH}&valueR=${valueR}&pengyouquan=1`,
     }
   },
   
-  handleScle() {
-    const { valueDate, valueH } = this.data;
-    const temp = valueDate.split('-');
-    const v = calendarFormatter.solar2lunar(temp[0],temp[1],temp[2]);
-    const d = v.gzDay[0];
-    const i =  G.indexOf(d);
-    const r = i > 4 ? i - 5 : i;
-    const h = Math.floor((Number(valueH) + 1) / 2);
-    v.gzHour = SGZ[r][h > 0 && h < 12 ? h : 0];
-    const wuxing = this.getWuxing(v);
-    this.initChart(wuxing);
-    this.setData({
-      res: v,
-      wuxing,
-    });
+  handleXtScle() {
+    this.initChart(this.data.bz_wx, this.xtWxChart);
   },
-  getWuxing(v) {
-    const wuxing = [...`${v.gzYear}${v.gzMonth}${v.gzDay}${v.gzHour}`];
-    const res = {
-      jin: 0,
-      mu: 0,
-      shui: 0,
-      huo: 0,
-      tu: 0,
-    };
-    wuxing.forEach(i => {
-      switch (true) {
-        case '庚辛申酉'.indexOf(i) > -1:
-          res.jin += 1;
-          break;
-        case '甲乙寅卯'.indexOf(i) > -1:
-          res.mu += 1;
-          break;
-        case '壬癸亥子'.indexOf(i) > -1:
-          res.shui += 1;
-          break;
-        case '丙丁巳午'.indexOf(i) > -1:
-          res.huo += 1;
-          break;
-        case '戊己辰戌丑未'.indexOf(i) > -1:
-          res.tu += 1;
-          break;
-      }
-    });
-    return res;
+  handleSlScle() {
+    this.initChart(this.data.now_wx, this.slWxChart);
+  },
+  handleStatScle() {
+    this.initChart(this.data.stat_wx, this.statWxChart);
   },
   goback() {
     wx.redirectTo({
       url: '/pages/index/index',
     })
   },
+  tobuychuan() {
+    wx.navigateTo({
+      url: `/pages/recommend/index?need_wx=`+this.data.need_wx,
+    })
+  },
+  // 如果数据是0，那么补0.01用来让图片展示
+  ifZeroThenFill:function(data) {
+      if (data < 0.01) return 0.01
+      return data
+  },
   /**设置图表映射 */
-  initChart: function(wuxing) {
+  initChart: function(wuxing, chart) {
+    console.log(wuxing)
     const option = {
       series: [
         {
@@ -144,17 +155,17 @@ Page({
             borderRadius: 5
           },
           data: [
-            { value: wuxing.jin, name: '金' },
-            { value: wuxing.mu, name: '木' },
-            { value: wuxing.shui, name: '水' },
-            { value: wuxing.huo, name: '火' },
-            { value: wuxing.tu, name: '土' },
+            { value: this.ifZeroThenFill(wuxing['金']), name: '金' },
+            { value: this.ifZeroThenFill(wuxing['木']), name: '木' },
+            { value: this.ifZeroThenFill(wuxing['水']), name: '水' },
+            { value: this.ifZeroThenFill(wuxing['火']), name: '火' },
+            { value: this.ifZeroThenFill(wuxing['土']), name: '土' },
           ]
         }
       ]
     };
     //echarts会继承父元素的宽高,所以我们一定要设置echarts组件父元素的高度。
-    this.echart.init((canvas) => {
+    chart.init((canvas) => {
       const chart = echarts.init(canvas, null, {
         width: 400,
         height: 400,

pages/wuxingres/index.wxml

 <view class="page">
   <view class="header">
-    <view class="title">计算结果</view>
+    <view class="title" style="background-color: gold;">五行态势</view>
   </view>
   <view class="result" >
     <view class="flex-box nongli">
-    公历日期: {{valueDate}} | 时间：{{valueH || '--'}} 点
+    农历日期: {{lunarInfo.year}}{{lunarInfo.animal}}年 {{lunarInfo.month}} {{lunarInfo.day}}
+    </view>
+    <view class="flex-box">
+      <view class="res-title">出生地五行：</view>
+    <view class="flex-content">
+      <view style="background-color: {{allColors[4]}};">{{loc_wx}}</view>
     </view>
-    <view class="flex-box nongli">
-    农历日期: {{res.gzYear}}{{res.Animal}}年 {{res.IMonthCn}} {{res.IDayCn}}
     </view>
     <view class="flex-box">
     <view class="res-title">四柱：</view>
     <view class="flex-content">
-      <view style="background-color: {{allColors[4]}};">{{res.gzYear}}</view>
-      <view style="background-color: {{allColors[1]}};">{{res.gzMonth}}</view>
-      <view style="background-color: {{allColors[2]}};">{{res.gzDay}}</view>
-      <view style="background-color: {{allColors[3]}};">{{res.gzHour}}</view>
+      <view style="background-color: {{allColors[4]}};">{{bazi[0]}}</view>
+      <view style="background-color: {{allColors[1]}};">{{bazi[1]}}</view>
+      <view style="background-color: {{allColors[2]}};">{{bazi[2]}}</view>
+      <view style="background-color: {{allColors[3]}};">{{bazi[3]}}</view>
     </view>
     </view>
     <view class="flex-box">
-    <view class="res-title">五行：</view>
+    <view class="res-title">先天：  </view>
     <view class="flex-content wx">
-      <view style="background-color: rgb(179, 63, 56);">金：{{wuxing.jin}}</view>
-      <view style="background-color: rgb(53,70,83);">木：{{wuxing.mu}}</view>
-      <view style="background-color: rgb(110,158,165);">水：{{wuxing.shui}}</view>
-      <view style="background-color: rgb(201,134,108);">火：{{wuxing.huo}}</view>
-      <view style="background-color: rgb(155,195,174);">土：{{wuxing.tu}}</view>
+      <view style="background-color: rgb(179, 63, 56);">金 {{bz_wx['金']}}</view>
+      <view style="background-color: rgb(53,70,83);">木 {{bz_wx['木']}}</view>
+      <view style="background-color: rgb(110,158,165);">水 {{bz_wx['水']}}</view>
+      <view style="background-color: rgb(201,134,108);">火 {{bz_wx['火']}}</view>
+      <view style="background-color: rgb(155,195,174);">土 {{bz_wx['土']}}</view>
     </view>
     </view>
-    <view class="echart">
-      <ec-canvas id="mychart" canvas-id="mychart" ec="{{ ec }}"></ec-canvas>
+    <!-- <view class="echart">
+      <ec-canvas id="xtWxChart" canvas-id="xtWxChart" ec="{{ ec }}"></ec-canvas>
+    </view> -->
+    <view class="flex-box">
+    <view class="res-title">天时：  </view>
+    <view class="flex-content wx">
+      <view style="background-color: rgb(179, 63, 56);">金 {{now_wx['金']}}</view>
+      <view style="background-color: rgb(53,70,83);">木 {{now_wx['木']}}</view>
+      <view style="background-color: rgb(110,158,165);">水 {{now_wx['水']}}</view>
+      <view style="background-color: rgb(201,134,108);">火 {{now_wx['火']}}</view>
+      <view style="background-color: rgb(155,195,174);">土 {{now_wx['土']}}</view>
     </view>
-    <view class="btns">    
-      <button wx:if="{{res.gzYear && flag}}" type="primary" open-type="share" class="button">分享给好友</button>
-      <button wx:if="{{res.gzYear && !pengyouquan}}" type="default" class="button" bind:tap="goback">{{ flag ? '重新计算' : '我也算算'}}</button>
-      <button wx:else type="default" class="button" bind:tap="goback">我也算算</button>
+  </view>
+  <view class="flex-box">
+    <view class="res-title">五行强弱：</view>
+    <view class="flex-content wx">
+      <view style="background-color: rgb(179, 63, 56);">金{{stat_wx['金']}}</view>
+      <view style="background-color: rgb(53,70,83);">木{{stat_wx['木']}}</view>
+      <view style="background-color: rgb(110,158,165);">水{{stat_wx['水']}}</view>
+      <view style="background-color: rgb(201,134,108);">火{{stat_wx['火']}}</view>
+      <view style="background-color: rgb(155,195,174);">土{{stat_wx['土']}}</view>
     </view>
   </view>
-  <view style="width: 100%;">
-    <ad unit-id="adunit-5d509a2d2926ec2a"></ad>
+    <!-- <view class="echart">
+      <ec-canvas id="slWxChart" canvas-id="slWxChart" ec="{{ ec }}"></ec-canvas>
+    </view> -->
+    <view class="echart">
+      <ec-canvas id="statWxChart" canvas-id="statWxChart" ec="{{ ec }}"></ec-canvas>
+    </view>
+    <view class="flex-box">
+    <view class="res-title">本月建议：</view>
+    <view class="text-box" scroll-y="true" scroll-top="999" style="border: orangered;border-style: solid;border-width: 1px;">
+        <text style="color: orange; font-size: smaller; margin: 100rpx; margin-top: 30rpx;">{{recommend}}</text>
+        <button wx:if="{{lunarInfo.year && flag}}" type="primary" open-type="default" class="button" bind:tap="tobuychuan" style="width:250rpx; font-size:small;margin-bottom: 10rpx; margin-top: 30rpx;">五行增强好物</button>
+      </view>
   </view>
-
+    <view class="btns">    
+      <button wx:if="{{lunarInfo.year && flag}}" type="default" open-type="share" class="button" style="font-size: x-small;width: 200rpx;">分享给好友</button>
+      <button wx:if="{{lunarInfo.year && !pengyouquan}}" type="default" class="button" bind:tap="goback" style="font-size: x-small; width: min-content; color: black;">{{ flag ? '重新测测' : '我也测测'}}</button>
+      <button wx:else type="default" class="button" bind:tap="goback">我也测测</button>
+    </view>
+    </view>
 </view>
\ No newline at end of file

pages/wuxingres/index.wxss

@@ -28,8 +28,6 @@
 }
 
 .button {
-  width: 100%;
-  margin: 32rpx 0;
   z-index: 8;
 }
 

project.config.json

@@ -48,5 +48,5 @@
     "ignore": [],
     "include": []
   },
-  "appid": "wxd04889271323534c"
+  "appid": "wxaa17d598e8e075ba"
 }
\ No newline at end of file

project.private.config.json

 {
   "description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
-  "projectname": "wuxing",
+  "projectname": "xundao",
   "setting": {
-    "compileHotReLoad": true
+    "compileHotReLoad": true,
+    "urlCheck": false
   }
 }
\ No newline at end of file

sitemap.json

 {
-  "desc": "关于本文件的更多信息，请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
+  "desc":"巽岛-有风岛",
   "rules": [{
   "action": "allow",
   "page": "*"

utils/util.js

@@ -9,11 +9,56 @@ const formatTime = date => {
   return `${[year, month, day].map(formatNumber).join('-')}`
 }
 
+/**
+ * 封封微信的的request
+ */
+function request(url, data = {}, method = "GET") {
+  return new Promise(function(resolve, reject) {
+    wx.request({
+      url: url,
+      data: data,
+      method: method,
+      header: {
+        'Content-Type': 'application/json',
+        'X-Dts-Token': wx.getStorageSync('token')
+      },
+      success: function(res) {
+
+        if (res.statusCode == 200) {
+
+          if (res.data.errno == 501) {
+            // 清除登录相关内容
+            try {
+              wx.removeStorageSync('userInfo');
+              wx.removeStorageSync('token');
+            } catch (e) {
+              // Do something when catch error
+            }
+            // 切换到登录页面
+            wx.navigateTo({
+              url: '/pages/auth/login/login'
+            });
+          } else {
+            resolve(res.data);
+          }
+        } else {
+          reject(res.errMsg);
+        }
+
+      },
+      fail: function(err) {
+        reject(err)
+      }
+    })
+  });
+}
+
 const formatNumber = n => {
   n = n.toString()
   return n[1] ? n : `0${n}`
 }
 
 module.exports = {
-  formatTime
+  formatTime,
+  request
 }