危机事件详情页

app.js

@@ -5,6 +5,8 @@ App({
 
   },
   globalData: {
-    userInfo: null
+    userInfo: null,
+    //是否开发环境
+    isDev:true
   }
 })

app.json

@@ -5,7 +5,8 @@
         "pages/library/library",
         "pages/usercenter/usercenter",
         "pages/search-page/search-page",
-        "pages/search-result/search-result"
+        "pages/search-result/search-result",
+        "pages/event-detail/event-detail"
     
     ],
     "window": {
@@ -44,6 +45,5 @@
         ]
     },
     "style": "v2",
-    "sitemapLocation": "sitemap.json",
-    "lazyCodeLoading": "requiredComponents"
+    "sitemapLocation": "sitemap.json"
 }
\ No newline at end of file

app.wxss

 /**app.wxss**/
 .container {
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: space-between;
-  padding: 200rpx 0;
+  margin: 0;
+  padding: 0;
   box-sizing: border-box;
+  font-family: Microsoft YaHei;
 } 
+
+
+.moudle-title{
+  padding: 20rpx 38rpx;
+  overflow: hidden;
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #353535;
+  position: relative;
+}
+.moudle-title::after{
+  margin-left: 18rpx;
+  content: '';
+  display: block;
+  width: 10rpx;
+  height: 32rpx;
+  background-color: #025FEA;
+  position: absolute;
+  top: 50%;
+  left: 0;
+  border-radius: 10rpx;
+  transform: translateY(-50%);
+}

components/ec-canvas/ec-canvas.js

+import WxCanvas from './wx-canvas';
+import * as echarts from './echarts';
+
+let ctx;
+
+function compareVersion(v1, v2) {
+  v1 = v1.split('.')
+  v2 = v2.split('.')
+  const len = Math.max(v1.length, v2.length)
+
+  while (v1.length < len) {
+    v1.push('0')
+  }
+  while (v2.length < len) {
+    v2.push('0')
+  }
+
+  for (let i = 0; i < len; i++) {
+    const num1 = parseInt(v1[i])
+    const num2 = parseInt(v2[i])
+
+    if (num1 > num2) {
+      return 1
+    } else if (num1 < num2) {
+      return -1
+    }
+  }
+  return 0
+}
+
+Component({
+  properties: {
+    canvasId: {
+      type: String,
+      value: 'ec-canvas'
+    },
+
+    ec: {
+      type: Object
+    },
+
+    forceUseOldCanvas: {
+      type: Boolean,
+      value: false
+    }
+  },
+
+  data: {
+    isUseNewCanvas: false
+  },
+
+  ready: function () {
+    // Disable prograssive because drawImage doesn't support DOM as parameter
+    // See https://developers.weixin.qq.com/miniprogram/dev/api/canvas/CanvasContext.drawImage.html
+    echarts.registerPreprocessor(option => {
+      if (option && option.series) {
+        if (option.series.length > 0) {
+          option.series.forEach(series => {
+            series.progressive = 0;
+          });
+        }
+        else if (typeof option.series === 'object') {
+          option.series.progressive = 0;
+        }
+      }
+    });
+
+    if (!this.data.ec) {
+      console.warn('组件需绑定 ec 变量，例：<ec-canvas id="mychart-dom-bar" '
+        + 'canvas-id="mychart-bar" ec="{{ ec }}"></ec-canvas>');
+      return;
+    }
+
+    if (!this.data.ec.lazyLoad) {
+      this.init();
+    }
+  },
+
+  methods: {
+    init: function (callback) {
+      const version = wx.getSystemInfoSync().SDKVersion
+
+      const canUseNewCanvas = compareVersion(version, '2.9.0') >= 0;
+      const forceUseOldCanvas = this.data.forceUseOldCanvas;
+      const isUseNewCanvas = canUseNewCanvas && !forceUseOldCanvas;
+      this.setData({ isUseNewCanvas });
+
+      if (forceUseOldCanvas && canUseNewCanvas) {
+        console.warn('开发者强制使用旧canvas,建议关闭');
+      }
+
+      if (isUseNewCanvas) {
+        // console.log('微信基础库版本大于2.9.0，开始使用<canvas type="2d"/>');
+        // 2.9.0 可以使用 <canvas type="2d"></canvas>
+        this.initByNewWay(callback);
+      } else {
+        const isValid = compareVersion(version, '1.9.91') >= 0
+        if (!isValid) {
+          console.error('微信基础库版本过低，需大于等于 1.9.91。'
+            + '参见：https://github.com/ecomfe/echarts-for-weixin'
+            + '#%E5%BE%AE%E4%BF%A1%E7%89%88%E6%9C%AC%E8%A6%81%E6%B1%82');
+          return;
+        } else {
+          console.warn('建议将微信基础库调整大于等于2.9.0版本。升级后绘图将有更好性能');
+          this.initByOldWay(callback);
+        }
+      }
+    },
+
+    initByOldWay(callback) {
+      // 1.9.91 <= version < 2.9.0：原来的方式初始化
+      ctx = wx.createCanvasContext(this.data.canvasId, this);
+      const canvas = new WxCanvas(ctx, this.data.canvasId, false);
+
+      echarts.setCanvasCreator(() => {
+        return canvas;
+      });
+      // const canvasDpr = wx.getSystemInfoSync().pixelRatio // 微信旧的canvas不能传入dpr
+      const canvasDpr = 1
+      var query = wx.createSelectorQuery().in(this);
+      query.select('.ec-canvas').boundingClientRect(res => {
+        if (typeof callback === 'function') {
+          this.chart = callback(canvas, res.width, res.height, canvasDpr);
+        }
+        else if (this.data.ec && typeof this.data.ec.onInit === 'function') {
+          this.chart = this.data.ec.onInit(canvas, res.width, res.height, canvasDpr);
+        }
+        else {
+          this.triggerEvent('init', {
+            canvas: canvas,
+            width: res.width,
+            height: res.height,
+            canvasDpr: canvasDpr // 增加了dpr，可方便外面echarts.init
+          });
+        }
+      }).exec();
+    },
+
+    initByNewWay(callback) {
+      // version >= 2.9.0：使用新的方式初始化
+      const query = wx.createSelectorQuery().in(this)
+      query
+        .select('.ec-canvas')
+        .fields({ node: true, size: true })
+        .exec(res => {
+          const canvasNode = res[0].node
+          this.canvasNode = canvasNode
+
+          const canvasDpr = wx.getSystemInfoSync().pixelRatio
+          const canvasWidth = res[0].width
+          const canvasHeight = res[0].height
+
+          const ctx = canvasNode.getContext('2d')
+
+          const canvas = new WxCanvas(ctx, this.data.canvasId, true, canvasNode)
+          echarts.setCanvasCreator(() => {
+            return canvas
+          })
+
+          if (typeof callback === 'function') {
+            this.chart = callback(canvas, canvasWidth, canvasHeight, canvasDpr)
+          } else if (this.data.ec && typeof this.data.ec.onInit === 'function') {
+            this.chart = this.data.ec.onInit(canvas, canvasWidth, canvasHeight, canvasDpr)
+          } else {
+            this.triggerEvent('init', {
+              canvas: canvas,
+              width: canvasWidth,
+              height: canvasHeight,
+              dpr: canvasDpr
+            })
+          }
+        })
+    },
+    canvasToTempFilePath(opt) {
+      if (this.data.isUseNewCanvas) {
+        // 新版
+        const query = wx.createSelectorQuery().in(this)
+        query
+          .select('.ec-canvas')
+          .fields({ node: true, size: true })
+          .exec(res => {
+            const canvasNode = res[0].node
+            opt.canvas = canvasNode
+            wx.canvasToTempFilePath(opt)
+          })
+      } else {
+        // 旧的
+        if (!opt.canvasId) {
+          opt.canvasId = this.data.canvasId;
+        }
+        ctx.draw(true, () => {
+          wx.canvasToTempFilePath(opt, this);
+        });
+      }
+    },
+
+    touchStart(e) {
+      if (this.chart && e.touches.length > 0) {
+        var touch = e.touches[0];
+        var handler = this.chart.getZr().handler;
+        handler.dispatch('mousedown', {
+          zrX: touch.x,
+          zrY: touch.y,
+          preventDefault: () => {},
+          stopImmediatePropagation: () => {},
+          stopPropagation: () => {}
+        });
+        handler.dispatch('mousemove', {
+          zrX: touch.x,
+          zrY: touch.y,
+          preventDefault: () => {},
+          stopImmediatePropagation: () => {},
+          stopPropagation: () => {}
+        });
+        handler.processGesture(wrapTouch(e), 'start');
+      }
+    },
+
+    touchMove(e) {
+      if (this.chart && e.touches.length > 0) {
+        var touch = e.touches[0];
+        var handler = this.chart.getZr().handler;
+        handler.dispatch('mousemove', {
+          zrX: touch.x,
+          zrY: touch.y,
+          preventDefault: () => {},
+          stopImmediatePropagation: () => {},
+          stopPropagation: () => {}
+        });
+        handler.processGesture(wrapTouch(e), 'change');
+      }
+    },
+
+    touchEnd(e) {
+      if (this.chart) {
+        const touch = e.changedTouches ? e.changedTouches[0] : {};
+        var handler = this.chart.getZr().handler;
+        handler.dispatch('mouseup', {
+          zrX: touch.x,
+          zrY: touch.y,
+          preventDefault: () => {},
+          stopImmediatePropagation: () => {},
+          stopPropagation: () => {}
+        });
+        handler.dispatch('click', {
+          zrX: touch.x,
+          zrY: touch.y,
+          preventDefault: () => {},
+          stopImmediatePropagation: () => {},
+          stopPropagation: () => {}
+        });
+        handler.processGesture(wrapTouch(e), 'end');
+      }
+    }
+  }
+});
+
+function wrapTouch(event) {
+  for (let i = 0; i < event.touches.length; ++i) {
+    const touch = event.touches[i];
+    touch.offsetX = touch.x;
+    touch.offsetY = touch.y;
+  }
+  return event;
+}

