Procházet zdrojové kódy

Merge remote-tracking branch 'origin/qinqiao_NEW' into pern

qinzhipeng_v před 5 roky
rodič
revize
f4dc88b817

+ 4 - 4
package.json

@@ -25,7 +25,7 @@
     "@fullcalendar/vue": "^4.4.0",
     "@tinymce/tinymce-vue": "^3.2.2",
     "animate.css": "^3.7.2",
-    "axios": "0.18.0",
+    "axios": "^0.19.2",
     "cnpm": "^6.1.1",
     "core-js": "^2.6.11",
     "browserslist": "^4.12.0",
@@ -69,14 +69,14 @@
     "@babel/register": "7.0.0",
     "@vue/cli-plugin-babel": "3.6.0",
     "@vue/cli-plugin-eslint": "3.6.0",
-    "@vue/cli-plugin-unit-jest": "3.6.3",
-    "@vue/cli-service": "3.6.0",
+    "@vue/cli-plugin-unit-jest": "^4.4.5",
+    "@vue/cli-service": "^4.4.5",
     "@vue/test-utils": "1.0.0-beta.29",
     "ant-design-vue": "^1.6.2",
     "autoprefixer": "^9.8.0",
     "babel-core": "7.0.0-bridge.0",
     "babel-eslint": "10.0.1",
-    "babel-jest": "23.6.0",
+    "babel-jest": "^26.0.1",
     "babel-plugin-import": "^1.13.0",
     "chalk": "2.4.2",
     "connect": "3.6.6",

+ 93 - 0
src/api/apiManagerment.js

@@ -0,0 +1,93 @@
+import request from '@/utils/request'
+// import { url } from '@/apiConfig/api'
+export const url = 'http://10.96.90.131:9999'
+
+// 获取接口文档树
+export function getPortDoc(data) {
+  return request({
+    url: url + '/huskar/admin/doc/' + data,
+    method: 'get',
+    data
+  })
+}
+
+// 新建接口
+export function createType(data) {
+  return request({
+    url: url + '/huskar/admin/doc',
+    method: 'post',
+    data
+  })
+}
+
+// // 删除设备
+// export function deleteDevice(data) {
+//   return request({
+//     url: url + `/virtual-devices/htw/deleteDevice?vehicleId=` + data,
+//     method: 'get',
+//     data
+//   })
+// }
+
+// // 设备上线开关
+// export function deviceOnline(data) {
+//   return request({
+//     url: url + '/virtual-devices/htw/deviceOnline?lockNo=' + data,
+//     method: 'get',
+//     data
+//   })
+// }
+
+// // 设备下线开关
+// export function deviceOffline(data) {
+//   return request({
+//     url: url + '/virtual-devices/htw/deviceOffline?ecuId=' + data,
+//     method: 'get',
+//     data
+//   })
+// }
+
+// // 设备开锁
+// export function unlockVehicle(data) {
+//   return request({
+//     url: url + '/virtual-devices/htw/device/opt/unlockVehicle?lockNo=' + data,
+//     method: 'get',
+//     data
+//   })
+// }
+
+// // 设备关锁
+// export function lockVehicle(data) {
+//   return request({
+//     url: url + '/virtual-devices/htw/lockVehicle?lockNo=' + data,
+//     method: 'get',
+//     data
+//   })
+// }
+
+// // 编辑
+// export function updateLockAttr(data) {
+//   return request({
+//     url: url + '/virtual-devices/htw/updateLockAttr',
+//     method: 'post',
+//     data
+//   })
+// }
+
+// // 查询用户设备详情(首页刚进来)
+// export function getDevices(data) {
+//   return request({
+//     url: url + '/virtual-devices/htw/getDevices',
+//     method: 'post',
+//     data
+//   })
+// }
+
+// // 查询设备属性
+// export function getLockAttrInfo(data) {
+//   return request({
+//     url: url + '/virtual-devices/htw/user/device/getLockAttrInfo',
+//     method: 'post',
+//     data
+//   })
+// }

+ 141 - 0
src/views/apiManagement/apiList.vue

