Merge branch 'master' of gitee.com:darlk/ShengTangManage into develop

2021-05-11 16:02:13 +08:00
parent e5fb063b57 96274e3abc
commit 65d1c156fd
34 changed files with 955 additions and 134 deletions
--- a/stdiet-ui/src/api/custom/commision.js
+++ b/stdiet-ui/src/api/custom/commision.js
@ -96,3 +96,13 @@ export function orderDetailDay(query) {
  })
 }

+// 导出具体订单按天计算提成明细
+export function exportOrderDetailDay(query) {
+  return request({
+    url: '/custom/commision/exportOrderDetailDay',
+    method: 'get',
+    params: query
+  })
+}
+
+
--- a/stdiet-ui/src/api/custom/nutritionalVideo.js
+++ b/stdiet-ui/src/api/custom/nutritionalVideo.js
@ -69,3 +69,12 @@ export function updateWxShow(data){
    params: data
  })
 }
+
+// 查询营养视频播放地址
+export function getVideoPlayUrlById(id) {
+  return request({
+    url: '/custom/nutritionalVideo/getVideoPlayUrlById/' + id,
+    method: 'get'
+  })
+}
+
--- a/stdiet-ui/src/components/FileUpload/UploadFile.vue
+++ b/stdiet-ui/src/components/FileUpload/UploadFile.vue
@ -9,10 +9,14 @@
  :before-upload="beforeAvatarUpload">
  <img v-if="imageUrl || coverUrl" :src="imageUrl || coverUrl" class="avatar">
  <i v-else class="el-icon-plus avatar-uploader-icon"></i>
-  <div class="el-upload__tip" slot="tip">
-      1、只能上传png、jpg文件，且每个文件不超过{{
+  
+  <div class="el-upload__tip" slot="tip" style="color:#1890ff">
+    <el-button v-if="imageUrl || coverUrl" size="small" type="danger" @click="removeFile">移除</el-button>
+      <div>1、只能上传png、jpg文件，且每个文件不超过{{
        upload.fileSize / (1024 * 1024)
-      }}M
+      }}M</div>
+      <div style="margin-top:5px;">{{tips ? ('2、'+tips) : ''}}</div>
+      
    </div>
 </el-upload>
 </template>
