'增加智能语音模块'

config/dev.env.js

@@ -5,4 +5,5 @@ const prodEnv = require('./prod.env')
 module.exports = merge(prodEnv, {
   NODE_ENV: '"development"',
   BASE_API: '"http://res.yifangjiaoyu.cn/cms"',
+  SKILL_API: '"http://audioskill.efunbox.cn/audio"',
 })

config/prod.env.js

@@ -2,4 +2,5 @@
 module.exports = {
   NODE_ENV: '"production"',
   BASE_API: '"http://resources.ai160.com/cms"',
+  SKILL_API: '"https://baidu-audio-skill.ai160.com/audio"'
 }

src/api/skill.js

@@ -0,0 +1,67 @@
+import axios from 'axios'
+import { Message, MessageBox } from 'element-ui'
+
+// 创建axios实例
+const service = axios.create({
+  baseURL: process.env.SKILL_API, // api 的 base_url
+  timeout: 5000 // 请求超时时间
+})
+
+// request拦截器
+service.interceptors.request.use(
+  config => {
+    if (localStorage.getItem('token')) {
+      config.headers['token'] = localStorage.getItem('token'); // 让每个请求携带自定义token 请根据实际情况自行修改
+    }
+    return config
+  },
+  error => {
+    // Do something with request error
+    console.log(error) // for debug
+    Promise.reject(error)
+  }
+)
+
+// response 拦截器
+service.interceptors.response.use(
+  response => {
+    /**
+     * code为非200是抛错 可结合自己业务进行修改
+     */
+    const res = response.data
+    if (res.code !== 200) {
+      Message({
+        message: res.message,
+        type: 'error',
+        duration: 5 * 1000
+      })
+    } else {
+      return response.data
+    }
+  },
+  error => {
+    console.log('err' + error) // for debug
+    Message({
+      message: error.message,
+      type: 'error',
+      duration: 5 * 1000
+    })
+    return Promise.reject(error)
+  }
+)
+
+
+export function getSkillList () {
+  return service({
+    url: '/skillInfo',
+    method: 'get',
+  })
+}
+export function getSkillData (params) {
+  return service({
+    url: '/statistics',
+    method: 'get',
+    params
+  })
+}
+

src/pages/layout/leftnav/LeftNav.vue

@@ -19,6 +19,9 @@
       <el-menu-item index="/order/index" route="/order/index">
           <span slot="title">订购报表</span>
       </el-menu-item>
+      <el-menu-item index="/skill/index" route="/skill/index">
+        <span slot="title">智能语音</span>
+      </el-menu-item>
       <!-- <el-menu-item index="/operation/index" route="/operation/index">
           <span slot="title">操作日志</span>
       </el-menu-item> -->

src/pages/skill/Skill.vue

