Merge branch 'master' of http://git.ycjcjy.com/zhiyuxing/pc-admin

# Conflicts:
#	src/config/api.js
#	vue.config.js

src/config/api.js

@@ -57,7 +57,12 @@ const apis = {
     delete: {
       method: 'delete',
       url: `${commPrefix}/building/delete/:id`
-    }
+    },
+    getCityName: {
+      method: 'get',
+      url: `${commPrefix}/tdCity?leveltype=2`
+    },
+
   },
   dynamic: {
     list: {
@@ -325,7 +330,13 @@ const apis = {
     add:{
       method:'post',
       url: `${commPrefix}/taBuildingReport/add`
-    }
+    },
+  },
+  indexEcharts:{
+    list:{
+      method:'get',
+      url: `${commPrefix}/indexStatistical`
+    },
   },
 }
 export default apis

src/store/index.js

@@ -19,6 +19,7 @@ const store = new Vuex.Store({
     points: require('./modules/points').default,
     exchange: require('./modules/exchange').default,
     carouselFigure: require('./modules/carouselFigure').default,
+    indexEcharts: require('./modules/indexEcharts').default,
     message: require('./modules/message').default,
     report: require('./modules/report').default,
     news

src/store/modules/building.js

@@ -5,7 +5,8 @@ export default {
   namespaced: true,
   state: {
     buildings: {},
-    detail: {}
+    detail: {},
+    cityNameList:[],
   },
   mutations: {
     updateList (state, payload) {
@@ -13,7 +14,11 @@ export default {
     },
     updateDetail (state, payload) {
       state.detail = payload
-    }
+    },
+    updateCityNameList (state, payload) {
+      state.cityNameList = payload
+    },
+
   },
   actions: {
     setDetailNull ({ commit }) {
@@ -35,13 +40,28 @@ export default {
         })
       })
     },
+    getCityName ({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+        request({
+          ...apis.building.getCityName,
+          params: payload,
+        }).then((data) => {
+          window.console.log(data,"data")
+          commit('updateCityNameList', data)
+          resolve(data)
+        }).catch(({ message }) => {
+          if (typeof message === 'string') {
+            reject(message)
+          }
+        })
+      })
+    },
     getDetail ({ commit }, payload) {
       return new Promise((resolve, reject) => {
         request({
           ...apis.building.detail,
           urlData: payload,
         }).then((data) => {
-          window.console.log(data)
           commit('updateDetail', data)
           resolve(data)
         }).catch(({ message }) => {

src/store/modules/indexEcharts.js

@@ -0,0 +1,63 @@
+import request from '../../utils/request'
+import apis from '../../config/api'
+
+export default {
+  namespaced: true,
+  state: {
+    echartsInfo: {},
+  },
+  mutations: {
+    updateList (state, payload) {
+      state.echartsInfo = payload
+    },
+  },
+  actions: {
+    setDetailNull ({ commit }) {
+      commit('updateList', {})
+    },
+    getIndexEcharts ({ commit }, payload) {
+      return new Promise((resolve, reject) => {
+        request({
+          ...apis.indexEcharts.list,
+          params: payload,
+        }).then((data) => {
+          commit('updateList', data)
+          resolve(data)
+        }).catch((err) => {
+          const message = err.message || err.msg
+          if (typeof message === 'string') {
+            reject(message)
+          }
+        })
+      })
+    },
+    // changeExchangeStatus (_, payload) {
+    //   return new Promise((resolve, reject) => {
+    //     request({
+    //       ...apis.exchange.change,
+    //       data: payload,
+    //     }).then((data) => {
+    //       resolve(data)
+    //     }).catch((err) => {
+    //       const message = err.message || err.msg
+
+    //       if (typeof message === 'string') {
+    //         reject(message)
+    //       }
+    //     })
+    //   })
+    // },
+    // verifyById (_, payload) {
+    //   return new Promise((resolve, reject) => {
+    //     request({
+    //       ...apis.exchange.update,
+    //       urlData: payload,
+    //     }).then((data) => {
+    //       resolve(data)
+    //     }).catch((err) => {
+    //       reject(err)
+    //     })
+    //   })
+    // }
+  }
+}

src/views/building/edit.vue

@@ -100,6 +100,11 @@
             <el-radio :label="0">否</el-radio>
           </el-radio-group>
         </el-form-item>
+        <el-form-item label="所在城市">
+          <el-select v-model="building.cityId" filterable placeholder="请选择">
+            <el-option  v-for="(list,i) in cityNameList" :key="i" :label="list.name" :value="list.id"></el-option>
+          </el-select>
+        </el-form-item>
         <el-form-item label="楼盘区域">
           <el-input v-model="building.buildingArea"></el-input>
         </el-form-item>
@@ -305,138 +310,153 @@
 </template>
 
 <script>
-import { createNamespacedHelpers } from 'vuex'
-import apis from '../../config/api'
-import { mapState } from 'vuex'
+import { createNamespacedHelpers } from "vuex";
+import apis from "../../config/api";
+import { mapState } from "vuex";
 
-const { mapState: mapBuildingState, mapActions: mapBuildingActions, mapMutations: mapBuildingMutations } = createNamespacedHelpers('building')
-const { mapActions: mapApartmentActions } = createNamespacedHelpers('apartment')
+const {
+  mapState: mapBuildingState,
+  mapActions: mapBuildingActions,
+  mapMutations: mapBuildingMutations
+} = createNamespacedHelpers("building");
+const { mapActions: mapApartmentActions } = createNamespacedHelpers(
+  "apartment"
+);
 
 export default {
-  name: 'BuildingEdit',
+  name: "BuildingEdit",
   components: {
-    EditableTag: () => import('@/components/EditableTag.vue'),
+    EditableTag: () => import("@/components/EditableTag.vue")
   },
-  data () {
-    var _self = this
+  data() {
+    var _self = this;
     return {
       upFileUrl: apis.file.upload.url,
-      commPrefix: '',
-      imgurl: '',
+      commPrefix: "",
+      imgurl: "",
       loadingZm: false,
-      activeName: 'detail',
-      dialogImageUrl: '',
+      activeName: "detail",
+      dialogImageUrl: "",
       dialogVisible: false,
-      dialogApartImageUrl: '',
+      dialogApartImageUrl: "",
       dialogApartVisible: false,
       showHx: false,
       markers: [],
       imgList: [],
       tags: [],
       buildingProperty: [],
+      cityName: "123",
       aparments: [],
       aparmentInfo: {},
       aparmentImg: [],
       searchOption: {
-        city: '南京',
+        city: "南京",
         citylimit: false
       },
       saleType: [
         {
           id: 1,
-          name: '待定',
+          name: "待定"
         },
         {
           id: 2,
-          name: '售罄',
+          name: "售罄"
         },
         {
           id: 3,
-          name: '在售',
-        },
+          name: "在售"
+        }
       ],
       mapCenter: [118.789509, 32.019989],
       events: {
-        click: (e) => {
-          _self.updateDetail({..._self.building, coordinate: e.lnglat.lat + ',' + e.lnglat.lng})
+        click: e => {
+          _self.updateDetail({
+            ..._self.building,
+            coordinate: e.lnglat.lat + "," + e.lnglat.lng
+          });
         }
-      },
-    }
+      }
+    };
   },
   computed: {
     ...mapBuildingState({
       detail: x => x.detail,
+      cityNameList: x => x.cityNameList
     }),
     ...mapState({
-      dicts: x =>  x.dicts,
+      dicts: x => x.dicts
     }),
     building: {
-      get () {
-        return this.detail
+      get() {
+        return this.detail;
       },
-      set (val) {
-        return this.updateDetail(val)
+      set(val) {
+        return this.updateDetail(val);
       }
     },
-    propertyType () {
-      return (this.dicts || []).filter(x => x.type === 'propertyType')
+    propertyType() {
+      return (this.dicts || []).filter(x => x.type === "propertyType");
     },
-    uploadHeaders () {
-      const token = localStorage.getItem('x-token') || ''
+    uploadHeaders() {
+      const token = localStorage.getItem("x-token") || "";
       return {
         Authorization: `Bearer ${token}`
-      }
+      };
     }
   },
   methods: {
-    ...mapBuildingMutations([
-      'updateDetail'
-    ]),
+    ...mapBuildingMutations(["updateDetail"]),
     ...mapBuildingActions([
-      'getDetail',
-      'addBuilding',
-      'editBuilding'
+      "getDetail",
+      "getCityName",
+      "addBuilding",
+      "editBuilding"
     ]),
     ...mapApartmentActions([
-      'getApartments',
-      'getApartmentDetail',
-      'addApartment',
-      'editApartment',
-      'deleteApartment'
+      "getApartments",
+      "getApartmentDetail",
+      "addApartment",
+      "editApartment",
+      "deleteApartment"
     ]),
-    getSaleTypeName (id) {
-      return (this.saleType.filter(x => x.id == id) [0] || {}).name
+    getSaleTypeName(id) {
+      return (this.saleType.filter(x => x.id == id)[0] || {}).name;
     },
-    onCancel () {
-      this.$router.push({name: 'buildinglist'})
+    onCancel() {
+      this.$router.push({ name: "buildinglist" });
+      this.$message({
+        message: "保存成功！",
+        type: "success"
+      });
     },
-    handleRemove (file, fileList) {
-      this.imgList = fileList
+    handleRemove(file, fileList) {
+      this.imgList = fileList;
     },
-    handleAparmentRemove (file, fileList) {
-      this.aparmentImg = fileList
+    handleAparmentRemove(file, fileList) {
+      this.aparmentImg = fileList;
     },
-    onSearchResult (pois) { // 搜索地图
-      let latSum = 0
-      let lngSum = 0
+    onSearchResult(pois) {
+      // 搜索地图
+      let latSum = 0;
+      let lngSum = 0;
       if (pois.length > 0) {
         pois.forEach(poi => {
-          let { lng, lat } = poi
-          lngSum += lng
-          latSum += lat
-          this.markers.push([poi.lng, poi.lat])
-        })
+          let { lng, lat } = poi;
+          lngSum += lng;
+          latSum += lat;
+          this.markers.push([poi.lng, poi.lat]);
+        });
         let center = {
           lng: lngSum / pois.length,
           lat: latSum / pois.length
-        }
-        this.mapCenter = [center.lng, center.lat]
+        };
+        this.mapCenter = [center.lng, center.lat];
       }
     },
-    beforeImgUpload (file) {
-      if (file.type !== 'image/jpeg' && file.type !== 'image/png') {
-        this.$message.error('上传图片只能是 JPG 或 PNG 格式!')
-        return false
+    beforeImgUpload(file) {
+      if (file.type !== "image/jpeg" && file.type !== "image/png") {
+        this.$message.error("上传图片只能是 JPG 或 PNG 格式!");
+        return false;
       }
       // if (file.size / 1024 > 300) {
       //   this.$message.error('图片大小不允许超过300k!')
@@ -444,157 +464,184 @@ export default {
       // }
       this.loading = this.$loading({
         lock: true,
-        text: '上传中...',
-        spinner: 'el-icon-loading',
-        background: 'rgba(0, 0, 0, 0.7)'
-      })
+        text: "上传中...",
+        spinner: "el-icon-loading",
+        background: "rgba(0, 0, 0, 0.7)"
+      });
 
-      return true
+      return true;
     },
-    handleAvatarSuccess (res) {
-      this.imgList = [...this.imgList, {
-        url: res.data
-      }]
-      this.loading.close()
+    handleAvatarSuccess(res) {
+      this.imgList = [
+        ...this.imgList,
+        {
+          url: res.data
+        }
+      ];
+      this.loading.close();
     },
     handleMapImgSuccess(res) {
-      this.building = {...this.building, mapImg: res.data }
-      this.loading.close()
+      this.building = { ...this.building, mapImg: res.data };
+      this.loading.close();
     },
     handlePosterSuccess(res) {
-      this.building = {...this.building, poster: res.data }
-      this.loading.close()
+      this.building = { ...this.building, poster: res.data };
+      this.loading.close();
     },
     handlePreSalePermitSuccess(res) {
-      this.building = {...this.building, preSalePermit: res.data }
-      this.loading.close()
+      this.building = { ...this.building, preSalePermit: res.data };
+      this.loading.close();
     },
-    handleAparmentSuccess (res) {
-      this.aparmentImg = [...this.aparmentImg, {
-        url: res.data
-      }]
-      this.loading.close()
+    handleAparmentSuccess(res) {
+      this.aparmentImg = [
+        ...this.aparmentImg,
+        {
+          url: res.data
+        }
+      ];
+      this.loading.close();
     },
-    onSubmit () {
+    onSubmit() {
       const imgs = this.imgList.map((x, i) => {
         return {
-          imgType: 'banner',
+          imgType: "banner",
           url: x.url,
-          orderNo: (i + 1)
-        }
-      })
+          orderNo: i + 1
+        };
+      });
       const tag = this.tags.map(x => {
         return {
           tagName: x
-        }
-      })
-      const building = {...this.building, img: imgs, propertyType: this.buildingProperty.join(','), tag}
+        };
+      });
+      const building = {
+        ...this.building,
+        img: imgs,
+        propertyType: this.buildingProperty.join(","),
+        tag
+      };
       if (!building.buildingId) {
         // 新增
         this.addBuilding({
           onSuccess: this.onCancel,
           detail: JSON.stringify(building)
-        })
+        });
       } else {
         // 修改
         this.editBuilding({
           onSuccess: this.onCancel,
           detail: JSON.stringify(building)
-        })
+        });
       }
     },
-    FormatDate (date) {
-      return (date || '').split('T')[0] === '0001-01-01' ? '' : (date || '').split('T')[0]
+    FormatDate(date) {
+      return (date || "").split("T")[0] === "0001-01-01"
+        ? ""
+        : (date || "").split("T")[0];
     },
-    saveAparment () {
+    saveAparment() {
       const imgs = this.aparmentImg.map((x, i) => {
         return {
-          imgType: 'aparment',
+          imgType: "aparment",
           url: x.url,
-          orderNo: (i + 1)
-        }
-      })
+          orderNo: i + 1
+        };
+      });
       if (!this.aparmentInfo.apartmentId) {
-        this.addApartment(JSON.stringify({
-          ...this.aparmentInfo,
-          img: imgs
-        })).then(() => {
-          this.getAparmentList()
-          this.showHx = false
-        })
+        this.addApartment(
+          JSON.stringify({
+            ...this.aparmentInfo,
+            img: imgs
+          })
+        ).then(() => {
+          this.getAparmentList();
+          this.showHx = false;
+          this.$message({
+            message: "保存成功！",
+            type: "success"
+          });
+        });
       } else {
-        this.editApartment(JSON.stringify({
-          ...this.aparmentInfo,
-          img: imgs
-        })).then(() => {
-          this.getAparmentList()
-          this.showHx = false
-        })
+        this.editApartment(
+          JSON.stringify({
+            ...this.aparmentInfo,
+            img: imgs
+          })
+        ).then(() => {
+          this.getAparmentList();
+          this.showHx = false;
+          this.$message({
+            message: "保存成功！",
+            type: "success"
+          });
+        });
       }
     },
-    addHx () {
-      this.aparmentImg = []
-      this.aparmentInfo = {buildingId: this.building.buildingId}
-      this.showHx = true
+    addHx() {
+      this.aparmentImg = [];
+      this.aparmentInfo = { buildingId: this.building.buildingId };
+      this.showHx = true;
     },
-    getAparmentList () {
-      this.getApartments({buildingId: this.$route.query.id}).then(data => {
-        this.aparments = data
-      })
+    getAparmentList() {
+      this.getApartments({ buildingId: this.$route.query.id }).then(data => {
+        this.aparments = data;
+      });
     },
-    handleEdit (row) {
-      this.aparmentImg = []
+    handleEdit(row) {
+      this.aparmentImg = [];
       this.getApartmentDetail({
         id: row.apartmentId
       }).then(data => {
-        console.log("...",data)
+        console.log("...", data);
         this.aparmentImg = data.buildingImgList.map(x => {
           return {
             name: x.imgId,
             url: x.url
-          }
-        })
-        this.aparmentInfo = data
-        this.showHx = true
-      })
+          };
+        });
+        this.aparmentInfo = data;
+        this.showHx = true;
+      });
     },
-    handleDel (row) {
-      this.$confirm('确认删除此数据?', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
+    handleDel(row) {
+      this.$confirm("确认删除此数据?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
       }).then(() => {
         if (this.building.status === 1) {
-          this.$message.error('当前楼盘处于发布状态，不允许删除！')
-          return false
+          this.$message.error("当前楼盘处于发布状态，不允许删除！");
+          return false;
         }
         this.deleteApartment({
           id: row.apartmentId
         }).then(() => {
-          this.getAparmentList()
-        })
-      })
+          this.getAparmentList();
+        });
+      });
     },