pages/search-page.json → components/ec-canvas/ec-canvas.json

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

components/ec-canvas/ec-canvas.wxml

+<!-- 新的：接口对其了H5 -->
+<canvas wx:if="{{isUseNewCanvas}}" type="2d" class="ec-canvas" canvas-id="{{ canvasId }}" bindinit="init" bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"></canvas>
+<!-- 旧的 -->
+<canvas wx:else class="ec-canvas" canvas-id="{{ canvasId }}" bindinit="init" bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}" bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}" bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"></canvas>

components/ec-canvas/ec-canvas.wxss

+.ec-canvas {
+  width: 100%;
+  height: 100%;
+}

components/ec-canvas/wx-canvas.js

+export default class WxCanvas {
+  constructor(ctx, canvasId, isNew, canvasNode) {
+    this.ctx = ctx;
+    this.canvasId = canvasId;
+    this.chart = null;
+    this.isNew = isNew
+    if (isNew) {
+      this.canvasNode = canvasNode;
+    }
+    else {
+      this._initStyle(ctx);
+    }
+
+    // this._initCanvas(zrender, ctx);
+
+    this._initEvent();
+  }
+
+  getContext(contextType) {
+    if (contextType === '2d') {
+      return this.ctx;
+    }
+  }
+
+  // canvasToTempFilePath(opt) {
+  //   if (!opt.canvasId) {
+  //     opt.canvasId = this.canvasId;
+  //   }
+  //   return wx.canvasToTempFilePath(opt, this);
+  // }
+
+  setChart(chart) {
+    this.chart = chart;
+  }
+
+  addEventListener() {
+    // noop
+  }
+
+  attachEvent() {
+    // noop
+  }
+
+  detachEvent() {
+    // noop
+  }
+
+  _initCanvas(zrender, ctx) {
+    zrender.util.getContext = function () {
+      return ctx;
+    };
+
+    zrender.util.$override('measureText', function (text, font) {
+      ctx.font = font || '12px sans-serif';
+      return ctx.measureText(text);
+    });
+  }
+
+  _initStyle(ctx) {
+    ctx.createRadialGradient = () => {
+      return ctx.createCircularGradient(arguments);
+    };
+  }
+
+  _initEvent() {
+    this.event = {};
+    const eventNames = [{
+      wxName: 'touchStart',
+      ecName: 'mousedown'
+    }, {
+      wxName: 'touchMove',
+      ecName: 'mousemove'
+    }, {
+      wxName: 'touchEnd',
+      ecName: 'mouseup'
+    }, {
+      wxName: 'touchEnd',
+      ecName: 'click'
+    }];
+    eventNames.forEach(name => {
+      this.event[name.wxName] = e => {
+        const touch = e.touches[0];
+        this.chart.getZr().handler.dispatch(name.ecName, {
+          zrX: name.wxName === 'tap' ? touch.clientX : touch.x,
+          zrY: name.wxName === 'tap' ? touch.clientY : touch.y,
+          preventDefault: () => {},
+          stopImmediatePropagation: () => {},
+          stopPropagation: () => {}
+        });
+      };
+    });
+  }
+
+  set width(w) {
+    if (this.canvasNode) this.canvasNode.width = w
+  }
+  set height(h) {
+    if (this.canvasNode) this.canvasNode.height = h
+  }
+
+  get width() {
+    if (this.canvasNode)
+      return this.canvasNode.width
+    return 0
+  }
+  get height() {
+    if (this.canvasNode)
+      return this.canvasNode.height
+    return 0
+  }
+}