@@ -0,0 +1,141 @@
+<template>
+  <div class="column">
+    <div class="titDiv">
+      <div class="titIcon" />
+      <div class="titSonName">{{ arr[0] }}接口共{{}}个</div>
+    </div>
+    <!-- <p style="font-size:14px; font-family:MicrosoftYaHei; color:rgba(51,51,51,1); line-height:19px;">com.kuaidadi.liangjian.order.api.PassRemoteService</p> -->
+    <!-- <el-input v-model="describe" clearable size="small" placeholder="点击添加描述" /> -->
+    <el-table
+      :data="tableData1"
+      style="width: 100%"
+      row-key="id"
+      border
+      lazy
+      :load="load"
+      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
+    >
+      <el-table-column prop="date" label="方法名" width="180" />
+      <el-table-column prop="name" label="方法描述" width="180" />
+      <el-table-column prop="address" label="入参列表" />
+      <el-table-column prop="address" label="返回值列表" />
+    </el-table>
+  </div>
+</template>
+
+<script>
+import '@/views/apiManagement/css/index.css'
+
+export default {
+  data() {
+    return {
+      didi: '{ "code":200, "data":{ "orderDetailResult":{ "startPosAddr":"", "endPosName":"河滨之城", "endLng":120.164301, "passengerId":299069687413522, "publishPosAddr":"", "startCityId":0, "originalTotalMoney":0.01, "sendType":1, "publishLng":120.15798569, "fromChannel":1, "voucherAmount":0, "recipient":"小桔", "driverPayType":0, "passengerContactMob":"18605666666", "publishLat":30.28892124, "extraInfo":"馥芮白", "endLat":30.272421, "startCountryId":0, "orderId":5786944445359890, "publishContactMob":"00016013745", "publishTime":1583681227510, "endCityId":330100, "status":2000, "startLng":0, "extraData":"{"productDetail":"星巴克","extraInfo":"馥芮白"}", "endPosAddr":"6单元1602", "startPosName":"", "endCountryId":330103, "productDetail":"星巴克", "totalFee":0.01, "payStatus":0, "startLat":0, "feeItems":[ { "money":0.01, "label":"跑腿费", "type":10 } ], "payType":0, "bizType":0, "serviceCategory":613, "publishPosName":"" } }, "msg":"SUCCESS" }',
+      value: '',
+      centerDialogVisible: false,
+      describe: '',
+      textarea2: '',
+      tableData: [{
+        id: 1,
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路'
+      }, {
+        id: 2,
+        date: '2016-05-04',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路'
+      }, {
+        id: 3,
+        date: '2016-05-01',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路',
+        children: [{
+          id: 31,
+          date: '2016-05-01',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路'
+        }, {
+          id: 32,
+          date: '2016-05-01',
+          name: '王小虎',
+          address: '上海市普陀区金沙江路'
+        }]
+      }, {
+        id: 4,
+        date: '2016-05-03',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路'
+      }],
+      tableData1: [{
+        id: 1,
+        date: '2016-05-02',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路'
+      }, {
+        id: 2,
+        date: '2016-05-04',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路'
+      }, {
+        id: 3,
+        date: '2016-05-01',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路',
+        hasChildren: true
+      }, {
+        id: 4,
+        date: '2016-05-03',
+        name: '王小虎',
+        address: '上海市普陀区金沙江路'
+      }],
+      arr: ['PassRemoteService 乘客远程服务', 'OrderVoucherRemoteService 代金券远程服务', 'PedestrianVehicleSepRemoteService 人车分离远程服务', 'SmoothMoveRemoteService 平滑移动远程服务', 'Vehicle2BOrderRemoteService B端商户远程服务', 'DriverOrderQueryRemoteService 司机订单查询远程服务']
+    }
+  },
+  created() {
+    this.getLsit(this.didi)
+  },
+  methods: {
+    init(e, ele) {
+      console.log(e)
+    },
+    getLsit: function(jsonStr) {
+      var res = ''
+      for (var i = 0, j = 0, k = 0, ii, ele; i < jsonStr.length; i++) { // k:缩进,j:""个数
+        ele = jsonStr.charAt(i)
+        if (j % 2 === 0 && ele === '}') {
+          k--
+          for (ii = 0; ii < k; ii++) ele = '    ' + ele
+          ele = '\n' + ele
+        } else if (j % 2 === 0 && ele === '{') {
+          ele += '\n'
+          k++
+          for (ii = 0; ii < k; ii++) ele += '    '
+        } else if (j % 2 === 0 && ele === ',') {
+          ele += '\n'
+          for (ii = 0; ii < k; ii++) ele += '    '
+        } else if (ele === '"') j++
+        res += ele
+      }
+      // eslint-disable-next-line no-return-assign
+      return this.didi = res
+    },
+    load(tree, treeNode, resolve) {
+      setTimeout(() => {
+        resolve([
+          {
+            id: 31,
+            date: '2016-05-01',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1519 弄'
+          }, {
+            id: 32,
+            date: '2016-05-01',
+            name: '王小虎',
+            address: '上海市普陀区金沙江路 1519 弄'
+          }
+        ])
+      }, 1000)
+    }
+  }
+}
+</script>