-    initData () {
-      if ((this.$route.query.id || '') !== '') {
-        this.getAparmentList()
-        this.getDetail({id: this.$route.query.id}).then(data => {
-          this.buildingProperty = data.propertyType.split(',')
+    initData() {
+      this.getCityName();
+
+      if ((this.$route.query.id || "") !== "") {
+        this.getAparmentList();
+        this.getDetail({ id: this.$route.query.id }).then(data => {
+          this.buildingProperty = data.propertyType.split(",");
           this.imgList = data.buildingImg.map(x => {
             return {
               name: x.imgId,
               url: x.url
-            }
-          })
-          this.tags = data.buildingTag.map(x => x.tagName)
-        })
+            };
+          });
+          this.tags = data.buildingTag.map(x => x.tagName);
+        });
       }
     }
   },
-  mounted () {
-    this.initData()
+  mounted() {
+    this.initData();
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
@@ -606,10 +653,10 @@ export default {
 
 
 <style lang="scss">
-.header{
+.header {
   width: 50px;
   height: 50px;
-  img{
+  img {
     width: 100%;
     height: 100%;
   }
@@ -622,7 +669,7 @@ export default {
   overflow: hidden;
 }
 .avatar-uploader .el-upload:hover {
-  border-color: #409EFF;
+  border-color: #409eff;
 }
 .avatar-uploader-icon {
   font-size: 28px;
@@ -638,19 +685,23 @@ export default {
   display: block;
 }
 
-.flex-item .amap-demo{
+.flex-item .amap-demo {
   height: 300px;
 }
 
-.el-select{
+.el-form-item__content {
+  overflow-y: hidden;
+  
+}
+.el-select {
   width: 100% !important;
 }
 
-.el-select-dropdown{
+.el-select-dropdown {
   z-index: 10003 !important;
 }
 
-.el-date-picker{
+.el-date-picker {
   z-index: 10002 !important;
 }
 </style>

src/views/customer/customerDetails.vue

@@ -150,7 +150,7 @@ export default {
 
 <style lang="scss" scoped>
 .detail-box {
-  .access-records{
+  .access-records {
     border: 1px solid #dcdcdc;
     border-radius: 5px;
     padding: 12px 15px;

src/views/index.js

@@ -9,6 +9,54 @@ const pages = [
       title: 'Dashboard',
     }
   },
+  {
+    path: 'indexEcharts',
+    name: 'indexEcharts',
+    redirect: 'indexEcharts/index',
+    component: () => import('./index.vue'),
+    meta: {
+      menuShow: true,
+      title: '首页',
+    },
+    children:[
+      {
+        path: 'indexEcharts',
+        name: 'indexEcharts',
+        component: () => import('./indexEcharts/index.vue'),
+        meta: {
+          menuShow: false,
+          // title: '首页',
+        },
+      },
+      {
+        path: 'newUsers',
+        name: 'newUsers',
+        component: () => import('./indexEcharts/newUsers.vue'),
+        meta: {
+          menuShow: false,
+          title: '新增用户',
+        },
+      },
+      {
+        path: 'userSource',
+        name: 'userSource',
+        component: () => import('./indexEcharts/userSource.vue'),
+        meta: {
+          menuShow: false,
+          title: '用户来源',
+        },
+      },
+      {
+        path: 'behaviorAnalysis',
+        name: 'behaviorAnalysis',
+        component: () => import('./indexEcharts/behaviorAnalysis.vue'),
+        meta: {
+          menuShow: false,
+          title: '行为分析',
+        },
+      },
+    ]
+  },
   {
     path: 'consultant',
     name: 'consultant',

src/views/indexEcharts/behaviorAnalysis.vue

@@ -0,0 +1,216 @@
+<template>
+<div>
+  <div class="system-table-search">
+      <div>
+        <ul>
+          <li>
+            <span>用户事件</span>
+            <el-select v-model="form.verifyStatus" placeholder="请选择">
+              <el-option v-for="(item,i) in gridData || []" :key="i" :label="item.name" :value="item.value"></el-option>
+            </el-select>
+          </li>
+          <li>
+            <el-select v-model="form.verifyStatus" placeholder="请选择">
+              <el-option v-for="(item,i) in gridData || []" :key="i" :label="item.name" :value="item.value"></el-option>
+            </el-select>
+          </li>
+          <li>
+            <span>属性</span>
+            <el-select v-model="form.verifyStatus" placeholder="请选择">
+              <el-option v-for="(item,i) in gridData || []" :key="i" :label="item.name" :value="item.value"></el-option>
+            </el-select>
+          </li>
+        </ul>
+      </div>
+    </div>
+  <p>用户行为 最近一个月 
+    <el-date-picker
+      v-model="value"
+      type="daterange"
+      start-placeholder="开始日期"
+      end-placeholder="结束日期"
+      default-value="2019-08-08">
+    </el-date-picker>
+    <el-button class="btn" size="mini"  type="primary" @click="search">查询</el-button>
+  </p>
+  
+  <div class="grid-content" ref="thirdChart"  id="thirdChart"  :style="{ height: '500px',margin:'20px 0',border:'1px solid #eee', padding:'20px',borderRadius:'5px'}" ></div>
+   <el-table :data="tableData2"  border  center  style="width: 100%">
+    <el-table-column label="用户姓名" prop="name"></el-table-column>
+    <el-table-column label="手机号" prop="phone"></el-table-column>
+    <el-table-column label="意向楼盘" prop="building"></el-table-column>
+    <el-table-column label="意向值" prop="num"></el-table-column>
+  </el-table>
+
+</div>
+</template>
+
+<script>
+import { createNamespacedHelpers } from "vuex";
+import apis from "../../config/api";
+import { mapState } from "vuex";
+import Echarts from "echarts";
+
+export default {
+  components: {},
+  data() {
+    return {
+      form: {
+        verifyStatus: ""
+      },
+      gridData: [
+        {
+          name: "未通过",
+          value: "0"
+        },
+        {
+          name: "已通过",
+          value: "1"
+        },
+        {
+          name: "已驳回",
+          value: "2"
+        }
+      ],
+      value: "",
+      tableData2: [
+        {
+          num: "98",
+          name: "王晓红",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "99",
+          name: "王晓红2",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "88",
+          name: "王晓红3",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "94",
+          name: "王晓红4",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        }
+      ]
+    };
+  },
+  computed: {},
+  methods: {
+    search() {},
+    drawLine() {
+      // 折线图
+      let thirdChart = Echarts.init(this.$refs.thirdChart);
+      // 绘制图表
+      thirdChart.setOption({
+        title: {
+          text: "访问人数"
+        },
+        color: ["#000", "green", "#5793f3", "#d14a61", "#241bba", "orange"],
+        tooltip: {
+          trigger: "axis"
+        },
+        legend: {
+          data: ["首页", "项目", "咨询", "名片", "活动", "资讯"]
+        },
+        grid: {
+          left: "3%",
+          right: "4%",
+          bottom: "3%",
+          containLabel: true
+        },
+        toolbox: {},
+        xAxis: {
+          type: "category",
+          boundaryGap: false,
+          data: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
+        },
+        yAxis: {
+          type: "value"
+        },
+        series: [
+          {
+            name: "首页",
+            type: "line",
+            stack: "1",
+            data: [120, 132, 101, 134, 90, 230, 210]
+          },
+          {
+            name: "项目",
+            type: "line",
+            stack: "2",
+            data: [220, 182, 191, 234, 290, 330, 310]
+          },
+          {
+            name: "咨询",
+            type: "line",
+            stack: "3",
+            data: [150, 232, 201, 154, 190, 330, 410]
+          },
+          {
+            name: "名片",
+            type: "line",
+            stack: "4",
+            data: [320, 332, 301, 334, 390, 330, 320]
+          },
+          {
+            name: "活动",
+            type: "line",
+            stack: "5",
+            data: [820, 932, 901, 544, 1290, 1330, 1320]
+          },
+          {
+            name: "资讯",
+            type: "line",
+            stack: "6",
+            data: [400, 500, 201, 934, 1290, 1423, 777]
+          }
+        ]
+      });
+    }
+  },
+  mounted() {
+    this.drawLine();
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+p {
+  margin: 0;
+}
+.system-table-search {
+  display: block;
+  margin: 16px auto 0;
+  height: 60px;
+  width: 100%;
+}
+
+.system-table-search ul > li {
+  margin-right: 20px;
+  display: flex;
+  float: left;
+  align-items: center;
+  margin-bottom: 10px;
+  span {
+    margin-right: 10px;
+  }
+}
+
+.system-table-search ul {
+  font-size: 15px;
+  white-space: nowrap;
+  padding: 0;
+}
+.btn {
+  margin-left: 60px;
+}
+</style>
+
+

src/views/indexEcharts/index.vue

@@ -0,0 +1,585 @@
+<template>
+<div>
+  <el-row class="top-info"  :gutter="20">
+    <el-col :span="8">
+      <div class="grid-content">
+        <p>{{echartsInfo.selectUserCount}}</p>
+        <span>总用户</span>
+      </div>
+    </el-col>
+    <el-col :span="8">
+      <div class="grid-content">
+        <p>{{echartsInfo.selectRegisteredCount}}</p>
+        <span>总注册用户</span>
+      </div>
+    </el-col>
+    <el-col :span="8">
+      <div @click="toNewUsers()" class="grid-content">
+        <p class="under-line">{{echartsInfo.selectRecentlyCount}}</p>
+        <span class="under-line">最近7天新增</span>
+      </div>
+    </el-col>
+  </el-row>
+  <p class="title under-line" @click="toUserSource()">用户来源</p>
+  <span class="title-desc under-line" @click="toUserSource()">最近7天</span>
+  <el-row :gutter="20" :style="{ height: '560px',margin:'20px 0',border:'1px solid #eee',borderRadius:'5px'}">
+    <el-col :span="14">
+      <div class="grid-content" ref="firstChart"  id="firstChart"  :style="{ height: '500px' ,padding:'20px 10px'}" >
+      </div>
+    </el-col>
+    <el-col :span="10" :style="{ height: '560px',borderLeft:'1px solid #eee'}">
+      <div class="grid-content" ref="secondChart"  id="secondChart"  :style="{ height: '500px',padding:'20px 10px'}" >
+      </div>
+    </el-col>
+  </el-row>
+  <p class="title under-line" @click="toBehaviorAnalysis()">用户行为</p>
+  <span class="title-desc under-line" @click="toBehaviorAnalysis()">最近7天</span>
+  <div class="grid-content" ref="thirdChart"  id="thirdChart"  :style="{ height: '500px',margin:'20px 0',border:'1px solid #eee', padding:'20px',borderRadius:'5px'}" ></div>
+  <el-row :gutter="20">
+    <el-col :span="12">
+      <div class="grid-content" ref="fourthChart"  id="fourthChart"  :style="{ height: '500px',margin:'20px 0',border:'1px solid #eee', padding:'20px',borderRadius:'5px'}" >
+      </div>
+    </el-col>
+    <el-col :span="12">
+      <div class="grid-content" ref="fifthChart"  id="fifthChart"  :style="{ height: '500px',margin:'20px 0',border:'1px solid #eee', padding:'20px',borderRadius:'5px'}" >
+      </div>
+    </el-col>
+    <el-col :span="12">
+      <div class="grid-content" ref="sixthChart"  id="sixthChart" :style="{ height: '500px',margin:'20px 0',border:'1px solid #eee', padding:'20px',borderRadius:'5px'}" >
+      </div>
+    </el-col>
+    <el-col :span="12">
+      <div class="grid-content" ref="seventhChart"  id="seventhChart" :style="{ height: '500px',margin:'20px 0',border:'1px solid #eee', padding:'20px',borderRadius:'5px'}" >
+      </div>
+    </el-col>
+  </el-row>
+  <p class="title under-line" @click="toNewUsers()">新增用户</p>
+  <span class="title-desc under-line" @click="toNewUsers()">最近7天</span>
+  <el-table :data="tableData"  border  center  style="width: 100%">
+    <el-table-column label=date prop="name" ></el-table-column>
+  </el-table>
+  <p class="title">意向客户</p>
+  <el-table :data="tableData2"  border  center  style="width: 100%">
+    <el-table-column label="用户姓名" prop="name"></el-table-column>
+    <el-table-column label="手机号" prop="phone"></el-table-column>
+    <el-table-column label="意向楼盘" prop="building"></el-table-column>
+    <el-table-column label="意向值" prop="num"></el-table-column>
+  </el-table>
+</div>
+</template>
+
+<script>
+import { createNamespacedHelpers } from "vuex";
+import apis from "../../config/api";
+import { mapState } from "vuex";
+import Echarts from "echarts";
+const {
+  mapState: mapIndexEchartsState,
+  mapActions: mapIndexEchartsActions
+} = createNamespacedHelpers("indexEcharts");
+
+export default {
+  components: {},
+  data() {
+    return {
+      tableData: [
+        {
+          date: "2016-05-02",
+          name: "15"
+        },
+        {
+          date: "2016-05-04",
+          name: "16"
+        },
+        {
+          date: "2016-05-01",
+          name: "17"
+        },
+        {
+          date: "2016-05-03",
+          name: "18"
+        }
+      ],
+      tableData2: [
+        {
+          num: "98",
+          name: "王晓红",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "99",
+          name: "王晓红2",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "88",
+          name: "王晓红3",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "94",
+          name: "王晓红4",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        }
+      ],
+      userBehavior: [] // 用户行为
+    };
+  },
+  computed: {
+    ...mapIndexEchartsState({
+      echartsInfo: x => x.echartsInfo
+    })
+  },
+  methods: {
+    ...mapIndexEchartsActions(["getIndexEcharts", "setDetailNull"]),
+    initPage() {
+      this.setDetailNull();
+      this.getIndexEcharts();
+    },
+    toNewUsers() {
+      this.$router.push({ name: "newUsers" });
+    },
+    toUserSource() {
+      this.$router.push({ name: "userSource" });
+    },
+    toBehaviorAnalysis() {
+      this.$router.push({ name: "behaviorAnalysis" });
+    },
+    drawLine() {
+      // 基于准备好的dom，初始化echarts实例
+      let firstChart = Echarts.init(this.$refs.firstChart);
+      let labelOption = {
+        normal: {
+          show: true,
+          position: "top",
+          fontSize: 15,
+          rich: {
+            name: {
+              textBorderColor: "#fff"
+            }
+          }
+        }
+      };
+      // 绘制图表
+      firstChart.setOption({
+        color: ["#ff580f", "#ffb400"],
+        backgroundColor: "#fff",
+        tooltip: {
+          trigger: "axis"
+        },
+        toolbox: {
+          show: false,
+          feature: {
+            mark: { show: true },
+            dataView: { show: true, readOnly: false },
+            magicType: { show: true, type: ["bar"] },
+            restore: { show: true },
+            saveAsImage: { show: true }
+          }
+        },
+        calculable: true,
+        legend: {
+          data: ["所有用户", "注册用户"]
+        },
+        xAxis: [
+          {
+            type: "category",
+            axisLabel: {
+              interval: 0,
+              formatter: function(val) {
+                // return val.split("").join("\n");
+                return val;
+              }
+            },
+            data: [
+              "生成海报",
+              "好友分享",
+              "群分享",
+              "线下扫码",
+              "名片分享",
+              "小程序搜索"
+            ]
+          }
+        ],
+        yAxis: [
+          {
+            type: "value",
+            name: "人数（人）",
+            axisTick: {
+              inside: true
+            },
+            axisLabel: {
+              formatter: "{value}"
+            }
+          }
+        ],
+        grid: {
+          left: "1%",
+          right: "1%",
+          containLabel: true,
+          y2: 10
+        },
+        series: [
+          {
+            name: "所有用户",
+            type: "bar",
+            smooth: true,
+            label: labelOption,
+            data: [78, 90, 13, 81, 170, 77]
+          },
+          {
+            name: "注册用户",
+            type: "bar",
+            smooth: true,
+            label: labelOption,
+            data: [26, 49, 62, 45, 21, 89]
+          }
+        ]
+      });
+      // 饼图
+      let secondChart = Echarts.init(this.$refs.secondChart);
+      // 绘制图表
+      secondChart.setOption({
+        tooltip: {
+          trigger: "item",
+          formatter: "{a} <br/>{b} : {c} ({d}%)"
+        },
+        legend: {
+          orient: "vertical",
+          left: "left",
+          data: ["自主进入", "来源全民经纪人", "来源置业顾问"]
+        },
+        series: [
+          {
+            name: "访问来源",
+            type: "pie",
+            radius: "55%",
+            center: ["50%", "60%"],
+            label: {
+              normal: {
+                position: "inner"
+              }
+            },
+            data: [
+              { value: 15, name: "自主进入" },
+              { value: 30, name: "来源全民经纪人" },
+              { value: 75, name: "来源置业顾问" }
+            ],
+            itemStyle: {
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: "rgba(0, 0, 0, 0.5)"
+              }
+            }
+          }
+        ]
+      });
+      // 折线图
+      let thirdChart = Echarts.init(this.$refs.thirdChart);
+      // 绘制图表
+      thirdChart.setOption({
+        title: {
+          text: "访问人数"
+        },
+        color: ["#000", "green", "#5793f3", "#d14a61", "#241bba", "orange"],
+        tooltip: {
+          trigger: "axis"
+        },
+        legend: {
+          data: ["首页", "项目", "咨询", "名片", "活动", "资讯"]
+        },
+        grid: {
+          left: "3%",
+          right: "4%",
+          bottom: "3%",
+          containLabel: true
+        },
+        toolbox: {},
+        xAxis: {
+          type: "category",
+          boundaryGap: false,
+          data: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
+        },
+        yAxis: {
+          type: "value"
+        },
+        series: [
+          {
+            name: "首页",
+            type: "line",
+            stack: "1",
+            data: []
+          },
+          {
+            name: "项目",
+            type: "line",
+            stack: "2",
+            data: [220, 182, 191, 234, 290, 330, 310]
+          },
+          {
+            name: "咨询",
+            type: "line",
+            stack: "3",
+            data: [150, 232, 201, 154, 190, 330, 410]
+          },
+          {
+            name: "名片",
+            type: "line",
+            stack: "4",
+            data: [320, 332, 301, 334, 390, 330, 320]
+          },
+          {
+            name: "活动",
+            type: "line",
+            stack: "5",
+            data: [820, 932, 901, 544, 1290, 1330, 1320]
+          },
+          {
+            name: "资讯",
+            type: "line",
+            stack: "6",
+            data: [400, 500, 201, 934, 1290, 1423, 777]
+          }
+        ]
+      });
+      // 柱状图
+      let fourthChart = Echarts.init(this.$refs.fourthChart);
+      // 绘制图表
+      let labelOption2 = {
+        normal: {
+          show: true,
+          position: "top",
+          fontSize: 15,
+          rich: {
+            name: {
+              textBorderColor: "#fff"
+            }
+          }
+        }
+      };
+      fourthChart.setOption({
+        title: {
+          text: "活跃用户数"
+        },
+        color: ["#3398DB"],
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            type: "shadow"
+          }
+        },
+        grid: {
+          left: "3%",
+          right: "4%",
+          bottom: "3%",
+          containLabel: true
+        },
+        xAxis: [
+          {
+            type: "category",
+            data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
+            axisTick: {
+              alignWithLabel: true
+            }
+          }
+        ],
+        yAxis: [
+          {
+            type: "value"
+          }
+        ],
+        series: [
+          {
+            name: "直接访问",
+            type: "bar",
+            barWidth: "60%",
+            label: labelOption2,
+            data: [10, 52, 200, 334, 390, 330, 220]
+          }
+        ]
+      });
+      // 环形图
+      let fifthChart = Echarts.init(this.$refs.fifthChart);
+      // 绘制图表
+      fifthChart.setOption({
+        title: {
+          text: "转化率"
+        },
+        tooltip: {
+          trigger: "item",
+          formatter: "{a} <br/>{b}: {c} ({d}%)"
+        },
+        legend: {
+          orient: "vertical",
+          x: "right",
+          data: ["收藏楼盘", "查看楼盘"]
+        },
+        series: [
+          {
+            name: "访问来源",
+            type: "pie",
+            radius: ["50%", "70%"],
+            avoidLabelOverlap: false,
+            label: {
+              normal: {
+                show: false,
+                position: "center"
+              },
+              emphasis: {
+                show: true,
+                textStyle: {
+                  fontSize: "30",
+                  fontWeight: "bold"
+                }
+              }
+            },
+            data: [
+              { value: 335, name: "收藏楼盘" },
+              { value: 310, name: "查看楼盘" }
+            ]
+          }
+        ]
+      });
+      // 环形图
+      let sixthChart = Echarts.init(this.$refs.sixthChart);
+      // 绘制图表
+      sixthChart.setOption({
+        title: {
+          text: "性别比例"
+        },
+        tooltip: {
+          trigger: "item",
+          formatter: "{a} <br/>{b}: {c} ({d}%)"
+        },
+        legend: {
+          orient: "vertical",
+          x: "right",
+          data: ["男", "女"]
+        },
+        series: [
+          {
+            name: "访问来源",
+            type: "pie",
+            radius: ["50%", "70%"],
+            avoidLabelOverlap: false,
+            label: {
+              normal: {
+                show: false,
+                position: "center"
+              },
+              emphasis: {
+                show: true,
+                textStyle: {
+                  fontSize: "30",
+                  fontWeight: "bold"
+                }
+              }
+            },
+            labelLine: {
+              normal: {
+                show: false
+              }
+            },
+            data: [{ value: 335, name: "男" }, { value: 310, name: "女" }]
+          }
+        ]
+      });
+      // 饼图
+      let seventhChart = Echarts.init(this.$refs.seventhChart);
+      // 绘制图表
+      seventhChart.setOption({
+        title: {
+          text: "城市分布"
+        },
+        tooltip: {
+          trigger: "item",
+          formatter: "{a} <br/>{b} : {c} ({d}%)"
+        },
+        legend: {
+          orient: "vertical",
+          left: "right",
+          data: ["合肥", "南京", "南通"]
+        },
+        series: [
+          {
+            name: "访问来源",
+            type: "pie",
+            radius: "55%",
+            center: ["50%", "60%"],
+            label: {
+              normal: {
+                position: "inner"
+              }
+            },
+            data: [
+              { value: 21, name: "合肥" },
+              { value: 90, name: "南京" },
+              { value: 47, name: "南通" }
+            ],
+            itemStyle: {
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: "rgba(0, 0, 0, 0.5)"
+              }
+            }
+          }
+        ]
+      });
+    }
+  },
+  mounted() {
+    if (this.echartsInfo) {
+      this.drawLine();
+      // for (var i = 0; i < this.echartsInfo.selectUserBehavior.length; i++) {
+      //   this.members.push(this.echartsInfo.selectUserBehavior[i].members);
+      // }
+    }
+    this.drawLine();
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+p {
+  margin: 0;
+}
+.top-info {
+  margin: 20px 0;
+  .grid-content {
+    background-color: #044281;
+    text-align: center;
+    color: #fff;
+    padding: 26px 0;
+    border-radius: 4px;
+    p {
+      font-size: 24px;
+      margin: 0;
+      line-height: 40px;
+    }
+    span {
+      font-size: 16px;
+    }
+  }
+}
+.title {
+  line-height: 40px;
+  font-size: 22px;
+  font-weight: 600;
+}
+.title-desc {
+  font-size: 16px;
+  color: #888;
+  margin-bottom: 6px;
+}
+.under-line {
+  text-decoration: underline;
+}
+</style>
+
+

src/views/indexEcharts/newUsers.vue

@@ -0,0 +1,123 @@
+<template>
+<div>
+
+  <p class="title">用户行为 最近一个月 
+    <el-date-picker
+      v-model="value"
+      type="daterange"
+      start-placeholder="开始日期"
+      end-placeholder="结束日期"
+      default-value="2019-08-08">
+    </el-date-picker></p>
+  <div class="grid-content" ref="thirdChart"  id="thirdChart"  :style="{ height: '500px',margin:'20px 0',border:'1px solid #eee', padding:'20px',borderRadius:'5px'}" ></div>
+   <el-table :data="tableData2"  border  center  style="width: 100%">
+    <el-table-column label="用户姓名" prop="name"></el-table-column>
+    <el-table-column label="手机号" prop="phone"></el-table-column>
+    <el-table-column label="意向楼盘" prop="building"></el-table-column>
+    <el-table-column label="意向值" prop="num"></el-table-column>
+  </el-table>
+
+</div>
+</template>
+
+<script>
+import { createNamespacedHelpers } from "vuex";
+import apis from "../../config/api";
+import { mapState } from "vuex";
+import Echarts from "echarts";
+
+export default {
+  components: {},
+  data() {
+    return {
+      value: '',
+       tableData2: [
+        {
+          num: "98",
+          name: "王晓红",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "99",
+          name: "王晓红2",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "88",
+          name: "王晓红3",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "94",
+          name: "王晓红4",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        }
+      ]
+    };
+  },
+  computed: {},
+  methods: {
+    drawLine() {
+      // 折线图
+      let thirdChart = Echarts.init(this.$refs.thirdChart);
+      // 绘制图表
+      thirdChart.setOption({
+        title: {
+          text: "新增用户"
+        },
+        color: ["purple", "green"],
+        tooltip: {
+          trigger: "axis"
+        },
+        legend: {
+          data: ["新用户数", "授权注册"]
+        },
+        grid: {
+          left: "3%",
+          right: "4%",
+          bottom: "3%",
+          containLabel: true
+        },
+        toolbox: {},
+        xAxis: {
+          type: "category",
+          boundaryGap: false,
+          data: ["周一", "周二", "周三", "周四", "周五", "周六", "周日"]
+        },
+        yAxis: {
+          type: "value"
+        },
+        series: [
+          {
+            name: "新用户数",
+            type: "line",
+            stack: "1",
+            data: [120, 132, 101, 134, 90, 230, 210]
+          },
+          {
+            name: "授权注册",
+            type: "line",
+            stack: "2",
+            data: [220, 182, 191, 234, 290, 330, 310]
+          },
+        ]
+      });
+    }
+  },
+  mounted() {
+    this.drawLine();
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+p {
+  margin: 0;
+}
+</style>
+
+

src/views/indexEcharts/userSource.vue

@@ -0,0 +1,232 @@
+<template>
+<div>
+  <p class="title">用户行为 最近2个月 
+    <el-date-picker
+      v-model="value"
+      type="daterange"
+      start-placeholder="开始日期"
+      end-placeholder="结束日期"
+      default-value="2019-08-08">
+    </el-date-picker></p>
+  <el-row :gutter="20" :style="{ height: '560px',margin:'20px 0',border:'1px solid #eee',borderRadius:'5px'}">
+    <el-col :span="14">
+      <div class="grid-content" ref="firstChart"  id="firstChart"  :style="{ height: '500px' ,padding:'20px 10px'}" >
+      </div>
+    </el-col>
+    <el-col :span="10" :style="{ height: '560px',borderLeft:'1px solid #eee'}">
+      <div class="grid-content" ref="secondChart"  id="secondChart"  :style="{ height: '500px',padding:'20px 10px'}" >
+      </div>
+    </el-col>
+  </el-row>
+  <el-select  :style="{ margin:'10px 0'}"  v-model="value2" placeholder="请选择">
+    <el-option
+      v-for="item in options"
+      :key="item.value"
+      :label="item.label"
+      :value="item.value">
+    </el-option>
+  </el-select>
+   <el-table :data="tableData2"  border  center  style="width: 100%">
+    <el-table-column label="用户姓名" prop="name"></el-table-column>
+    <el-table-column label="手机号" prop="phone"></el-table-column>
+    <el-table-column label="意向楼盘" prop="building"></el-table-column>
+    <el-table-column label="意向值" prop="num"></el-table-column>
+  </el-table>
+
+</div>
+</template>
+
+<script>
+import { createNamespacedHelpers } from "vuex";
+import apis from "../../config/api";
+import { mapState } from "vuex";
+import Echarts from "echarts";
+
+export default {
+  components: {},
+  data() {
+    return {
+      value: '',
+       tableData2: [
+        {
+          num: "98",
+          name: "王晓红",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "99",
+          name: "王晓红2",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "88",
+          name: "王晓红3",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        },
+        {
+          num: "94",
+          name: "王晓红4",
+          phone: "15742389456",
+          building: "香颂.蔚澜半岛"
+        }
+      ],
+      options: [{
+          value: '选项1',
+          label: '所有用户'
+        }, {
+          value: '选项2',
+          label: '注册用户'
+        }],
+        value2: ''
+    };
+  },
+  computed: {},
+  methods: {
+    drawLine() {
+      // 基于准备好的dom，初始化echarts实例
+      let firstChart = Echarts.init(this.$refs.firstChart);
+      let labelOption = {
+        normal: {
+          show: true,
+          position: "top",
+          fontSize: 15,
+          rich: {
+            name: {
+              textBorderColor: "#fff"
+            }
+          }
+        }
+      };
+      // 绘制图表
+      firstChart.setOption({
+        color: ["#ff580f", "#ffb400"],
+        backgroundColor: "#fff",
+        tooltip: {
+          trigger: "axis"
+        },
+        toolbox: {
+          show: false,
+          feature: {
+            mark: { show: true },
+            dataView: { show: true, readOnly: false },
+            magicType: { show: true, type: ["bar"] },
+            restore: { show: true },
+            saveAsImage: { show: true }
+          }
+        },
+        calculable: true,
+        legend: {
+          data: ["所有用户", "注册用户"]
+        },
+        xAxis: [
+          {
+            type: "category",
+            axisLabel: {
+              interval: 0,
+              formatter: function(val) {
+                // return val.split("").join("\n");
+                return val;
+              }
+            },
+            data: [
+              "生成海报",
+              "好友分享",
+              "群分享",
+              "线下扫码",
+              "名片分享",
+              "小程序搜索"
+            ]
+          }
+        ],
+        yAxis: [
+          {
+            type: "value",
+            name: "人数（人）",
+            axisTick: {
+              inside: true
+            },
+            axisLabel: {
+              formatter: "{value}"
+            }
+          }
+        ],
+        grid: {
+          left: "1%",
+          right: "1%",
+          containLabel: true,
+          y2: 10
+        },
+        series: [
+          {
+            name: "所有用户",
+            type: "bar",
+            smooth: true,
+            label: labelOption,
+            data: [78, 90, 13, 81, 170, 77]
+          },
+          {
+            name: "注册用户",
+            type: "bar",
+            smooth: true,
+            label: labelOption,
+            data: [26, 49, 62, 45, 21, 89]
+          }
+        ]
+      });
+      // 饼图
+      let secondChart = Echarts.init(this.$refs.secondChart);
+      // 绘制图表
+      secondChart.setOption({
+        tooltip: {
+          trigger: "item",
+          formatter: "{a} <br/>{b} : {c} ({d}%)"
+        },
+        legend: {
+          orient: "vertical",
+          left: "left",
+          data: ["自主进入", "来源全民经纪人", "来源置业顾问"]
+        },
+        series: [
+          {
+            name: "访问来源",
+            type: "pie",
+            radius: "55%",
+            center: ["50%", "60%"],
+            label: {
+              normal: {
+                position: "inner"
+              }
+            },
+            data: [
+              { value: 15, name: "自主进入" },
+              { value: 30, name: "来源全民经纪人" },
+              { value: 75, name: "来源置业顾问" }
+            ],
+            itemStyle: {
+              emphasis: {
+                shadowBlur: 10,
+                shadowOffsetX: 0,
+                shadowColor: "rgba(0, 0, 0, 0.5)"
+              }
+            }
+          }
+        ]
+      });
+    }
+  },
+  mounted() {
+    this.drawLine();
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+p {
+  margin: 0;
+}
+</style>
+
+

vue.config.js

@@ -4,8 +4,8 @@ module.exports = {
     port: 8080,
     proxy: {
       '/api': {
-        // target: 'http://192.168.0.238:8080',
-        target: 'http://localhost:8080',
+        target: 'http://192.168.0.131:8080',
+        // target: 'http://localhost:8080',
         changeOrigin: true,
         // pathRewrite: {
         //   '^/api': '/'