components/eventList/eventList.js

@@ -18,6 +18,12 @@ Component({
      * 组件的方法列表
      */
     methods: {
-
+        toEventDetail(e){
+            var _eventId = e.currentTarget.dataset.id;
+            // console.log(_eventId)
+            wx.navigateTo({
+              url: '/pages/event-detail/event-detail?eventId='+ _eventId,
+            })
+        }
     }
 })

components/eventList/eventList.wxml

 <!--components/eventList/eventList.wxml-->
 <block wx:for="{{eventList}}" wx:key="index">
-    <view class="list">
+    <view class="list" bindtap="toEventDetail" data-id="{{item.id}}">
         <view class="image-box">
             <image src="https://crisis.zhiweidata.com/app/{{item.imgUrl}}" mode="aspectFill" lazy-load="true" />
         </view>
@@ -12,3 +12,5 @@
         </view>
     </view>
 </block>
+
+<wxs module="dateUtil" src="../../wxs/timeUtil.wxs"></wxs>

components/grade/grade.js

+// components/grade/grade.js
+import * as echarts from "../ec-canvas/echarts"
+const app = getApp()
+
+Component({
+    observers: {
+      'crisisLevel': function (val) {
+        if (val) {
+          this.draw()
+        }
+      }
+    },
+    lifetimes: {
+      attached: function () {
+        this.echartsComponnet = this.selectComponent('#grade')
+      },
+    },
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+      crisisLevel:{
+        type: Number
+      }
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+        // ec: {
+        //     onInit: initChart
+        // }
+        ec: {
+          llazyLoadazy: true,
+        },
+        isDev:app.globalData.isDev
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+      draw () {
+        this.echartsComponnet.init((canvas, width, height, dpr) => {
+          let chart = echarts.init(canvas, null, {
+            width: width,
+            height: height,
+            devicePixelRatio: dpr //解决小程序视图模糊的问题，必写
+          })
+          canvas.setChart(chart)
+          chart.setOption(getOption(this.properties.crisisLevel*20))
+          return chart
+        })
+      }
+    }
+})
+
+// function initChart(canvas, width, height, dpr) {
+//     const chart = echarts.init(canvas, null, {
+//       width: width,
+//       height: height,
+//       devicePixelRatio: dpr // new
+//     });
+//     canvas.setChart(chart);
+  
+//     var option = {
+//       series: [
+//         {
+//           type: 'gauge',
+//           startAngle: 180,
+//           endAngle: 0,
+//           min: 0,
+//           max: 100,
+//           splitNumber: 10,
+//           itemStyle: {
+//             color: '#58D9F9',
+//             shadowColor: 'rgba(0,138,255,0.45)',
+//             shadowBlur: 10,
+//             shadowOffsetX: 2,
+//             shadowOffsetY: 2
+//           },
+//           progress: {
+//             show: true,
+//             roundCap: true,
+//             width: 10
+//           },
+//           pointer: {
+//             icon: 'path://M2090.36389,615.30999 L2090.36389,615.30999 C2091.48372,615.30999 2092.40383,616.194028 2092.44859,617.312956 L2096.90698,728.755929 C2097.05155,732.369577 2094.2393,735.416212 2090.62566,735.56078 C2090.53845,735.564269 2090.45117,735.566014 2090.36389,735.566014 L2090.36389,735.566014 C2086.74736,735.566014 2083.81557,732.63423 2083.81557,729.017692 C2083.81557,728.930412 2083.81732,728.84314 2083.82081,728.755929 L2088.2792,617.312956 C2088.32396,616.194028 2089.24407,615.30999 2090.36389,615.30999 Z',
+//             length: '75%',
+//             width: 10,
+//             offsetCenter: [0, '5%']
+//           },
+//           axisLine: {
+//             roundCap: true,
+//             lineStyle: {
+//               width: 10
+//             }
+//           },
+//           axisTick: {
+//             splitNumber: 1,
+//             lineStyle: {
+//               width: 2,
+//               color: '#999'
+//             }
+//           },
+//           splitLine: {
+//             length: 5,
+//             lineStyle: {
+//               width: 3,
+//               color: '#999'
+//             }
+//           },
+//           axisLabel: {
+//             distance: 10,
+//             color: '#999',
+//             fontSize: 10
+//           },
+//           title: {
+//             show: false
+//           },
+//           detail: {
+//             width: '60%',
+//             lineHeight: 40,
+//             height: 180,
+//             borderRadius: 8,
+//             offsetCenter: [0, '35%'],
+//             valueAnimation: true,
+//             formatter: function (value) {
+//               return value;
+//             },
+//             rich: {
+//               value: {
+//                 fontSize: 30,
+//                 fontWeight: 'bolder',
+//                 color: '#777'
+//               },
+//               unit: {
+//                 fontSize: 10,
+//                 color: '#999',
+//                 padding: [0, 0, -20, 10]
+//               }
+//             }
+//           },
+//           data: [
+//             {
+//               value: 73.4
+//             }
+//           ]
+//         }
+//       ]
+//     };
+  
+//     chart.setOption(option);
+//     return chart;
+// }
+
+function getOption(crisisLevel){
+  var option = {
+    series: [
+      {
+        type: 'gauge',
+        startAngle: 180,
+        endAngle: 0,
+        min: 0,
+        max: 100,
+        splitNumber: 10,
+        itemStyle: {
+          color: '#58D9F9',
+          shadowColor: 'rgba(0,138,255,0.45)',
+          shadowBlur: 10,
+          shadowOffsetX: 2,
+          shadowOffsetY: 2
+        },
+        progress: {
+          show: true,
+          roundCap: true,
+          width: 10
+        },
+        pointer: {
+          icon: 'path://M2090.36389,615.30999 L2090.36389,615.30999 C2091.48372,615.30999 2092.40383,616.194028 2092.44859,617.312956 L2096.90698,728.755929 C2097.05155,732.369577 2094.2393,735.416212 2090.62566,735.56078 C2090.53845,735.564269 2090.45117,735.566014 2090.36389,735.566014 L2090.36389,735.566014 C2086.74736,735.566014 2083.81557,732.63423 2083.81557,729.017692 C2083.81557,728.930412 2083.81732,728.84314 2083.82081,728.755929 L2088.2792,617.312956 C2088.32396,616.194028 2089.24407,615.30999 2090.36389,615.30999 Z',
+          length: '75%',
+          width: 10,
+          offsetCenter: [0, '5%']
+        },
+        axisLine: {
+          roundCap: true,
+          lineStyle: {
+            width: 10
+          }
+        },
+        axisTick: {
+          splitNumber: 1,
+          lineStyle: {
+            width: 2,
+            color: '#999'
+          }
+        },
+        splitLine: {
+          length: 5,
+          lineStyle: {
+            width: 3,
+            color: '#999'
+          }
+        },
+        axisLabel: {
+          distance: 15,
+          color: '#999',
+          fontSize: 10
+        },
+        title: {
+          show: false
+        },
+        detail: {
+          width: '60%',
+          lineHeight: 40,
+          height: 180,
+          borderRadius: 8,
+          offsetCenter: [0, '35%'],
+          valueAnimation: true,
+          formatter: function (value) {
+            return value;
+          },
+          rich: {
+            value: {
+              fontSize: 30,
+              fontWeight: 'bolder',
+              color: '#777'
+            },
+            unit: {
+              fontSize: 10,
+              color: '#999',
+              padding: [0, 0, -20, 10]
+            }
+          }
+        },
+        data: [
+          {
+            value: crisisLevel
+          }
+        ]
+      }
+    ]
+  };
+
+  return option;
+}

