看课流量统计

src/api/course/courseRedPacketLog.js

@@ -16,12 +16,12 @@ export function getCourseRedPacketLog(logId) {
     method: 'get'
   })
 }
-export function courseList() {
-  return request({
-    url: '/course/courseRedPacketLog//courseList',
-    method: 'get',
-  })
-}
+// export function courseList() {
+//   return request({
+//     url: '/course/courseRedPacketLog//courseList',
+//     method: 'get',
+//   })
+// }
 export function videoList(id) {
   return request({
     url: '/course/courseRedPacketLog/videoList/' + id,
@@ -62,3 +62,14 @@ export function exportCourseRedPacketLog(query) {
     params: query
   })
 }
+
+/**
+ * 获取课程列表
+ * @returns {*}
+ */
+export function courseList(){
+  return request({
+    url: '/course/courseTrafficLog/courseList',
+    method: 'get',
+  })
+}

src/views/course/courseTrafficLog/index.vue

@@ -6,6 +6,26 @@
           <el-option v-for="(option, index) in companyList" :key="index" :value="option.dictValue" :label="option.dictLabel"></el-option>
         </el-select>
       </el-form-item>
+      <el-form-item label="项目" prop="project">
+        <el-select v-model="form.project" placeholder="请选择项目" filterable clearable size="small">
+          <el-option
+            v-for="dict in projectOptions"
+            :key="dict.dictValue"
+            :label="dict.dictLabel"
+            :value="dict.dictValue"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="课程" prop="courseId">
+        <el-select filterable  v-model="queryParams.courseId" placeholder="请选择课程"  clearable size="small" @change="courseChange(queryParams.courseId)">
+          <el-option
+            v-for="dict in courseLists"
+            :key="dict.dictValue"
+            :label="dict.dictLabel"
+            :value="dict.dictValue"
+          />
+        </el-select>
+      </el-form-item>
       <el-form-item label="年月" prop="time">
         <el-date-picker
           v-model="queryParams.time"
@@ -39,17 +59,19 @@
     <el-table border v-loading="loading" :data="courseTrafficLogList" @selection-change="handleSelectionChange">
       <el-table-column type="selection" width="55" align="center" />
       <el-table-column label="公司名称" align="center" prop="companyName" />
+      <el-table-column label="项目" align="center" prop="projectName" />
+      <el-table-column label="课程" align="center" prop="courseName" />
       <el-table-column label="月份" align="center" prop="month" />
       <el-table-column label="使用流量" align="center">
         <template slot-scope="scope">
           <span>{{ formatTrafficData(scope.row.totalInternetTraffic) }}</span>
         </template>
       </el-table-column>
-      <el-table-column label="费用" align="center">
-        <template slot-scope="scope">
-          <span>{{ formatTrafficMoney(scope.row.totalInternetTraffic) }}</span>
-        </template>
-      </el-table-column>
+<!--      <el-table-column label="费用" align="center">-->
+<!--        <template slot-scope="scope">-->
+<!--          <span>{{ formatTrafficMoney(scope.row.totalInternetTraffic) }}</span>-->
+<!--        </template>-->
+<!--      </el-table-column>-->
     </el-table>
 
     <pagination
@@ -65,8 +87,8 @@
 
 <script>
 import { listCourseTrafficLog, getCourseTrafficLog, delCourseTrafficLog, addCourseTrafficLog, updateCourseTrafficLog, exportCourseTrafficLog } from "@/api/course/courseTrafficLog";
-import { allList } from '../../../api/company/company'
-
+import {courseList} from "@/api/course/courseRedPacketLog";
+import {allList}from "@/api/company/company";
 export default {
   name: "CourseTrafficLog",
   data() {
@@ -91,6 +113,8 @@ export default {
       total: 0,
       // 短链课程流量记录表格数据
       courseTrafficLogList: [],
+      projectOptions:[],
+      courseLists:[],
       // 弹出层标题
       title: "",
       // 是否显示弹出层
@@ -117,8 +141,15 @@ export default {
     };
   },
   created() {
+    courseList().then(response => {
+      this.courseLists = response.list;
+    });
+    this.getDicts("sys_course_project").then(response => {
+      this.projectOptions = response.data;
+    });
     this.getList();
     this.getAllCompany();
+
   },
   methods: {
     getAllCompany() {