+ 145 - 58
src/views/apiManagement/index.vue

@@ -9,25 +9,28 @@
         <div class="Api_search">
           <el-input v-model="value" style="width: 55%;" size="mini" prefix-icon="el-icon-search" clearable filterable placeholder="请搜索接口" />
           <el-button v-if="Interface_list === '接口列表'" style="margin-left:4%" type="primary" size="mini" @click="addPort()">查询</el-button>
-          <el-button v-if="Interface_list === '接口分类'" style="margin-left:4%" type="primary" size="mini" @click="addPort()">添加分类</el-button>
+          <!-- <el-button v-if="Interface_list === '接口分类'" style="margin-left:4%" type="primary" size="mini" @click="addPort()">查询</el-button> -->
+          <el-button v-if="Interface_list === '接口分类'" style="margin-left:4%" type="primary" size="mini" @click="addType()">添加分类</el-button>
         </div>
         <div>
           <el-tree
-            :data="data1"
+            v-if="Interface_list === '接口分类'"
+            :data="list"
             node-key="id"
             empty-text="无相关接口,请确定搜索内容"
             default-expand-all
             :default-expanded-keys="key_arr"
             :expand-on-click-node="false"
+            @node-click="handleNodeClick"
           >
-            <span slot-scope="{ node, data }" class="custom-tree-node" @mouseenter="mouseenter(data)" @mouseleave="mouseleave(data)">
+            <span slot-scope="{ node, data }" style="display: flex; align-items: center; justify-content: space-between;" class="custom-tree-node" @mouseenter="mouseenter(data)" @mouseleave="mouseleave(data)">
               <span>{{ node.label }}</span>
-              <span v-show="data.row && data.del">
+              <span>
                 <el-tooltip class="item" effect="dark" content="添加接口" placement="top">
                   <span v-if="Interface_list === '接口分类'" class="el-icon-plus Api_btn" @click="() => append(data)" />
                 </el-tooltip>
                 <el-tooltip class="item" effect="dark" content="修改接口" placement="top">
-                  <span v-if="Interface_list === '接口分类'" class="el-icon-edit Api_btn" @click="() => dblclick(data)" />
+                  <span v-if="Interface_list === '接口分类'" class="el-icon-edit Api_btn" @click="() => editTree(node,data)" />
                 </el-tooltip>
                 <el-tooltip class="item" effect="dark" content="删除接口" placement="top">
                   <span v-if="Interface_list === '接口分类'" class="el-icon-delete Api_btn" @click="() => remove(data)" />
@@ -35,44 +38,16 @@
               </span>
             </span>
           </el-tree>
-        </div>
+          <el-tree
+            v-if="Interface_list === '接口列表'"
+            :data="data1"
+            node-key="id"
+            empty-text="无相关接口,请确定搜索内容"
+            default-expand-all
+            :default-expanded-keys="key_arr"
+            :expand-on-click-node="false"
+          /></div>
         <div align="center" style="margin: 2% 0 10%;"><el-input v-if="ElMenu" v-model="value" style="width: 90%;" size="mini" prefix-icon="el-icon-search" clearable filterable placeholder="请搜索接口" /></div>