components/grade/grade.json

+{
+    "component": true,
+    "usingComponents": {
+        "ec-canvas": "/components/ec-canvas/ec-canvas"
+    }
+}
\ No newline at end of file

components/grade/grade.wxml

+<!--components/grade/grade.wxml-->
+<view class="ec-container">
+    <ec-canvas id="grade" canvas-id="grade" ec="{{ec}}" force-use-old-canvas="{{isDev}}"></ec-canvas>
+</view>

components/grade/grade.wxss

+/* components/grade/grade.wxss */
+.ec-container {
+    height: 600rpx;
+    margin-bottom: -300rpx;
+    margin-top: -100rpx;
+}
\ No newline at end of file

components/out/out.js

+// components/out/out.js
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        url: String
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+
+    }
+})

components/out/out.json

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

components/out/out.wxml

+<!--components/out/out.wxml-->
+<!-- 跳转外部链接 -->
+<web-view src="{{url}}"></web-view>

components/out/out.wxss

+/* components/out/out.wxss */
\ No newline at end of file

components/picture-layer/picture-layer.js

+// components/picture-layer/picture-layer.js
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        showPicture: Boolean,
+        img: String
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        //关闭遮罩层
+        closeLayer(){
+            console.log("点了关闭遮罩层")
+            this.triggerEvent('closePicture')
+        }
+    }
+})

components/picture-layer/picture-layer.json

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

components/picture-layer/picture-layer.wxml

+<!--components/picture-layer/picture-layer.wxml-->
+<view class="layer" bindtap="closeLayer">
+    <image src='https://crisis.zhiweidata.com/app/{{img}}'/>
+</view>

components/picture-layer/picture-layer.wxss

+/* components/picture-layer/picture-layer.wxss */
+/* 设置背景遮罩层样式 */
+.layer{
+    position: fixed;
+    width: 100%;
+    height: 100%;
+    top: 0;
+    background: rgba(0, 0, 0, 0.4);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    z-index: 999;
+}
+/* 设置展示图片大小 */
+image{
+    width: 80%;
+    height: 10%;
+}

components/pie/pie.js

+// components/trends/trends.js
+import * as echarts from "../ec-canvas/echarts"
+const app = getApp()
+
+Component({
+    observers: {
+      'overView': function (val) {
+        if (val) {
+          this.draw()
+        }
+      }
+    },
+    lifetimes: {
+      attached: function () {
+        this.echartsComponnet = this.selectComponent('#pie')
+      },
+    },
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+      overView:Object
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+      ec: {
+        llazyLoadazy: true
+      },
+      isDev:app.globalData.isDev
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+      draw () {
+        this.echartsComponnet.init((canvas, width, height, dpr) => {
+          let chart = echarts.init(canvas, null, {
+            width: width,
+            height: height,
+            devicePixelRatio: dpr //解决小程序视图模糊的问题，必写
+          })
+          canvas.setChart(chart)
+          chart.setOption(getOption(this.properties.overView))
+          return chart
+        })
+      }
+    }
+})
+
+function getOption(overView){
+  var option = {
+    tooltip: {
+      trigger: 'item'
+    },
+    legend: {
+      top: 'bottom'
+    },
+    series: [
+      {
+        type: 'pie',
+        radius: ['40%', '70%'],
+        avoidLabelOverlap: false,
+        itemStyle: {
+          borderRadius: 5,
+          borderColor: '#fff',
+          borderWidth: 1
+        },
+        label: {
+          show: false,
+          position: 'center'
+        },
+        emphasis: {
+          label: {
+            show: true,
+            fontSize: '20',
+            fontWeight: 'bold'
+          }
+        },
+        labelLine: {
+          show: false
+        },
+        data: [
+          //TODO 先用总量吧
+          { value: overView.articleCount, name: '微信' },
+          { value: overView.articleCount, name: '微博' },
+          { value: overView.articleCount, name: '网媒' }
+        ]
+      }
+    ]
+  };
+
+  return option;
+}
+
+// function initChart(canvas, width, height, dpr) {
+//   console.log()
+//   const chart = echarts.init(canvas, null, {
+//     width: width,
+//     height: height,
+//     devicePixelRatio: dpr // new
+//   });
+//   canvas.setChart(chart);
+
+//   var option = {
+//     tooltip: {
+//       trigger: 'item'
+//     },
+//     legend: {
+//       top: 'bottom'
+//     },
+//     series: [
+//       {
+//         type: 'pie',
+//         radius: ['40%', '70%'],
+//         avoidLabelOverlap: false,
+//         itemStyle: {
+//           borderRadius: 5,
+//           borderColor: '#fff',
+//           borderWidth: 1
+//         },
+//         label: {
+//           show: false,
+//           position: 'center'
+//         },
+//         emphasis: {
+//           label: {
+//             show: true,
+//             fontSize: '20',
+//             fontWeight: 'bold'
+//           }
+//         },
+//         labelLine: {
+//           show: false
+//         },
+//         data: [
+//           { value: 1048, name: '微信' },
+//           { value: 735, name: '微博' },
+//           { value: 580, name: '网媒' }
+//         ]
+//       }
+//     ]
+//   };
+
+//   chart.setOption(option);
+//   return chart;
+// }
+
+

components/pie/pie.json

+{
+    "component": true,
+    "usingComponents": {
+        "ec-canvas": "/components/ec-canvas/ec-canvas"
+    }
+}
\ No newline at end of file

components/pie/pie.wxml

+<!--components/trends/trends.wxml-->
+<view class="ec-container">
+    <ec-canvas id="pie" canvas-id="pie" ec="{{ec}}" force-use-old-canvas="{{isDev}}"></ec-canvas>
+</view>
+
+
+

components/pie/pie.wxss

+/* components/trends/trends.wxss */
+.ec-container {
+    margin-top: -50rpx;
+    height: 500rpx;
+}
\ No newline at end of file

components/top/top.js

+// components/top/top.js
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+
+    }
+})