@@ -0,0 +1,178 @@
+<template>
+  <div class="course">
+    <el-card class="box-card">
+      <div slot="header" class="clearfix topForm">
+        <div class="leftForm">
+          <div class="channelForm">
+            技能选择：
+            <el-select v-model="orderParams.skillId" @change="channelChange" placeholder="请选择技能">
+              <el-option
+                v-for="item in skillList"
+                :key="item.skillId"
+                :label="item.skillName"
+                :value="item.skillId"
+              ></el-option>
+            </el-select>
+          </div>
+
+          <div class="dateForm">
+            查询日期：
+            <el-date-picker v-model="orderParams.startDate" type="date" placeholder="起"></el-date-picker>
+            <el-date-picker v-model="orderParams.endDate" type="date" placeholder="止"></el-date-picker>
+          </div>
+        </div>
+
+        <el-button type="primary" style="float: right;" @click="search">搜索</el-button>
+      </div>
+      <el-table :data="skillData" border style="width: 100%" :height="tableHeight">
+        <el-table-column
+          label="日期"
+          prop="day"
+          align="left"
+          header-align="center"
+          min-width="120px"
+        ></el-table-column>
+
+        <el-table-column label="UV" prop="uv" align="right" header-align="center" min-width="100px"></el-table-column>
+         <el-table-column label="VV" prop="vv" align="right" header-align="center" min-width="100px"></el-table-column>
+        <el-table-column
+          label="VIP用户 | UV1"
+          align="right"
+          header-align="center"
+          :render-header="renderheader"
+          prop="vipUv"
+          min-width="120px"
+        ></el-table-column>
+        <el-table-column
+          label="非VIP用户 | UV2=UV-UV1"
+          align="right"
+          header-align="center"
+          :render-header="renderheader"
+          prop="waitVipUv"
+          min-width="140px"
+        ></el-table-column>
+        <el-table-column
+          label="VIP用户占比 | UV1/UV"
+          align="right"
+          header-align="center"
+          :render-header="renderheader"
+          prop="vipProportion"
+          min-width="140px"
+        ></el-table-column>
+       
+        <el-table-column
+          label="付费订单数量"
+          align="right"
+          header-align="center"
+          :render-header="renderheader"
+          prop="totalPayment"
+          min-width="160px"
+        ></el-table-column>
+        <el-table-column
+          label="转化率"
+          align="right"
+          header-align="center"
+          :render-header="renderheader"
+          prop="totalConversion"
+          min-width="190px"
+        ></el-table-column>
+      </el-table>
+      <!-- <el-pagination
+      v-if="orderList.totalElements"
+      background
+      layout="prev, pager, next"
+      :total="orderList.totalElements"
+      @current-change="changePage">
+      </el-pagination>-->
+    </el-card>
+  </div>
+</template>
+<script>
+import { mapGetters } from "vuex";
+import formatDate from "../../utils/formatTime";
+export default {
+  data() {
+    return {
+      tableHeight: 500,
+      dateValue: "",
+      orderParams: {
+        skillId: "",
+        startDate: "",
+        endDate: ""
+      }
+      // orderList:[]
+    };
+  },
+  computed: {
+    ...mapGetters({
+      skillList: "skillList",
+      orderList: "orderList",
+      productList: "productList",
+      channeList: "channeList",
+      skillData: "skillData"
+    })
+  },
+  created() {
+    this.$store.dispatch("getSkillList");
+    console.log(1111, this.skillList);
+    // this.$store.dispatch("getOrderList", this.orderParams);
+    this.orderParams.startDate = this.getYesterDay();
+    this.orderParams.endDate = this.getYesterDay();
+
+    this.tableHeight = document.documentElement.clientHeight * 0.75;
+  },
+  methods: {
+    // 搜索
+    search() {
+      console.log(this.dateValue[0]);
+      console.log(formatDate(this.dateValue[0], 2));
+      this.orderParams.startDate = this.orderParams.startDate
+        ? formatDate(this.orderParams.startDate, 2)
+        : "";
+      this.orderParams.endDate = this.orderParams.endDate
+        ? formatDate(this.orderParams.endDate, 2)
+        : "";
+      this.$store.dispatch("getSkillData", this.orderParams);
+    },
+    // 渠道下课程分页
+    changePage(e) {
+      this.orderParams.pageNo = e;
+      this.$store.dispatch("getSkillData", this.orderParams);
+    },
+
+    // 表头折行
+    renderheader(h, { column, $index }) {
+      return h("span", {}, [
+        h("span", {}, column.label.split("|")[0]),
+        h("br"),
+        h("span", {}, column.label.split("|")[1])
+      ]);
+    },
+    getYesterDay() {
+      let yesterday = new Date().getTime() - 86400000;
+      return formatDate(yesterday, 2);
+    }
+  }
+};
+</script>
+<style lang="less">
+.pruductForm {
+  margin-left: 10px;
+}
+.topForm {
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.leftForm {
+  display: flex;
+  align-items: center;
+  flex-direction: row;
+  justify-content: space-between;
+}
+.dateForm {
+  margin-left: 18px;
+}
+</style>
+

src/router/router.js

@@ -31,16 +31,16 @@ const router = new Router({
         component: () => import('@/pages/order/Order'),
       }]
     },
-    // {
-    //   path: '/channel',
-    //   component: Layout,
-    //   children: [{
-    //     path: 'index',
-    //     name:'Channel',
-    //     meta: { title: '渠道管理', url: '/channel/index' },
-    //     component: () => import('@/pages/channel/Channel'),
-    //   }]
-    // },
+    {
+      path: '/skill',
+      component: Layout,
+      children: [{
+        path: 'index',
+        name:'Skill',
+        meta: { title: '技能相关', url: '/skill/index' },
+        component: () => import('@/pages/skill/Skill'),
+      }]
+    },
     // {
     //   path: '/course',
     //   component: Layout,

src/store/getter.js

@@ -6,5 +6,7 @@ const getters = {
   relationList: state => state.relation.relationList,
   orderList: state => state.order.orderList,
   logList: state => state.operation.logList,
+  skillList: state => state.skill.skillList,
+  skillData: state => state.skill.skillData
 }
 export default getters

src/store/index.js

@@ -7,6 +7,7 @@ import getters from './getter'
 import relation from './modules/relation'
 import order from './modules/order'
 import operation from './modules/operation'
+import skill from './modules/skill'
 Vue.use(Vuex)
 
 const store = new Vuex.Store({
@@ -16,7 +17,8 @@ const store = new Vuex.Store({
     course,
     relation,
     order,
-    operation
+    operation,
+    skill
   },
   getters
 })

src/store/modules/skill.js

@@ -0,0 +1,47 @@
+import { getSkillList, getSkillData} from '../../api/skill'
+
+const skill = {
+  state: {
+    skillList: [],
+    skillData: []
+  },
+  mutations: {
+    GET_SKILL_LIST: (state, data) => {
+      state.skillList = data
+    },
+    GET_SKILL_DATA: (state,data) => {
+        state.skillData = data
+    }
+  },
+  actions: {
+      // 获取技能信息
+    getSkillList({dispatch, commit }) {
+      return new Promise((resolve, reject) => {
+        getSkillList().then(res => {
+          console.log(res.data)
+          if(res.code == 200) {
+            resolve(res.data);
+            commit('GET_SKILL_LIST', res.data)
+          }
+        }).catch(error => {
+          reject(error);
+        })
+      })
+    },
+    getSkillData({dispatch, commit }, data) {
+        return new Promise((resolve, reject) => {
+            getSkillData(data).then(res => {
+            console.log(res.data)
+            if(res.code == 200) {
+              resolve(res.data);
+              commit('GET_SKILL_DATA', res.data)
+            }
+          }).catch(error => {
+            reject(error);
+          })
+        })
+      }
+  }
+}
+
+export default skill