新增页面

src/pages/sale/courseList.vue

+<template>
+  <div class="page-body">
+    <div class="page-search row items-center">
+      <div class="col row wrap q-mr-lg q-col-gutter-md">
+        <div class="col-3">
+          <q-input @input="resetSearch" clearable standout="bg-primary text-white" v-model="msg.CourseName" label="课程名称"
+            @clear="resetSearch" maxlength="20" />
+        </div>
+      </div>
+    </div>
+    <div class="page-content">
+      <q-table :pagination="msg" :loading="loading" no-data-label="暂无相关数据" flat class="sticky-tow-column-table"
+        separator="none" :data="data" :columns="columns" row-key="name">
+        <template v-slot:top="props">
+          <div class="col-2 q-table__title">课程信息</div>
+        </template>
+        <template v-slot:body-cell-CoverImg="props">
+          <q-td :props="props">
+            <q-avatar square size="100px">
+              <img v-if="props.value" :src="props.value" />
+            </q-avatar>
+          </q-td>
+        </template>
+        <template v-slot:body-cell-CourseIntro="props">
+          <q-td :props="props">
+            <span v-html="props.value"></span>
+          </q-td>
+        </template>
+        <template v-slot:body-cell-Status="props">
+          <q-td :props="props">
+            <q-badge :color="props.value==1?'negative':'primary'" :label="props.value==0?'正常':'禁用'" />
+          </q-td>
+        </template>
+        <template v-slot:body-cell-optioned="props">
+          <q-td :props="props">
+            <template v-if="props.row.PreferentialList&&props.row.PreferentialList.length>0">
+              <table>
+                <thead>
+                  <tr>
+                    <td>
+                      优惠条件
+                    </td>
+                    <td>
+                      同行返佣
+                    </td>
+                    <td>
+                      销售返佣
+                    </td>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr v-for="item in props.row.PreferentialList">
+                    <td>
+                      <template v-if="item.PriceDiscountType==1">
+                        买 {{item.BuyNum}} 送 {{item.SendNum}}
+                      </template>
+                      <template v-else-if="item.PriceDiscountType==5">
+                        刷卡分期
+                      </template>
+                      <template v-else>
+                        {{item.PriceDiscountTypeStr}} {{item.PriceMoney}} %
+                      </template>
+                    </td>
+                    <td>
+                      {{item.B2BCommissionMoney}} %
+                    </td>
+                    <td>
+                      {{item.SaleCommissionMoney}} %
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+            </template>
+          </q-td>
+        </template>
+        <template v-slot:bottom>
+          <q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="pageCount"
+            :input="true" @input="changePage" />
+        </template>
+      </q-table>
+    </div>
+  </div>
+</template>
+<script>
+  import {
+    queryCoursePage,
+  } from '../../api/course/index'
+  export default {
+    meta: {
+      title: "课程预览"
+    },
+    components: {
+
+    },
+    data() {
+      return {
+        currentUrl: "",
+        columns: [{
+            name: 'CourseId',
+            label: '课程编号',
+            field: 'CourseId',
+            align: 'left'
+          },
+          {
+            name: 'CourseName',
+            required: true,
+            label: '课程名称',
+            align: 'left',
+            field: row => row.CourseName
+          },
+          {
+            name: 'CoverImg',
+            label: '课程封面',
+            field: 'CoverImg',
+            align: 'left'
+          },
+            {
+            name: 'OriginalPrice',
+            label: '基础价格',
+            field: 'OriginalPrice',
+            align: 'left'
+          },
+          {
+            name: 'optioned',
+            label: '价格信息',
+            field: 'CourseId'
+          },
+          {
+            name: 'Status',
+            label: '状态',
+            align: 'left',
+            field: 'Status'
+          }
+        ],
+        data: [],
+        loading: true,
+        msg: {
+          pageIndex: 1,
+          pageSize: 12,
+          rowsPerPage: 12,
+          CourseName: "",
+          QCateIds: "",
+          Status: "0",
+          IsQPrice: 1, //是否查询优惠价格设置
+          IsQTeacher:1,//是否查询课程讲师
+        },
+        pageCount: 0,
+      }
+    },
+    mounted() {
+      this.currentUrl = this.$route.path
+      this.getcourselist();
+    },
+    methods: {
+      //重新查询
+      resetSearch() {
+        this.msg.pageIndex = 1;
+        this.getcourselist();
+      },
+      //翻页
+      changePage(val) {
+        this.msg.pageIndex = val;
+        this.getcourselist()
+      },
+      //获取菜单分页列表
+      getcourselist() {
+        this.loading = true;
+        queryCoursePage(this.msg).then(res => {
+          this.loading = false
+          this.data = res.Data.PageData
+          this.pageCount = res.Data.PageCount
+        }).catch(() => {
+          this.loading = false
+        })
+      },
+    }
+  }
+
+</script>
+<style lang="sass">
+  @import url('~assets/css/table.sass')
+
+</style>

src/router/routes.js

@@ -146,7 +146,7 @@ const routes = [{
       {
         path: "/course/lessonPreparation", //教师备课
         component: () =>
-        import("pages/course/lessonPreparation.vue")
+          import("pages/course/lessonPreparation.vue")
       },
       {
         path: "/course/prepareclassDetails", //教师备课 备课详情
@@ -421,6 +421,11 @@ const routes = [{
         component: () =>
           import("pages/sale/japaneseTrain.vue")
       },
+      {
+        path: "/sale/courseList", //销售 课程预览
+        component: () =>
+          import("pages/sale/courseList.vue")
+      },
       {
         path: "/sale/myOrder", //销售 我的订单
         component: () =>