components/top/top.json

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

components/top/top.wxml

+<!--components/top/top.wxml-->
+<view class="top"></view>

components/top/top.wxss

+/* components/top/top.wxss */
+.top{
+    width: 100%;
+    height: 150rpx;
+    /* background-color: #025FEA; */
+    background-image: linear-gradient(#025FEA 50%,#DAE5F5 100%);
+}
\ No newline at end of file

components/trends/trends.js

+// components/trends/trends.js
+import * as echarts from "../ec-canvas/echarts"
+const app = getApp()
+
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        list: Object
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+      ec: {
+        onInit: initChart
+      },
+      isDev:app.globalData.isDev
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        
+    }
+})
+
+function initChart(canvas, width, height, dpr) {
+  const chart = echarts.init(canvas, null, {
+    width: width,
+    height: height,
+    devicePixelRatio: dpr // new
+  });
+  canvas.setChart(chart);
+
+  var option = {
+    tooltip: {
+      trigger: 'axis'
+    },
+    legend: {},
+    xAxis: {
+      type: 'category',
+      boundaryGap: false,
+      data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+    },
+    yAxis: {
+      type: 'value',
+      axisLabel: {
+        formatter: '{value} °C'
+      }
+    },
+    series: [
+      {
+        name: 'Highest',
+        type: 'line',
+        data: [10, 11, 13, 11, 12, 12, 9],
+        markPoint: {
+          data: [
+            { type: 'max', name: 'Max' },
+            { type: 'min', name: 'Min' }
+          ]
+        },
+        markLine: {
+          data: [{ type: 'average', name: 'Avg' }]
+        }
+      },
+      {
+        name: 'Lowest',
+        type: 'line',
+        data: [1, -2, 2, 5, 3, 2, 0],
+        markPoint: {
+          data: [{ name: '周最低', value: -2, xAxis: 1, yAxis: -1.5 }]
+        },
+        markLine: {
+          data: [
+            { type: 'average', name: 'Avg' },
+            [
+              {
+                symbol: 'none',
+                x: '90%',
+                yAxis: 'max'
+              },
+              {
+                symbol: 'circle',
+                label: {
+                  position: 'start',
+                  formatter: 'Max'
+                },
+                type: 'max',
+                name: '最高点'
+              }
+            ]
+          ]
+        }
+      }
+    ]
+  };
+
+  chart.setOption(option);
+  return chart;
+}

components/trends/trends.json

+{
+    "component": true,
+    "usingComponents": {
+        "ec-canvas": "/components/ec-canvas/ec-canvas"
+    }
+}
\ No newline at end of file

components/trends/trends.wxml

+<!--components/trends/trends.wxml-->
+<view class="ec-container">
+    <ec-canvas id="trends" canvas-id="trends" ec="{{ec}}" force-use-old-canvas="{{isDev}}"></ec-canvas>
+</view>
+
+

components/trends/trends.wxss

+/* components/trends/trends.wxss */
+.ec-container {
+    height: 500rpx;
+}

pages/event-detail/event-detail.js

+// pages/event-detail/event-detail.js
+var http = require('../../utils/http')
+
+Page({
+
+    /**
+     * 页面的初始数据
+     */
+    data: {
+        eventId:0,
+        venation:[],
+        overview:[],
+        detail:[],
+        lineHour:[],
+        hasCollect:false,
+        showDetail: true,
+        starMap:[
+            {level:1,name:"低"},
+            {level:2,name:"较低"},
+            {level:3,name:"一般"},
+            {level:4,name:"较大"},
+            {level:5,name:"重大"}
+        ]
+    },
+
+    /**
+     * 生命周期函数--监听页面加载
+     */
+    onLoad: function (options) {
+        this.setData({
+            eventId: options.eventId,
+        });
+
+        //危机脉络
+        this.getVenation();
+        //危机概述
+        this.getOverview();
+        //基本信息
+        this.getDetail();
+        //危机趋势
+        this.getLineHour();
+    },
+    getVenation(){
+        http.getRequest('/events/'+this.data.eventId+'/venation').then(res=>{
+            if(res.data.success){
+                this.setData({
+                    venation:res.data.data
+                })
+            }
+        }).catch(() => {
+            wx.showToast({
+                title: '请求失败!',
+                icon: 'none'
+              })    
+        });
+    },
+    getOverview(){
+        http.getRequest('/events/'+this.data.eventId+'/overview').then(res=>{
+            if(res.data.success){
+                this.setData({
+                    overview:res.data.data
+                })
+            }
+        }).catch(() => {
+            wx.showToast({
+                title: '请求失败!',
+                icon: 'none'
+              })    
+        });
+    },
+    getDetail(){
+        http.getRequest('/events/'+this.data.eventId+'/detail').then(res=>{
+            if(res.data.success){
+                this.setData({
+                    detail:res.data.data,
+                    hasCollect:res.data.data.hasCollect
+                })
+            }
+        }).catch(() => {
+            wx.showToast({
+                title: '请求失败!',
+                icon: 'none'
+              })    
+        });
+    },
+    getLineHour(){
+        http.getRequest('/events/'+this.data.eventId+'/spread/line').then(res=>{
+            if(res.data.success){
+                this.setData({
+                    lineHour: res.data.data.lineHour
+                })
+            }
+        }).catch(() => {
+            wx.showToast({
+                title: '请求失败!',
+                icon: 'none'
+              })    
+        });
+    },
+    //收藏事件
+    collect(e){
+        var _eventId=e.currentTarget.dataset.id;
+        http.postRequest('/collects/event/'+_eventId).then(res=>{
+            if(res.data.success){
+                this.setData({
+                    hasCollect:true
+                })
+                wx.showToast({
+                    title: '收藏事件成功',
+                    icon: 'none'
+                })
+            }
+        })
+    },
+    //取消收藏事件
+    cancelCollect(e){
+        var _eventId=e.currentTarget.dataset.id;
+        http.deleteRequest('/collects/event/'+_eventId).then(res=>{
+            if(res.data.success){
+                this.setData({
+                    hasCollect:false
+                })
+                wx.showToast({
+                    title: '取消收藏成功',
+                    icon: 'none'
+                })
+            }
+        })
+    },
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面隐藏
+     */
+    onHide: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面卸载
+     */
+    onUnload: function () {
+
+    },
+
+    /**
+     * 页面相关事件处理函数--监听用户下拉动作
+     */
+    onPullDownRefresh: function () {
+
+    },
+
+    /**
+     * 页面上拉触底事件的处理函数
+     */
+    onReachBottom: function () {
+
+    },
+
+    /**
+     * 用户点击右上角分享
+     */
+    onShareAppMessage: function () {
+
+    }
+})
\ No newline at end of file

pages/event-detail/event-detail.json