-        <!--添加接口-->
-        <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogAddPortVisible" width="40%">
-          <div style="margin-left:60px">
-            <el-form ref="addDeviceForms" :rules="addDeviceDataRules" :model="addDeviceData">
-              <el-form-item label="模块" prop="lockModel" label-width="80px">
-                <el-select v-model="addDeviceData.lockModel" size="small" class="filter-item" filterable clearable placeholder="请填写" style="width:75%;" @change="chooseVehicleType()">
-                  <el-option v-for="item in lockModelList" :key="item.model" :label="item.modelName" :value="item.model" />
-                </el-select>
-              </el-form-item>
-              <el-form-item label="版本" prop="lockModel" label-width="80px">
-                <el-select v-model="addDeviceData.lockModel" size="small" class="filter-item" filterable clearable placeholder="请填写" style="width:75%;" @change="chooseVehicleType()">
-                  <el-option v-for="item in lockModelList" :key="item.model" :label="item.modelName" :value="item.model" />
-                </el-select>
-              </el-form-item>
-              <el-form-item label="接口类名" prop="bikeModel" label-width="80px">
-                <el-select v-model="addDeviceData.bikeModel" size="small" class="filter-item" filterable clearable placeholder="请填写" style="width:75%;">
-                  <el-option v-for="item in bikeModelList" :key="item.model" :label="item.modelName" :value="item.model" />
-                </el-select>
-              </el-form-item>
-              <el-form-item label="方法名" prop="bikeModel" label-width="80px">
-                <el-select v-model="addDeviceData.bikeModel" size="small" class="filter-item" filterable clearable placeholder="请填写" style="width:75%;">
-                  <el-option v-for="item in bikeModelList" :key="item.model" :label="item.modelName" :value="item.model" />
-                </el-select>
-              </el-form-item>
-              <el-form-item label="api版本" label-width="80px">
-                <el-input v-model="addDeviceData.deviceNum" size="small" style="width:75%;" clearable placeholder="请填写" />
-              </el-form-item>
-            </el-form>
-          </div>
-          <div slot="footer" class="dialog-footer">
-            <el-button size="small" @click="dialogAddPortVisible = false">取消</el-button>
-            <el-button size="small" type="primary">确定</el-button>
-          </div>
-          <div style="margin-top:5%" />
-        </el-dialog>
-
       </div>
     </el-aside>
     <el-main class="ApiRight">
@@ -85,28 +60,66 @@
         <div style="font-size:18px; padding: 8% 0 1%; font-family:PingFangSC-Medium,PingFang SC; font-weight:500; color:rgba(51,59,74,1); line-height:35px;">API接口管理平台介绍及接入文档</div>
         <div style="font-size:14px; width: 80%; font-family:PingFangSC-Regular,PingFang SC; font-weight:400; color:rgba(102,102,102,1); line-height:20px;">计划与EMC合作建设公司级反馈平台,覆盖所有内外部反馈,内部大区、客服等渠道反馈,专项工作组case反馈跟踪等场景,项目较大,处于立项阶段,期望收集更多信息和建议。</div>
       </div>
-      <div v-show="Details" class="ApiRight">
-        <div class="ApiRightContent" style=" overflow:scroll; overflow-x: hidden">
-          <apiDetails ref="Q_details" />
+      <div v-show="home ===false" class="ApiRight">
+        <div class="ApiRightContent" style="overflow:scroll; overflow-x: hidden;margin-left:-11px;margin-top:-10px;">
+          <apiDetails />
+          <!-- <apiList /> -->
         </div>
       </div>
     </el-main>
-    <!-- 新建节点 -->
+
+    <!-- 新建分类 -->
     <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogAddTypeVisible" width="40%">
       <div style="margin-left:60px">
-        <el-form ref="addDeviceForms" :rules="addDeviceDataRules" :model="addDeviceData">
-          <el-form-item label="分类名" prop="lockModel" label-width="80px">
-            <el-input v-model="addDeviceData.lockModel" size="small" clearable style="width:75%;" placeholder="请填写" />
+        <el-form ref="addDeviceForms" :rules="addTreeTypeRules" :model="addTreeType">
+          <el-form-item label="分类名" prop="docName" label-width="80px">
+            <el-input v-model="addTreeType.docName" size="small" clearable style="width:75%;" placeholder="请填写" />
           </el-form-item>
           <el-form-item label="备注" label-width="80px">