@ -41,7 +45,7 @@ export default {
  methods: {
    resetUpload(){
        this.imageUrl = null;
-        this.fileUrl = null
+        this.fileUrl = null;
    },
    // 文件上传成功处理
    handleFileSuccess(response, file, fileList) {
@ -55,6 +59,11 @@ export default {
        this.$message.error("文件上传失败");
      }
    },
+    removeFile(){
+        this.resetUpload();
+        this.coverUrl = null;
+        this.$emit("callbackMethod", '');
+    },
    // 文件上传失败处理
    handleFileFail(err, file, fileList) {
      this.$message.error("文件上传失败");
@ -79,6 +88,10 @@ export default {
    coverUrl:{
      type: String,
      default: ""
+    },
+    tips: {
+      type: String,
+      default: ""
    }
  }
 };
--- a/stdiet-ui/src/components/OrdercommissDetail/index.vue
+++ b/stdiet-ui/src/components/OrdercommissDetail/index.vue
@ -37,6 +37,7 @@
        <div
          class="order_total_data"
        >
+        
       <span class="order_total_data_span_right20">
            当前页总服务金额：{{totalServerAmount}}元
          </span>
@ -50,6 +51,18 @@
            >未发放总提成：{{ totalNotSendCommission }}元</span
          >  
        </div>
+        <el-row :gutter="10" class="mb8" style="margin-top: 10px;margin-left:10px">
+          <el-col :span="1.5">
+        <el-button
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['commisionDay:detail:export']"
+          >导出
+        </el-button>
+      </el-col>
+    </el-row>
        <div style="width:100%;height:80%;overflow: auto">
        <el-table :data="orderList" v-loading="loading" stripe>
          <el-table-column
@ -208,7 +221,7 @@
  </div>
 </template>
 <script>
-import { orderDetailDay } from "@/api/custom/commision";
+import { orderDetailDay,exportOrderDetailDay } from "@/api/custom/commision";
 import OrderDetail from "@/components/OrderDetail";

 export default {
@ -317,6 +330,23 @@ export default {
    handleOnDetailClick(data) {
      this.$refs.orderDetailRef.showDialog(data.orderId);
    },
+    handleExport(){
+      this.queryParam.serverScopeStartTime = this.serverDateScope && this.serverDateScope.length > 0 ? this.serverDateScope[0] : null;
+      this.queryParam.serverScopeEndTime = this.serverDateScope && this.serverDateScope.length > 0 ? this.serverDateScope[1] : null;
+      const queryParams = this.queryParam;
+      this.$confirm("是否确认导出所有订单提成比例数据项?", "警告", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(function () {
+          return exportOrderDetailDay(queryParams);
+        })
+        .then((response) => {
+          this.download(response.msg);
+        })
+        .catch(function () {});
+    }
  },
 };
 </script>
@ -332,7 +362,7 @@ export default {
 .order_total_data {
  float: right; 
  margin-right: 40px; 
-  margin-bottom:20px
+  margin-bottom:15px
 }

 .order_total_data_span_right20 {
--- a/stdiet-ui/src/components/PhysicalSignsDialog/index.vue
+++ b/stdiet-ui/src/components/PhysicalSignsDialog/index.vue
@ -102,7 +102,7 @@
            </el-table>
          </div>
          <!-- 其他信息 -->
-          <div style="height: 390px; overflow: auto">
+          <div style="height: 370px; overflow: auto">
            <div
              v-for="(item, index) in dataList.slice(1, 10)"
              style="margin-bottom: 50px"
--- a/stdiet-ui/src/components/UploadVideo/index.vue
+++ b/stdiet-ui/src/components/UploadVideo/index.vue
@ -5,7 +5,7 @@
            <el-input
                type="textarea"
                placeholder="请输入视频标题"
-                v-model="videoFrom.title"
+                v-model.trim="videoFrom.title"
                maxlength="50" 
                rows="1"
                show-word-limit
@ -15,7 +15,7 @@
          <el-input
                type="textarea"
                placeholder="请输入视频描述"
-                v-model="videoFrom.description"
+                v-model.trim="videoFrom.description"
                maxlength="1000"
                rows="3"
                show-word-limit
@ -23,7 +23,7 @@
        </el-form-item>
        
         <el-form-item label="视频封面" prop="coverUrl">
-              <UploadFile ref="uploadFile" :prefix="'videoCover'" @callbackMethod="handleCoverUrl"></UploadFile>
+              <UploadFile ref="uploadFile" :prefix="'videoCover'" @callbackMethod="handleCoverUrl" :tips="'视频未传封面图片时，会主动截取封面，但会存在延迟，请勿直接发布到小程序'"></UploadFile>
          </el-form-item>  
          <div style="display:flex">
            <el-form-item label="视频类别" prop="cateId">
@ -52,7 +52,9 @@
            <div>
            <input type="file" accept=".mp4" ref="videoFile" id="videoFile" @change="fileChange($event)">
            <div > <span>上传状态：{{statusText}}</span><span style="margin-left:100px">进度：{{authProgress}}%</span></div>
-            <div > 1、只能上传mp4文件，上传大文件时请使用客户端上传，防止上传超时</div>
+            <div style="color:#1890ff"> 
+                1、只能上传mp4文件，上传大文件时请使用客户端上传，防止上传超时 
+            </div>
            </div>
        </el-form-item>
        <el-form-item label="展示状态" prop="wxShow">
@ -61,7 +63,7 @@
                active-text="小程序展示"
                inactive-text="小程序不展示">
              </el-switch>
-              <div>提示：请保证内容正确再展示到小程序</div>
+              <div style="color:red">提示：请保证内容正确再展示到小程序</div>
          </el-form-item>  
      </el-form>
      <div slot="footer" class="dialog-footer">
@ -86,9 +88,6 @@
          title: [
            { required: true, message: "标题不能为空", trigger: "blur" },
          ],
-          coverUrl: [
-           { required: true, message: "封面不能为空", trigger: "blur" },
-          ],
          cateId:[
            { required: true, message: "视频类别不能为空", trigger: "blur" },
          ],
@ -98,7 +97,9 @@
        },
        callback: null,
        classifyList: [],
+        defaultClassify: null,
        payVideoLevelList:[],
+        defaultPayLevel: null,
        uploadAuth:{
            
        },
@ -118,17 +119,23 @@
        uploader: null,
        statusText: '',
        fileType:['mp4','MP4'],
-        uploading: false
+        uploading: false,
      }
    },
    created(){
-      getAllClassify().then(response => {
+      /*getAllClassify().then(response => {
          if(response.code == 200){
              this.classifyList = response.data;
+              if(response.data != null && response.data.length > 0){
+                 this.defaultClassify = response.data[0].id;
+              }
          }
-      });
+      });*/
      this.getDicts("video_pay_level").then((response) => {
        this.payVideoLevelList = response.data;
+        if(response.data != null && response.data.length > 0){
+          this.defaultPayLevel =  response.data[0].dictValue;
+        }
      });
        
    },
@ -136,22 +143,26 @@
      UploadFile
    },
    methods: {
-        showDialog(callback){
+        showDialog(classifyList, callback){
+            if(classifyList != null && classifyList.length > 0){
+                 this.defaultClassify = classifyList[0].id;
+            }
            this.resetVideoFrom();
            this.open = true;
            this.callback = callback;
+            this.classifyList = classifyList;
        },
        handleCoverUrl(url){
          this.videoFrom.coverUrl = url;
        },
        resetVideoFrom(){
            this.videoFrom = {
-                cateId: null,
+                cateId: this.defaultClassify ? this.defaultClassify : null,
                coverUrl: null,
                title: null,
                description: null,
                tags: null,
-                payLevel: 0,
+                payLevel: this.defaultPayLevel ? parseInt(this.defaultPayLevel) : null,
                videoId: null,
                wxShow: false
            };
--- a/stdiet-ui/src/views/custom/customerCase/index.vue
+++ b/stdiet-ui/src/views/custom/customerCase/index.vue
@ -17,8 +17,7 @@
      </el-form-item>-->
      <el-form-item label="案例信息" prop="name">
        <el-select
-          v-model="keywordArray"
-          multiple
+          v-model="queryParams.keyword"
          filterable
          allow-create
          clearable
@ -150,12 +149,22 @@
          ></AutoHideMessage>
        </template>
      </el-table-column>
-      <el-table-column label="所属客户" align="center" prop="customerName" />
+      <el-table-column label="所属客户" align="center" prop="customerName">
+          <template slot-scope="scope">
+              <el-button
+            size="normal"
+            type="text"
+            @click="handleOnHealthSignClick(scope.row.customerId)"
+            title="点击查看用户详情"
+            >{{scope.row.customerName}}</el-button
+          >
+          </template>
+      </el-table-column>
      
      <el-table-column label="文件" align="center">
        <template slot-scope="scope">
          <el-button
-            size="mini"
+            size="normal"
            type="text"
            @click="getFileListByCaseId(scope.row)"
            >文件列表
@ -323,6 +332,9 @@
      @dealCustomerId="dealCustomerId"
      ref="selectCustomerRef"
    ></SelectCustomer>
+
+     <!-- 健康评估弹窗 -->
+    <PhysicalSignsDialog ref="physicalSignsDialogRef" />
  </div>
 </template>

@ -337,13 +349,16 @@ import {
  getFileListByCaseId,
  updateWxShow
 } from "@/api/custom/customerCase";
+import {
+  getCustomer
+} from "@/api/custom/customer";
 import DragUpload from "@/components/FileUpload/DragUpload";
 import DragUploadEdit from "@/components/FileUpload/DragUploadEdit";
 import SelectCustomer from "@/components/Customer/SelectCustomer";
 import MuchFileDown from "@/components/FileDownload/MuchFileDown";
 import AutoHideMessage from "@/components/AutoHideMessage";
 import AutoHideInfo from "@/components/AutoHideInfo";
-
+import PhysicalSignsDialog from "@/components/PhysicalSignsDialog";
 export default {
  name: "CustomerCase",
  data() {
@ -398,6 +413,7 @@ export default {
    AutoHideMessage: AutoHideMessage,
    AutoHideInfo: AutoHideInfo,
    DragUploadEdit: DragUploadEdit,
+    PhysicalSignsDialog
  },
  created() {
    this.getList();
@ -409,7 +425,7 @@ export default {
    /** 查询客户案例管理列表 */
    getList() {
      this.loading = true;
-      this.queryParams.keyword = this.keywordArray.join(",");
+      //this.queryParams.keyword = this.keywordArray.join(",");
      listCustomerCase(this.queryParams).then((response) => {
        this.customerCaseList = response.rows;
        this.total = response.total;
@ -425,6 +441,14 @@ export default {
        this.$refs["editUploadCaseFile"].uploadReset();
      this.reset();
    },
+    handleOnHealthSignClick(id) {
+      getCustomer(id).then((response) => {
+        if(response.code == 200){
+            this.$refs["physicalSignsDialogRef"].showDialog(response.data);
+        }
+      });
+      
+    },
    // 表单重置
    reset() {
      this.form = {
--- a/stdiet-ui/src/views/custom/nutritionQuestion/index.vue
+++ b/stdiet-ui/src/views/custom/nutritionQuestion/index.vue
@ -3,7 +3,7 @@
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="关键词" prop="title">
        <el-input
-          v-model="queryParams.key"
+          v-model.trim="queryParams.key"
          placeholder="请输入关键词"
          clearable
          size="small"
@ -62,6 +62,7 @@
        <el-button
          type="primary"
          size="mini"
+          icon="el-icon-question"
          @click="handleAskQuestion"
          v-hasPermi="['custom:askQuestion:list']"
        >问题解答</el-button>
--- a/stdiet-ui/src/views/custom/nutritionalVideo/index.vue
+++ b/stdiet-ui/src/views/custom/nutritionalVideo/index.vue
@ -3,7 +3,7 @@
    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
      <el-form-item label="关键词" prop="key">
        <el-input
-          v-model="queryParams.key"
+          v-model.trim="queryParams.key"
          placeholder="请输入关键词"
          clearable
          size="small"
@ -76,6 +76,15 @@
          v-hasPermi="['custom:nutritionalVideo:remove']"
        >删除</el-button>
      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          size="mini"
+          icon="el-icon-menu"
+          @click="handleVideoClassify"
+          v-hasPermi="['custom:videoClassify:list']"
+        >视频分类管理</el-button>
+      </el-col>
      <!--
      <el-col :span="1.5">
        <el-button
@ -101,8 +110,16 @@
          </el-image>
        </template>
      </el-table-column>
-      <el-table-column label="标题" align="center" prop="title" width="200"/>
-      <el-table-column label="描述" align="center" prop="description" />
+      <el-table-column label="标题" align="center" prop="title" width="200">
+        <template slot-scope="scope" >
+            <AutoHideMessage :data="scope.row.title == null ? '' : (scope.row.title+'')" :maxLength="20"></AutoHideMessage>
+        </template>
+      </el-table-column>
+      <el-table-column label="描述" align="center" prop="description" >
+        <template slot-scope="scope" >
+            <AutoHideMessage :data="scope.row.description == null ? '' : (scope.row.description+'')" :maxLength="100"></AutoHideMessage>
+        </template>
+      </el-table-column>
      <!--<el-table-column label="标签" align="center" prop="tags" width="100"/>-->
       <el-table-column label="分类" align="center" prop="cateName" width="100"/>
       <el-table-column label="权限等级" align="center" prop="payLevelName" width="100"/>
@ -119,6 +136,13 @@
      </el-table-column>
      <el-table-column label="操作" align="center" width="200">
        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="getVideoPlayUrl(scope.row.id)"
+            v-hasPermi="['custom:nutritionalVideo:query']"
+          >播放</el-button>
          <el-button
            size="mini"
            type="text"
@ -172,7 +196,7 @@
            />
        </el-form-item>
         <el-form-item label="视频封面" prop="coverUrl">
-              <UploadFile ref="uploadFile" :prefix="'videoCover'" :coverUrl="form.previewUrl" @callbackMethod="handleCoverUrl"></UploadFile>
+              <UploadFile ref="uploadFile" v-if="open" :prefix="'videoCover'" :coverUrl="form.previewUrl" @callbackMethod="handleCoverUrl" :tips="'视频未传封面图片时，会主动截取封面，但会存在延迟，请勿直接发布到小程序'"></UploadFile>
          </el-form-item>
        <el-form-item label="视频类别" prop="cateId">
            <el-select v-model="form.cateId" clearable filterable placeholder="请选择类别">
@ -200,7 +224,7 @@
                active-text="小程序展示"
                inactive-text="小程序不展示">
              </el-switch>
-              <div>提示：请保证内容正确再展示到小程序</div>
+              <div style="color:red">提示：请保证内容正确再展示到小程序</div>
          </el-form-item>    
      </el-form>
     
@ -211,14 +235,21 @@
    </el-dialog>

    <UploadVideo ref="uploadVideoRef"></UploadVideo>
+
+    <!-- 视频分类管理 -->
+    <el-dialog title="视频分类列表" :visible.sync="videoClassifyOpen" width="800px" append-to-body @closed="getAllVideoClassify();">
+      <VideoClassify ref="videoClassifyRef"></VideoClassify>
+    </el-dialog>
  </div>
 </template>

 <script>
-  import { listNutritionalVideo, getNutritionalVideo, delNutritionalVideo, addNutritionalVideo, updateNutritionalVideo, exportNutritionalVideo, updateWxShow } from "@/api/custom/nutritionalVideo";
+  import { listNutritionalVideo, getNutritionalVideo, delNutritionalVideo, addNutritionalVideo, updateNutritionalVideo, exportNutritionalVideo, updateWxShow,getVideoPlayUrlById } from "@/api/custom/nutritionalVideo";
  import {getAllClassify } from "@/api/custom/videoClassify";
  import UploadVideo from "@/components/UploadVideo";
  import UploadFile from "@/components/FileUpload/UploadFile";
+  import VideoClassify from "../videoClassify";
+  import AutoHideMessage from "@/components/AutoHideMessage";
  export default {
    name: "NutritionalVideo",
    data() {
@ -254,27 +285,35 @@
        form: {},
        // 表单校验
        rules: {
+          title: [
+            { required: true, message: "标题不能为空", trigger: "blur" },
+          ],
+          cateId:[
+            { required: true, message: "视频类别不能为空", trigger: "blur" },
+          ],
+          payLevel:[
+            { required: true, message: "视频权限不能为空", trigger: "blur" },
+          ]
        },
        coverImageList:[],
        //分类列表
        classifyList:[],
        //权限等级列表
-        payVideoLevelList:[]
+        payVideoLevelList:[],
+        //视频分类弹窗显示标识
+        videoClassifyOpen:false
+
      };
    },
    created() {
      this.getList();
-      getAllClassify().then(response => {
-          if(response.code == 200){
-              this.classifyList = response.data;
-          }
-      });
+      this.getAllVideoClassify();
      this.getDicts("video_pay_level").then((response) => {
        this.payVideoLevelList = response.data;
      });
    },
    components: {
-      UploadVideo,UploadFile
+      UploadVideo,UploadFile,VideoClassify,AutoHideMessage
    },
    methods: {
      /** 查询营养视频列表 */
@ -289,6 +328,14 @@
          this.loading = false;
      });
      },
+      //获取所有分类
+      getAllVideoClassify(){
+        getAllClassify().then(response => {
+          if(response.code == 200){
+            this.classifyList = response.data;
+          }
+        });
+      },
      // 取消按钮
      cancel() {
        this.open = false;
@ -326,10 +373,13 @@
        this.multiple = !selection.length
      },
      clickUploadVideo(){
-        this.$refs.uploadVideoRef.showDialog(()=>{
+        this.$refs.uploadVideoRef.showDialog(this.classifyList, ()=>{
         this.getList();
        });
      },
+      handleVideoClassify(){
+        this.videoClassifyOpen = true;
+      },
      /** 新增按钮操作 */
      handleAdd() {
        this.reset();
@ -347,6 +397,15 @@
          this.title = "修改营养视频";
        });
      },
+      //获取播放地址
+      getVideoPlayUrl(id){
+        getVideoPlayUrlById(id).then(response => {
+           let url = response.data.playUrl;
+           if(url != undefined && url != null){
+                window.open(url, '_blank');
+           }
+        });
+      },
      /** 提交按钮 */
      submitForm() {
        this.$refs["form"].validate(valid => {
@ -381,6 +440,7 @@
      },
      handleCoverUrl(url){
        this.form.coverUrl = url;
+        console.log(this.form.coverUrl);
      },
      /** 删除按钮操作 */
      handleDelete(row) {
--- a/stdiet-ui/src/views/custom/videoClassify/index.vue
+++ b/stdiet-ui/src/views/custom/videoClassify/index.vue
@ -0,0 +1,275 @@
+<template>
+  <div class="app-container">
+    <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+      <!--<el-form-item label="分类名称" prop="cateName">
+        <el-input
+          v-model="queryParams.cateName"
+          placeholder="请输入分类名称"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item label="类型标识，0全部可看 1客户可看 2额外付费观看" prop="payFlag">
+        <el-input
+          v-model="queryParams.payFlag"
+          placeholder="请输入类型标识，0全部可看 1客户可看 2额外付费观看"
+          clearable
+          size="small"
+          @keyup.enter.native="handleQuery"
+        />
+      </el-form-item>
+      <el-form-item>
+        <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+        <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+      </el-form-item>-->
+    </el-form>
+
+    <el-row :gutter="10" class="mb8">
+      <el-col :span="1.5">
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          size="mini"
+          @click="handleAdd"
+          v-hasPermi="['custom:videoClassify:add']"
+        >新增</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="success"
+          icon="el-icon-edit"
+          size="mini"
+          :disabled="single"
+          @click="handleUpdate"
+          v-hasPermi="['custom:videoClassify:edit']"
+        >修改</el-button>
+      </el-col>
+      <el-col :span="1.5">
+        <el-button
+          type="danger"
+          icon="el-icon-delete"
+          size="mini"
+          :disabled="multiple"
+          @click="handleDelete"
+          v-hasPermi="['custom:videoClassify:remove']"
+        >删除</el-button>
+      </el-col>
+      <!--<el-col :span="1.5">
+        <el-button
+          type="warning"
+          icon="el-icon-download"
+          size="mini"
+          @click="handleExport"
+          v-hasPermi="['custom:videoClassify:export']"
+        >导出</el-button>
+      </el-col>-->
+      <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+    </el-row>
+
+    <el-table v-loading="loading" :data="videoClassifyList" @selection-change="handleSelectionChange">
+      <el-table-column type="selection" width="55" align="center" />
+      <el-table-column label="分类名称" align="center" prop="cateName" />
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
+        <template slot-scope="scope">
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-edit"
+            @click="handleUpdate(scope.row)"
+            v-hasPermi="['custom:videoClassify:edit']"
+          >修改</el-button>
+          <el-button
+            size="mini"
+            type="text"
+            icon="el-icon-delete"
+            @click="handleDelete(scope.row)"
+            v-hasPermi="['custom:videoClassify:remove']"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination
+      v-show="total>0"
+      :total="total"
+      :page.sync="queryParams.pageNum"
+      :limit.sync="queryParams.pageSize"
+      @pagination="getList"
+    />
+
+    <!-- 添加或修改视频分类对话框 -->
+    <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
+      <el-form ref="form" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="分类名称" prop="cateName">
+          <el-input v-model.trim="form.cateName" placeholder="请输入分类名称" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="submitForm">确 定</el-button>
+        <el-button @click="cancel">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+  import { listVideoClassify, getVideoClassify, delVideoClassify, addVideoClassify, updateVideoClassify, exportVideoClassify } from "@/api/custom/videoClassify";
+
+  export default {
+    name: "VideoClassify",
+    data() {
+      return {
+        // 遮罩层
+        loading: true,
+        // 选中数组
+        ids: [],
+        // 非单个禁用
+        single: true,
+        // 非多个禁用
+        multiple: true,
+        // 显示搜索条件
+        showSearch: false,
+        // 总条数
+        total: 0,
+        // 视频分类表格数据
+        videoClassifyList: [],
+        // 弹出层标题
+        title: "",
+        // 是否显示弹出层
+        open: false,
+        // 查询参数
+        queryParams: {
+          pageNum: 1,
+          pageSize: 10,
+          cateName: null,
+          payFlag: null,
+        },
+        // 表单参数
+        form: {},
+        // 表单校验
+        rules: {
+           cateName: [
+            { required: true, message: "分类名称不能为空", trigger: "blur" },
+          ],
+        }
+      };
+    },
+    created() {
+      this.getList();
+    },
+    methods: {
+      /** 查询视频分类列表 */
+      getList() {
+        this.loading = true;
+        listVideoClassify(this.queryParams).then(response => {
+          this.videoClassifyList = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+      },
+      // 取消按钮
+      cancel() {
+        this.open = false;
+        this.reset();
+      },
+      // 表单重置
+      reset() {
+        this.form = {
+          id: null,
+          cateName: null,
+          payFlag: null,
+          createTime: null,
+          createBy: null,
+          updateTime: null,
+          updateBy: null,
+          delFlag: null
+        };
+        this.resetForm("form");
+      },
+      /** 搜索按钮操作 */
+      handleQuery() {
+        this.queryParams.pageNum = 1;
+        this.getList();
+      },
+      /** 重置按钮操作 */
+      resetQuery() {
+        this.resetForm("queryForm");
+        this.handleQuery();
+      },
+      // 多选框选中数据
+      handleSelectionChange(selection) {
+        this.ids = selection.map(item => item.id)
+        this.single = selection.length!==1
+        this.multiple = !selection.length
+      },
+      /** 新增按钮操作 */
+      handleAdd() {
+        this.reset();
+        this.open = true;
+        this.title = "添加视频分类";
+      },
+      /** 修改按钮操作 */
+      handleUpdate(row) {
+        this.reset();
+        const id = row.id || this.ids
+        getVideoClassify(id).then(response => {
+          this.form = response.data;
+        this.open = true;
+        this.title = "修改视频分类";
+      });
+      },
+      /** 提交按钮 */
+      submitForm() {
+        this.$refs["form"].validate(valid => {
+          if (valid) {
+            if (this.form.id != null) {
+              updateVideoClassify(this.form).then(response => {
+                if (response.code === 200) {
+                this.msgSuccess("修改成功");
+                this.open = false;
+                this.getList();
+              }
+            });
+            } else {
+              addVideoClassify(this.form).then(response => {
+                if (response.code === 200) {
+                this.msgSuccess("新增成功");
+                this.open = false;
+                this.getList();
+              }
+            });
+            }
+          }
+        });
+      },
+      /** 删除按钮操作 */
+      handleDelete(row) {
+        const ids = row.id || this.ids;
+        this.$confirm('是否确认删除视频分类编号为"' + ids + '"的数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return delVideoClassify(ids);
+        }).then(() => {
+          this.getList();
+        this.msgSuccess("删除成功");
+      }).catch(function() {});
+      },
+      /** 导出按钮操作 */
+      handleExport() {
+        const queryParams = this.queryParams;
+        this.$confirm('是否确认导出所有视频分类数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return exportVideoClassify(queryParams);
+        }).then(response => {
+          this.download(response.msg);
+      }).catch(function() {});
+      }
+    }
+  };
+</script>