+{
+  "usingComponents": {
+    "top": "/components/top/top",
+    "grade": "/components/grade/grade",
+    "pie": "/components/pie/pie",
+    "trends": "/components/trends/trends",
+    "venation": "./venations/venations"
+  }
+}
\ No newline at end of file

pages/event-detail/event-detail.wxml

+<!--pages/event-detail/event-detail.wxml-->
+<scroll-view scroll-y="true" class="container">
+    <!-- 头部背景 -->
+    <top></top>
+
+    <!-- 事件信息 -->
+    <view class="event-center">
+        <view class="event-information">
+            <view class="event-img">
+                <image src="https://crisis.zhiweidata.com/app/{{detail.imgUrl}}" mode="aspectFill" lazy-load="true"></image>
+            </view>
+            <view class="title">
+                <view class="name">{{detail.eventName}}</view>
+                <view class="desc">{{detail.introduction}}</view>
+            </view>
+        </view>
+        <view class="event-tag">
+            <view class="brand">
+                涉事品牌：{{detail.priBrand}}
+            </view>
+            <view class="crisis">
+                危机类型：{{detail.priCrisisTags}}
+            </view>
+            <view class="star">
+                <image src="../../image/star-active.png" lazy-load="true" bindtap="cancelCollect" data-id="{{detail.id}}" wx:if="{{hasCollect}}" ></image>
+                <image src="../../image/star.png" lazy-load="true" bindtap="collect" data-id="{{detail.id}}" wx:else></image>
+            </view>
+        </view>
+    </view>
+
+    <!-- 提要 -->
+    <view class="abstract">
+        <view class="context">本次事件公关传播效果指数{{overview.interveneScore}}，超过系统内{{overview.compareInterveneScore}}的事件。</view>
+    </view>
+
+    <!-- 评价 -->
+    <view class="estimate-container">
+        <view class="moudle-title">评价</view>
+        <grade crisisLevel="{{overview.crisisLevel}}"></grade>
+        <view class="line-title">
+            <text>{{overview.crisisLevelZh}}风险</text>
+        </view>
+        <view class="star">
+            <block wx:for="{{starMap}}" wx:for="index">
+                <view wx:if="{{overview.crisisLevel>=index+1}}"><image src="../../image/star-active.png" lazy-load="true"></image></view>
+                <view wx:if="{{overview.crisisLevel<index+1}}"><image src="../../image/star.png" lazy-load="true"></image></view>
+            </block>
+        </view>
+    </view>
+
+    <!-- 指标 -->
+    <view class="indicator-container">
+        <view class="moudle-title">指标</view>
+        <view class="table">
+            <view class="tr">
+                <view class="td">传播量</view>
+                <view class="td">{{overview.articleCount}}</view>
+                <view class="td">持续周期</view>
+                <view class="td">{{overview.continueTime}}</view>
+            </view>
+            <view class="tr">
+                <view class="td">公关回应次数</view>
+                <view class="td">{{overview.interveneCount}}</view>
+                <view class="td">次生舆情</view>
+                <view class="td">{{overview.secondaryCount}}</view>
+            </view>
+            <view class="tr">
+                <view class="td">主流媒体</view>
+                <view class="td">
+                    {{overview.importantCount}}/<span class="avg">{{overview.avgImportantCount}}</span>
+                </view>
+                <view class="td">微博千万粉丝用户</view>
+                <view class="td">
+                    {{overview.qwFanCount}}/<span class="avg">{{overview.avgQwFanCount}}</span>
+                </view>
+            </view>
+            <view class="tr">
+                <view class="td">微博百万粉丝用户</view>
+                <view class="td">
+                    {{overview.bwFanCount}}/<span class="avg">{{overview.avgBwFanCount}}</span>
+                </view>
+                <view class="td">微博十万粉丝用户</view>
+                <view class="td">
+                    {{overview.swFanCount}}/<span class="avg">{{overview.avgSwFanCount}}</span>
+                </view>
+            </view>
+        </view>
+        <pie overView="{{overview}}"></pie>
+    </view>
+
+    <!-- 脉络 -->
+    <view class="venation-container">
+        <view class="moudle-title">脉络</view>
+        <!-- 列表 -->
+        <venation title="上升期" list="{{venation.lurk}}"></venation>
+        <venation title="热议期" list="{{venation.hot}}"></venation>
+        <venation title="衰退期" list="{{venation.recession}}"></venation>
+    </view>
+
+    <!-- 趋势 -->
+    <view class="trend-container">
+        <view class="moudle-title">危机趋势图</view>
+        <trends list="{{lineHour}}"></trends>
+    </view>
+
+    
+</scroll-view>
+

pages/event-detail/event-detail.wxss