-            <el-input v-model="addDeviceData.deviceNum" size="small" clearable style="width:75%;" placeholder="请填写" />
+            <el-input v-model="addTreeType.text" size="small" clearable style="width:75%;" placeholder="请填写" />
           </el-form-item>
         </el-form>
       </div>
       <div slot="footer" class="dialog-footer">
         <el-button size="small" @click="dialogAddTypeVisible = false">取消</el-button>
+        <el-button size="small" type="primary" @click="addTreeTpye(addTreeType)">确定</el-button>
+      </div>
+    </el-dialog>
+
+    <!--添加接口-->
+    <el-dialog :title="textMap[dialogStatus]" :visible.sync="dialogAddPortVisible" width="40%">
+      <div style="margin-left:60px">
+        <el-form ref="addDeviceForms" :rules="addTreeTypeRules" :model="addTreeType">
+          <el-form-item label="模块" prop="lockModel" label-width="80px">
+            <el-select v-model="addTreeType.lockModel" size="small" class="filter-item" filterable clearable placeholder="请填写" style="width:75%;" @change="chooseVehicleType()">
+              <el-option v-for="item in lockModelList" :key="item.model" :label="item.modelName" :value="item.model" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="版本" prop="lockModel" label-width="80px">
+            <el-select v-model="addTreeType.lockModel" size="small" class="filter-item" filterable clearable placeholder="请填写" style="width:75%;" @change="chooseVehicleType()">
+              <el-option v-for="item in lockModelList" :key="item.model" :label="item.modelName" :value="item.model" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="接口类名" prop="bikeModel" label-width="80px">
+            <el-select v-model="addTreeType.bikeModel" size="small" class="filter-item" filterable clearable placeholder="请填写" style="width:75%;">
+              <el-option v-for="item in bikeModelList" :key="item.model" :label="item.modelName" :value="item.model" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="方法名" prop="bikeModel" label-width="80px">
+            <el-select v-model="addTreeType.bikeModel" size="small" class="filter-item" filterable clearable placeholder="请填写" style="width:75%;">
+              <el-option v-for="item in bikeModelList" :key="item.model" :label="item.modelName" :value="item.model" />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="api版本" label-width="80px">
+            <el-input v-model="addTreeType.deviceNum" size="small" style="width:75%;" clearable placeholder="请填写" />
+          </el-form-item>
+        </el-form>
+      </div>
+      <div slot="footer" class="dialog-footer">
+        <el-button size="small" @click="dialogAddPortVisible = false">取消</el-button>
         <el-button size="small" type="primary">确定</el-button>
       </div>
+      <div style="margin-top:5%" />
     </el-dialog>
   </el-container>
 
@@ -116,10 +129,13 @@
 import '@/views/projectManage/publicCss/index.css'
 import '@/views/apiManagement/css/index.css'
 import apiDetails from '@/views/apiManagement/vue/index'