+/* pages/event-detail/event-detail.wxss */
+page{
+    background-color:#e8ebf1;
+    height:100vh;
+}
+.event-center{
+    position: relative;
+    width: 700rpx;
+    height: 300rpx;
+    margin: -100rpx auto 0;
+    background-color: #fff;
+    border-radius: 5px;
+    box-shadow: 0px 5px 5px #e8e8e8;
+}
+.event-center .event-information{
+    height: 200rpx;
+    border-bottom: 1px solid #eee;
+    margin: 0rpx 20rpx;
+}
+.event-center .event-information .event-img{
+    position: absolute;
+    left: 30rpx;
+    top: 30rpx;
+    overflow: hidden;
+    border-radius: 50%;
+}
+.event-center .event-information .event-img image{
+    width: 120rpx;
+    height: 120rpx;
+    vertical-align: middle;
+}
+.event-center .event-information .title{
+    position: absolute;
+    left: 180rpx;
+    top: 30rpx;
+    width: 500rpx;
+}
+.event-center .event-information .title .name{
+    width: 500rpx;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+.event-center .event-information .title .desc{
+    font-size: 24rpx;
+    color: #999;
+    display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    overflow: hidden;
+    margin-top: 20rpx;
+}
+.event-center .event-tag{
+    display: flex;
+    justify-content: space-around;
+    height: 100rpx;
+    color: #666;
+    font-size: 28rpx;
+    line-height: 100rpx;
+}
+.event-center .event-tag .brand{
+    margin-right: 20rpx;
+}
+.event-center .event-tag .star image{
+    width: 30rpx;
+    height: 30rpx;
+}
+
+/* 提要 */
+.abstract{
+    background-color: #fff;
+    border-radius: 5px;
+    box-shadow: 0px 5px 5px #e8e8e8;
+    margin-top: 30rpx;
+}
+.abstract .context{
+    height: 25rpx;
+    line-height: 25rpx;
+    font-size: 26rpx;
+    padding: 25rpx 30rpx;
+    color: #666;
+}
+
+/* 危机评价 */
+.estimate-container{
+    background-color: #fff;
+    border-radius: 5px;
+    box-shadow: 0px 5px 5px #e8e8e8;
+    margin-top: 30rpx;
+}
+.estimate-container .line-title{
+    text-align: center;
+    color: #f87653;
+    padding-top: 30rpx;
+}
+.estimate-container .star{
+    display: flex;
+    justify-content:center;
+    padding: 20rpx;
+}
+.estimate-container .star image{
+    width: 30rpx;
+    height: 30rpx;
+}
+
+
+/* 危机指标 */
+.indicator-container{
+    background-color: #fff;
+    border-radius: 5px;
+    box-shadow: 0px 5px 5px #e8e8e8;
+    margin-top: 30rpx;
+}
+.indicator-container .table {
+    margin: 30rpx;
+    border: 1px solid #f5f5f5;
+    font-size: 20rpx;
+}
+.indicator-container .tr {
+    display: flex;
+    width: 100%;
+    height: 50rpx;
+}
+.indicator-container .td {
+    display: flex;
+    justify-content: flex-end;
+    width: 25%;
+    height: 50rpx;
+    line-height: 50rpx;
+    border-right: 1px solid #f5f5f5;
+    padding-right: 5rpx;
+}
+.indicator-container .td:nth-child(odd) {
+    background-color: #fcfcfc;
+    color: #555;
+}
+.indicator-container .td:nth-child(even) {
+    color: #000;
+}
+.indicator-container .td .avg{
+    color:#999
+}
+
+
+
+
+/* 危机趋势 */
+.trend-container{
+    height: 550rpx;
+    background-color: #fff;
+    border-radius: 5px;
+    box-shadow: 0px 5px 5px #e8e8e8;
+    margin-top: 30rpx;
+}
+
+/* 脉络 */
+.venation-container{
+    background-color: #fff;
+    border-radius: 5px;
+    box-shadow: 0px 5px 5px #e8e8e8;
+    margin-top: 30rpx;
+}
+

pages/event-detail/venations/venations.js

+// pages/event-detail/venations/venations.js
+Component({
+    /**
+     * 组件的属性列表
+     */
+    properties: {
+        title:String,
+        list:Object
+    },
+
+    /**
+     * 组件的初始数据
+     */
+    data: {
+        showPicture:false,
+        img:''
+    },
+
+    /**
+     * 组件的方法列表
+     */
+    methods: {
+        toUrl(e){
+            var _url=e.currentTarget.dataset.url
+            // console.log(_url)
+            wx.navigateTo({
+                // url: _url
+                url: '/components/out/out?url='+_url
+            })
+        },
+        // 展示图片
+        showPicture(e){
+            // console.log("点了展示图片")
+            var _img=e.currentTarget.dataset.img
+            // wx.navigateTo({
+            //     url: '/components/picture-layer/picture-layer?img='+_img
+            // })
+            this.setData({
+                showPicture:true,
+                img:_img
+            })
+        },
+        // 关闭展示图片
+        closePicture(){
+            this.setData({
+                showPicture:false,
+                img:''
+            })
+        }
+    }
+})

pages/event-detail/venations/venations.json

+{
+    "component": true,
+    "usingComponents": {
+        "pictureLayer": "/components/picture-layer/picture-layer"
+    }
+}
\ No newline at end of file

pages/event-detail/venations/venations.wxml

+<!--pages/event-detail/venations/venations.wxml-->
+<view class="venations" wx:if="{{list.length > 0}}">
+    <view class="title">{{title}}</view>
+    <view class="venation" wx:for="{{list}}" wx:key="index">
+        <view class="context" wx:if="item.content.length > 0 ">
+            <view bindtap="toUrl" data-url="{{item.url}}">
+                {{item.content}}
+                <image src="/image/picture.png" wx:if="{{item.img}}" catchtap="showPicture" data-img="{{item.img}}"></image>
+            </view>
+        </view>
+        <view class="info">
+            <view class="organization">{{switchUtil.switchOrgan(item.organization)}}</view>
+            <span class="divider">|</span>
+            <view class="time">{{dateUtil.dateFormat(item.publishTime,'yyyy-MM-dd hh时')}}</view>
+        </view>
+    </view>
+</view>
+<!-- 展示图片 -->
+<pictureLayer wx:if="{{showPicture}}" img="{{img}}" bind:closePicture="closePicture"></pictureLayer>
+
+<wxs module="dateUtil" src="../../../wxs/timeUtil.wxs"></wxs>
+<wxs module="switchUtil" src="../../../wxs/switchUtil.wxs"></wxs>

pages/event-detail/venations/venations.wxss

+/* pages/event-detail/venations/venations.wxss */
+.venations{
+    padding-bottom: 30rpx;
+}
+.venations .title{
+    text-align: center;
+    font-size: 28rpx;
+    color: #f87653;
+    margin-bottom: 20rpx;
+}
+.venations > .venation {
+    padding: 0 30rpx 20rpx;
+    position: relative;
+}
+.venations > .venation::before {
+    content: "";
+    width: 12rpx;
+    height: 12rpx;
+    background-color: #fff;
+    border: 1px solid #ccc;
+    position: absolute;
+    left: 12rpx;
+    top: 30rpx;
+    border-radius: 50%;
+    z-index: 2;
+}  
+.venations > .venation::after {
+    content: "";
+    width: 1px;
+    height: 100%;
+    background-color: #ccc;
+    position: absolute;
+    left: 18rpx;
+    top: 0rpx;
+    border-radius: 50%;
+    overflow: hidden;
+}
+.venations .venation .context {
+    font-size: 24rpx;
+    padding: 20rpx;
+    margin-bottom: 15rpx;
+    background: #f6f6f6;
+    /* display: -webkit-box;
+    -webkit-box-orient: vertical;
+    -webkit-line-clamp: 2;
+    overflow: hidden; */
+}
+.venations .venation .context image{
+    width: 30rpx;
+    height: 30rpx;
+    z-index: 2;
+}
+.venations .venation .info {
+    padding-left: 20rpx;
+    font-size: 24rpx;
+    color: #999;
+    display: flex;
+    align-items: center;
+}
+.venations .venation .info .organization{
+    font-weight: bold;
+    /* width: 130rpx;
+    border-right: 2px solid #ccc;
+    margin-right: 25rpx; */
+}
+.venations .venation .divider {
+    padding: 0 25rpx;
+}
+
+

pages/index/index.wxml

 <!--index.wxml-->
-<scroll-view scroll-y="true" style="height: 100vh" scroll-into-view="{{toView}}" scroll-with-animation="true"  >
+<scroll-view scroll-y="true" style="height: 100vh" scroll-into-view="{{toView}}" scroll-with-animation="true" class="container">
 
   <!-- 横幅 -->
   <view class="banner" wx:if="{{banner}}">

pages/library/library.js

@@ -28,21 +28,6 @@ Page({
      * 生命周期函数--监听页面加载
      */
     onLoad: function (options) {
-        
-    },
-
-
-    /**
-     * 生命周期函数--监听页面初次渲染完成
-     */
-    onReady: function () {
-
-    },
-
-    /**
-     * 生命周期函数--监听页面显示
-     */
-    onShow: function () {
         this.getEeventList();
     },
     switchTap(e){
@@ -82,6 +67,21 @@ Page({
         })
     },
 
+
+    /**
+     * 生命周期函数--监听页面初次渲染完成
+     */
+    onReady: function () {
+
+    },
+
+    /**
+     * 生命周期函数--监听页面显示
+     */
+    onShow: function () {
+
+    },
+
     /**
      * 生命周期函数--监听页面隐藏
      */

pages/library/library.wxml

@@ -24,7 +24,6 @@
         </view>
     </block>
 </view> -->
+
 <!-- 列表 -->
 <eventList eventList="{{eventList}}"></eventList>
-
-<wxs module="dateUtil" src="../../wxs/timeUtil.wxs"></wxs>
\ No newline at end of file

pages/search-page.js

-// pages/search-page.js
-Page({
-
-    /**
-     * 页面的初始数据
-     */
-    data: {
-
-    },
-
-    /**
-     * 生命周期函数--监听页面加载
-     */
-    onLoad: function (options) {
-
-    },
-
-    /**
-     * 生命周期函数--监听页面初次渲染完成
-     */
-    onReady: function () {
-
-    },
-
-    /**
-     * 生命周期函数--监听页面显示
-     */
-    onShow: function () {
-
-    },
-
-    /**
-     * 生命周期函数--监听页面隐藏
-     */
-    onHide: function () {
-
-    },
-
-    /**
-     * 生命周期函数--监听页面卸载
-     */
-    onUnload: function () {
-
-    },
-
-    /**
-     * 页面相关事件处理函数--监听用户下拉动作
-     */
-    onPullDownRefresh: function () {
-
-    },
-
-    /**
-     * 页面上拉触底事件的处理函数
-     */
-    onReachBottom: function () {
-
-    },
-
-    /**
-     * 用户点击右上角分享
-     */
-    onShareAppMessage: function () {
-
-    }
-})
\ No newline at end of file

pages/search-page.wxml

-<!--pages/search-page.wxml-->
-<text>pages/search-page.wxml</text>

pages/search-page.wxss

-/* pages/search-page.wxss */
\ No newline at end of file

pages/usercenter/usercenter.json

 {
-  "usingComponents": {}
+  "usingComponents": {
+    "top": "/components/top/top"
+  }
 }
\ No newline at end of file

pages/usercenter/usercenter.wxml

 <!--pages/usercenter/usercenter.wxml-->
 <view class="usercenter">
     <!-- 头部背景 -->
-    <view class="top"></view>
+    <top/>
 
     <!-- 用户信息 -->
     <view class="userinfo">
@@ -18,7 +18,7 @@
         </view>
         <view wx:else>
             <view class="userinfo-avatar" bindtap="bindViewTap">
-                <image src="https://crisis.zhiweidata.com/static/avatar.png"></image>
+                <image src="https://crisis.zhiweidata.com/static/avatar.png" lazy-load="true"></image>
             </view>
             <text class="nickname">微信用户</text>
             <text class="level">请登录</text>
@@ -30,19 +30,19 @@
         <text class="title">推荐功能</text>
         <view class="list">
             <view class="items" bindtap="todo">
-                <image src="../../image/myCrisis.png" mode="aspectFill"></image>
+                <image src="../../image/myCrisis.png" mode="aspectFill" lazy-load="true"></image>
                 <text style="display: block;">我的危机</text>
             </view>
             <view class="items" bindtap="todo">
-                <image src="../../image/myReport.png" mode="aspectFill"></image>
+                <image src="../../image/myReport.png" mode="aspectFill" lazy-load="true"></image>
                 <text style="display: block;">我的报告</text>
             </view>
             <view class="items" bindtap="todo">
-                <image src="../../image/auth.png" mode="aspectFill"></image>
+                <image src="../../image/auth.png" mode="aspectFill" lazy-load="true"></image>
                 <text style="display: block;">账号权限</text>
             </view>
             <view class="items" bindtap="todo">
-                <image src="../../image/account.png" mode="aspectFill"></image>
+                <image src="../../image/account.png" mode="aspectFill" lazy-load="true"></image>
                 <text style="display: block;">账号管理</text>
             </view>
         </view>

pages/usercenter/usercenter.wxss

@@ -3,12 +3,7 @@
     background-color:#e8ebf1;
     height:100vh;
 }
-.top{
-    width: 100%;
-    height: 250rpx;
-    /* background-color: #025FEA; */
-    background-image: linear-gradient(#025FEA 70%,#DAE5F5 100%);
-}
+
 .userinfo {
     position: relative;
     width: 700rpx;
@@ -80,7 +75,7 @@
     align-items: center;
 }
 .features .list image{
-    height: 80rpx;
-    width: 80rpx;
+    height: 100rpx;
+    width: 100rpx;
     align-items: center;
 }
\ No newline at end of file

project.config.json

@@ -39,7 +39,7 @@
         "showES6CompileOption": false
     },
     "compileType": "miniprogram",
-    "libVersion": "2.23.4",
+    "libVersion": "2.24.6",
     "appid": "wx70d8f2455f2152c2",
     "projectname": "危机汇",
     "debugOptions": {

project.private.config.json

@@ -47,6 +47,12 @@
                     "pathName": "pages/search-result/search-result",
                     "query": "",
                     "scene": null
+                },
+                {
+                    "name": "pages/event-detail/event-detail",
+                    "pathName": "pages/event-detail/event-detail",
+                    "query": "eventId=433",
+                    "scene": null
                 }
             ]
         }

utils/http.js

@@ -77,7 +77,7 @@ export const deleteRequest = (url, data) => {
     wx.showNavigationBarLoading()
     return deleteRequest({
         url: baseURL+url,
-        method: 'PUT',
+        method: "DELETE",
         data: data,
         header: {
             "content-type": "application/json",

wxs/switchUtil.wxs

+var switchOrgan = function(organization) {
+  switch (organization) {
+    case 0:
+      return '未知品牌'
+    case 1:
+      return '其他品牌'
+    case 2:
+      return '当事人'
+    case 3:
+      return '重要媒体'
+    case 4:
+      return '重要自媒体'
+    case 5:
+      return '政务机构'
+    case 6:
+      return '涉事品牌'
+  }
+}
+
+module.exports = {
+  switchOrgan: switchOrgan
+};
\ No newline at end of file

wxs/util.wxs

@@ -6,4 +6,4 @@ var toPercent = function(point){
 
 module.exports = {
     toPercent: toPercent
-  };
\ No newline at end of file
+};
\ No newline at end of file