+import apiList from '@/views/apiManagement/apiList'
+import { getPortDoc, createType } from '@/api/apiManagerment.js'
 
 export default {
   components: {
-    apiDetails
+    apiDetails,
+    apiList
   },
   data() {
     var data1 = [{
@@ -171,36 +187,53 @@ export default {
       screenWidth: '',
       Details: false,
       home: true,
+      ElMenu: false,
+      isDetailfalse: false,
       activeName: 'first',
       dialogAddPortVisible: false,
       dialogAddTypeVisible: false,
       textMap: {
         addType: '添加分类',
-        addPort: '添加接口'
+        addPort: '添加接口',
+        editPort: '编辑接口'
       },
+      textarea2: '',
       dialogStatus: '',
-      addDeviceData: {},
-      addDeviceDataRules: {
-        lockModel: [{ required: true, message: '锁类型不能为空', trigger: 'change' }],
+      addTreeType: {},
+      curcentTreeData: {},
+      addTreeTypeRules: {
+        docName: [{ required: true, message: '锁类型不能为空', trigger: 'change' }],
         bikeModel: [{ required: true, message: '车辆类型不能为空', trigger: 'change' }],
         deviceNum: [{ required: true, message: '车辆个数不能为空', trigger: 'change' }],
         lockSupplier: [{ required: true, message: '锁供应商不能为空', trigger: 'change' }],
         bikeSupplier: [{ required: true, message: '车辆供应商不能为空', trigger: 'change' }]
 
       },
+      list: [],
+      list1: [],
+      bikeModelList: [],
+      lockModelList: [],
+      portTreeList: [],
       defaultProps: {
         children: 'children',
         label: 'label'
       }
     }
   },
+  created() {
+    this.$store.state.data.status = false
+    this.getPortTree()
+  },
+  destroyed() {
+    this.$store.state.data.status = false
+  },
   methods: {
     InterfaceLeft(vel) {
       vel === '接口分类' ? this.Interface_list = '接口分类' : this.Interface_list = '接口列表'
     },
     append(data) { // 添加节点
-      this.dialogAddTypeVisible = true
-      this.dialogStatus = 'addType'
+      this.dialogAddPortVisible = true
+      this.dialogStatus = 'addPort'
     },
     mouseenter(data) { // 导航栏显示新建/删除/编辑
       this.$set(data, 'del', true)
@@ -208,10 +241,50 @@ export default {
     mouseleave(data) { // 导航栏隐藏新建/删除/编辑
       this.$set(data, 'del', false)
     },
+    // 获取接口树
+    getPortTree() {
+      getPortDoc(1).then(response => {
+        this.list = response.data
+        this.list = this.list.map(item => ({
+          ...item,
+          label: item.docName,
+          children: item.children ? item.children.map(item => ({
+            ...item,
+            label: item.docName,
+            children: item.children ? item.children.map(item => ({
+              ...item,
+              label: item.docName,
+              children: item.children ? item.children.map(item => ({
+                ...item,
+                label: item.docName
+              })) : ''
+            })) : ''
+          })) : ''
+        }))
+        this.portTreeList = []
+        console.log(this.list)
+      })
+    },
 
+    // 添加接口
+    addPortTpye(data) {
+      createType(this.addTreeType).then(response => {
+        this.getPortTree = response.data
+        console.log(this.portTreeList)
+      })
+    },
+
+    // 添加分类
+    addTreeTpye(data) {
+      this.addTreeType.docName = data.docName
+      this.addTreeType.fileType = 1
+      createType(this.addTreeType).then(response => {
+        this.getPortTree()
+      })
+    },
     // 删除
     remove(node, data) {
-      this.$confirm('是否确认删除', '确认信息', {
+      this.$confirm('是否确认?', '删除接口', {
         distinguishCancelAndClose: true,
         confirmButtonText: '确定',
         cancelButtonText: '取消'
@@ -223,6 +296,18 @@ export default {
           this.$message({ type: 'success', message: '已取消' })
         })
     },
+    handleNodeClick(data) { // 点击节点
+      this.curcentTreeData = {
+        id: data.id
+      }
+      this.home = false
+      // this.getQueryBizModuleList(this.curcentTreeData.id)
+    },
+    // async getQueryBizModuleList(bizId) {
+    // const res = await queryBizModuleList(bizId)
+    // this.moduleData = this.handleData(res.data)
+    // },
+
     cli_Choice() {
       this.Details = true
       this.home = false
@@ -237,6 +322,8 @@ export default {
     },
     editTree(node, data) {
       data.editShow = true
+      this.dialogAddPortVisible = true
+      this.dialogStatus = 'editPort'
       document.querySelector(`#tree-item${data.id}`).style.display = 'none'
     },
     editSuccess(node, data) {

+ 1 - 0
src/views/apiManagement/vue/index.vue

@@ -104,6 +104,7 @@ export default {
       value: '',
       centerDialogVisible: false,
       describe: '',
+      textarea2: '',
       tableData: [{
         id: 1,
         date: '2016-05-02',