diff --git a/test_client/src/api/cms.js b/test_client/src/api/cms.js
index 6eb2270..00bc34f 100644
--- a/test_client/src/api/cms.js
+++ b/test_client/src/api/cms.js
@@ -1,9 +1,10 @@
 import request from '@/utils/request'
 
-export function getArticleList() {
+export function getArticleList(query) {
   return request({
     url: '/cms/article/',
     method: 'get',
+    params:query
   })
 }
 export function createArticle(data) {
@@ -39,10 +40,11 @@ export function topArticle(id) {
   })
 }
 
-export function getMaterialList() {
+export function getMaterialList(query) {
   return request({
     url: '/cms/material/',
     method: 'get',
+    params:query
   })
 }
 export function createMaterial(data) {
diff --git a/test_client/src/views/material/material.vue b/test_client/src/views/material/material.vue
index 9bfba8c..11b8e64 100644
--- a/test_client/src/views/material/material.vue
+++ b/test_client/src/views/material/material.vue
@@ -1,54 +1,58 @@
 <template>
   <div class="app-container">
-        <div>
-          <el-input
-            v-model="listQuery.search"
-            placeholder="名称/描述"
-            style="width: 300px;"
-            class="filter-item"
-            @keyup.enter.native="handleFilter"
-          />
-          <el-button
-            class="filter-item"
+    <div>
+      <el-input
+        v-model="listQuery.search"
+        placeholder="名称/描述"
+        style="width: 300px;"
+        class="filter-item"
+        @keyup.enter.native="handleFilter"
+      />
+      <el-button class="filter-item" type="primary" icon="el-icon-search" @click="handleFilter">搜索</el-button>
+      <el-button
+        class="filter-item"
+        style="margin-left: 10px;"
+        type="primary"
+        icon="el-icon-refresh-left"
+        @click="resetFilter"
+      >刷新重置</el-button>
+    </div>
+    <div style="margin-top:6px">
+      <el-button type="primary" icon="el-icon-plus" @click="handleCreate('文档')">文档</el-button>
+      <el-button type="primary" icon="el-icon-plus" @click="handleCreate('视频')">视频</el-button>
+    </div>
+    <el-table
+      v-loading="listLoading"
+      :data="materialList.results"
+      style="width: 100%;margin-top:10px;"
+      border
+      fit
+      stripe
+      highlight-current-row
+      max-height="600"
+    >
+      <el-table-column type="index" width="50" />
+      <el-table-column label="名称">
+        <template slot-scope="scope">
+          <el-link
             type="primary"
-            icon="el-icon-search"
-            @click="handleFilter"
-          >搜索</el-button>
-          <el-button
-            class="filter-item"
-            style="margin-left: 10px;"
-            type="primary"
-            icon="el-icon-refresh-left"
-            @click="resetFilter"
-          >刷新重置</el-button>
-        </div>
-        <div style="margin-top:6px">
-        <el-button type="primary" icon="el-icon-plus" @click="handleCreate">新增</el-button>
-        </div>
-        <el-table
-          v-loading="listLoading"
-          :data="materialList.results"
-          style="width: 100%;margin-top:10px;"
-          border
-          fit
-          stripe
-          highlight-current-row
-          max-height="600"
-        >
-          <el-table-column type="index" width="50" />
-          <el-table-column label="名称">
-            <template slot-scope="scope">
-                <el-link type="primary" :href="scope.row.path" target="_blank" v-if="scope.row.path">{{ scope.row.name }}</el-link>
-                <span v-else>{{ scope.row.name }}</span>
-            </template>
-          </el-table-column>
-          <el-table-column align="header-center" label="上传时间">
-            <template slot-scope="scope">{{ scope.row.create_time }}</template>
-          </el-table-column>
-          <el-table-column align="header-center" label="下载量">
-            <template slot-scope="scope">{{ scope.row.down_count }}</template>
-          </el-table-column>
-                <el-table-column label="操作">
+            :href="scope.row.path"
+            target="_blank"
+            v-if="scope.row.path"
+          >{{ scope.row.name }}</el-link>
+          <span v-else>{{ scope.row.name }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column align="header-center" label="类型">
+        <template slot-scope="scope">{{ scope.row.type }}</template>
+      </el-table-column>
+      <el-table-column align="header-center" label="上传时间">
+        <template slot-scope="scope">{{ scope.row.create_time }}</template>
+      </el-table-column>
+      <el-table-column align="header-center" label="下载量/播放量">
+        <template slot-scope="scope">{{ scope.row.down_count }}</template>
+      </el-table-column>
+      <el-table-column label="操作">
         <template slot-scope="scope">
           <el-button
             type="primary"
@@ -66,15 +70,19 @@
           />
         </template>
       </el-table-column>
-        </el-table>
-        <pagination
-          v-show="materialList.count>0"
-          :total="materialList.count"
-          :page.sync="listQuery.page"
-          :limit.sync="listQuery.limit"
-          @pagination="getList"
-        />
-    <el-dialog :visible.sync="dialogVisible" :title="dialogType==='update'?'编辑':'新增'" :close-on-click-modal="false">
+    </el-table>
+    <pagination
+      v-show="materialList.count>0"
+      :total="materialList.count"
+      :page.sync="listQuery.page"
+      :limit.sync="listQuery.limit"
+      @pagination="getList"
+    />
+    <el-dialog
+      :visible.sync="dialogVisible"
+      :title="dialogType==='update'?'编辑':'新增'"
+      :close-on-click-modal="false"
+    >
       <el-form
         ref="Form"
         :model="material"
@@ -88,22 +96,64 @@
         <el-form-item label="描述" prop="description">
           <el-input v-model="material.description" placeholder="描述" />
         </el-form-item>
-        <el-form-item label="文件" prop="path">
+        <el-form-item label="封面" prop="poster" v-if="material.type=='视频'">
           <el-upload
-  
-  :on-preview="handlePreview"
-  :on-success="handleSuccess"
-  :action="upUrl"
-  :headers="upHeaders"
-  :limit="1"
-  :file-list="fileList"
-  >
-  <el-button size="small" type="primary" >点击上传</el-button>
-  
-</el-upload>
+            accept=".png, .jpeg, .jpg"
+            :before-upload="beforeUploadP"
+            :action="upUrl"
+            :headers="upHeaders"
+            :on-success="handleSuccessP"
+            :show-file-list="false"
+            class="avatar-uploader"
+          >
+            <img v-if="material.poster" :src="material.poster" class="avatar" />
+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+          </el-upload>
+        </el-form-item>
+        <el-form-item :label="material.type=='文档'?'文件':'视频'" prop="path">
+          <el-upload
+            v-if="material.type=='文档'"
+            :on-preview="handlePreview"
+            :on-success="handleSuccess"
+            :action="upUrl"
+            :headers="upHeaders"
+            :limit="1"
+            :file-list="fileList"
+            accept=".pdf, .doc, .docx"
+          >
+            <el-button size="small" type="primary">点击上传</el-button>
+          </el-upload>
+          <el-upload
+            v-else
+            class="avatar-uploader"
+            :action="upUrl"
+            :headers="upHeaders"
+            :show-file-list="false"
+            :on-success="handleSuccessV"
+            :before-upload="beforeUploadV"
+            :on-progress="upVideoProgess"
+            accept=".mp4, .m3u8"
+          >
+            <video
+              v-if="material.path"
+              :src="material.path"
+              class="avatar"
+              controls="controls"
+            >您的浏览器不支持视频播放</video>
+            <i
+              v-else
+              class="el-icon-plus avatar-uploader-icon"
+            ></i>
+            <el-progress
+              v-if="videoFlag == true"
+              :percentage="upVideoPercent"
+              style="margin-top:30px;"
+            ></el-progress>
+          </el-upload>
+          <div >请保证视频格式正确，且不超过100M</div>
         </el-form-item>
       </el-form>
-      
+
       <div style="text-align:right;">
         <el-button type="danger" @click="dialogVisible=false">取消</el-button>
         <el-button type="primary" @click="confirm('Form')">确认</el-button>
@@ -111,38 +161,71 @@
     </el-dialog>
   </div>
 </template>
-<script>
-import { getMaterialList, createMaterial, updateMaterial, deleteMaterial } from "@/api/cms"
-import { upUrl, upHeaders} from "@/api/file"
-import Pagination from "@/components/Pagination"
-import checkPermission from '@/utils/permission'
-const defaultmaterial = {
-  id:null,
-  name:null,
-  description:null,
-  path:null,
-  type:'文档'
+<style>
+.avatar-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 6px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
 }
+.avatar-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 360px;
+  height: 200px;
+  line-height: 200px;
+  text-align: center;
+}
+.avatar {
+  width: 360px;
+  height: 200px;
+  display: block;
+}
+</style>
+<script>
+import {
+  getMaterialList,
+  createMaterial,
+  updateMaterial,
+  deleteMaterial,
+} from "@/api/cms";
+import { upUrl, upHeaders } from "@/api/file";
+import Pagination from "@/components/Pagination";
+import checkPermission from "@/utils/permission";
+const defaultmaterial = {
+  id: null,
+  name: null,
+  description: null,
+  path: null,
+  poster: null,
+  type: "文档",
+};
 export default {
   components: { Pagination },
   data() {
     return {
       upHeaders: upHeaders(),
       upUrl: upUrl(),
-      materialList: {count:0},
-      material:Object.assign({}, defaultmaterial),
+      materialList: { count: 0 },
+      material: Object.assign({}, defaultmaterial),
       listLoading: true,
       listQuery: {
         page: 1,
-        limit: 20
+        limit: 20,
       },
-      dialogVisible:false,
-      dialogType:'create',
-      rule1:{
+      dialogVisible: false,
+      dialogType: "create",
+      rule1: {
         name: [{ required: true, message: "请输入姓名", trigger: "blur" }],
-        path: [{ required: true, message: "请上传文件", trigger: "blur" }]
+        path: [{ required: true, message: "请上传文件", trigger: "blur" }],
       },
-      fileList:[]
+      fileList: [],
+      videoFlag:false,
+      upVideoPercent:0
     };
   },
   created() {
@@ -152,9 +235,9 @@ export default {
     checkPermission,
     getList() {
       this.listLoading = true;
-      getMaterialList(this.listQuery).then(response => {
+      getMaterialList(this.listQuery).then((response) => {
         if (response.data) {
-          this.materialList = response.data
+          this.materialList = response.data;
         }
         this.listLoading = false;
       });
@@ -162,7 +245,7 @@ export default {
     resetFilter() {
       this.listQuery = {
         page: 1,
-        limit: 20
+        limit: 20,
       };
       this.getList();
     },
@@ -171,13 +254,14 @@ export default {
       this.getList();
     },
     handleDelete(scope) {
-        deleteMaterial(scope.row.id).then(res=>{
-            this.getList()
-        })
+      deleteMaterial(scope.row.id).then((res) => {
+        this.getList();
+      });
     },
-    handleCreate() {
+    handleCreate(val) {
       this.material = Object.assign({}, defaultmaterial);
-      this.fileList = []
+      this.material.type = val;
+      this.fileList = [];
       this.dialogType = "create";
       this.dialogVisible = true;
       this.$nextTick(() => {
@@ -185,63 +269,95 @@ export default {
       });
     },
     handleUpdate(scope) {
-      this.material = Object.assign({}, scope.row) // copy obj
-      if(this.material.path){
-        this.fileList=[{
-          name:this.material.name + '.' + this.material.path.split('.')[this.material.path.split('.').length - 1],
-          url:this.material.path
-        }]
+      this.material = Object.assign({}, scope.row); // copy obj
+      if (this.material.path) {
+        this.fileList = [
+          {
+            name:
+              this.material.name +
+              "." +
+              this.material.path.split(".")[
+                this.material.path.split(".").length - 1
+              ],
+            url: this.material.path,
+          },
+        ];
       }
-      this.dialogType = 'update'
-      this.dialogVisible = true
+      this.dialogType = "update";
+      this.dialogVisible = true;
       this.$nextTick(() => {
-        this.$refs['Form'].clearValidate()
-      })
+        this.$refs["Form"].clearValidate();
+      });
     },
     handlePreview(file) {
-      if ('url' in file){
-        window.open(file.url)
-      }else{
-        window.open(file.response.data.path)
+      if ("url" in file) {
+        window.open(file.url);
+      } else {
+        window.open(file.response.data.path);
       }
-      
+    },
+    beforeUploadP(file) {
+      const isLt1M = file.size / 1024 / 1024 < 1;
+      if (!isLt1M) {
+        this.$message.error("上传封面大小不能超过 1MB!");
+      }
+      return isLt1M;
+    },
+    beforeUploadV(file) {
+      const isLt1M = file.size / 1024 / 1024 < 100;
+      if (!isLt1M) {
+        this.$message.error("上传视频大小不能超过 100MB!");
+      }
+      return isLt1M;
     },
     handleSuccess(response, file, fileList) {
-      this.material.path = response.data.path
+      this.material.path = response.data.path;
+    },
+    handleSuccessV(response, file, fileList) {
+      this.videoFlag = false
+      this.material.path = response.data.path;
+    },
+    handleSuccessP(response, file, fileList) {
+      this.material.poster = response.data.path;
+    },
+    upVideoProgess(event, file, fileList){
+    this.videoFlag = true;
+    this.upVideoPercent = file.percentage.toFixed(0);
     },
     async confirm(form) {
-      this.$refs[form].validate(valid => {
+      this.$refs[form].validate((valid) => {
         if (valid) {
           const isEdit = this.dialogType === "update";
           if (isEdit) {
-            updateMaterial(this.material.id, this.material).then(res => {
+            updateMaterial(this.material.id, this.material).then((res) => {
               if (res.code >= 200) {
                 this.getList();
-                this.dialogVisible = false
+                this.dialogVisible = false;
                 this.$notify({
                   title: "成功",
                   message: "编辑成功",
                   type: "success",
-                  duration: 2000
+                  duration: 2000,
                 });
               }
             });
           } else {
-            createMaterial(this.material).then(res => {
+            createMaterial(this.material)
+              .then((res) => {
                 this.getList();
-                this.dialogVisible = false
+                this.dialogVisible = false;
                 this.$notify({
                   title: "成功",
                   type: "success",
-                })
-              
-            }).catch(error=>{})
+                });
+              })
+              .catch((error) => {});
           }
         } else {
           return false;
         }
       });
-    }
-  }
+    },
+  },
 };
 </script>
diff --git a/test_client/src/views/news/newscreate.vue b/test_client/src/views/news/newscreate.vue
index 8f0c852..4feeeb8 100644
--- a/test_client/src/views/news/newscreate.vue
+++ b/test_client/src/views/news/newscreate.vue
@@ -9,16 +9,16 @@
       status-icon
     >
       <el-form-item label="标题" prop="title">
-    <el-input v-model="Form.title" style="width: 500"></el-input>
+    <el-input v-model="Form.title" style="width: 80%"></el-input>
   </el-form-item>
   <el-form-item label="来源" prop="ifrom">
-    <el-input v-model="Form.ifrom" style="width: 500"></el-input>
+    <el-input v-model="Form.ifrom" style="width: 80%"></el-input>
   </el-form-item>
   <el-form-item label="外部链接" prop="elink" >
-    <el-input v-model="Form.elink" style="width: 500"></el-input>
+    <el-input v-model="Form.elink" style="width: 80%"></el-input>
   </el-form-item>
   <el-form-item label="内容" prop="content" v-show="is_show">
-      <tinymce v-model="Form.content" :height="400" :width="600"/>
+      <tinymce v-model="Form.content" :height="400" width="80%"/>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="submitForm('Form')" :loading="submitLoding">立即创建</el-button>
diff --git a/test_client/src/views/news/newsupdate.vue b/test_client/src/views/news/newsupdate.vue
index 8347395..9864eb0 100644
--- a/test_client/src/views/news/newsupdate.vue
+++ b/test_client/src/views/news/newsupdate.vue
@@ -9,16 +9,16 @@
       status-icon
     >
       <el-form-item label="标题" prop="title">
-    <el-input v-model="Form.title" style="width: 500"></el-input>
+    <el-input v-model="Form.title" style="width: 80%"></el-input>
   </el-form-item>
   <el-form-item label="来源" prop="ifrom">
-    <el-input v-model="Form.ifrom" style="width: 500"></el-input>
+    <el-input v-model="Form.ifrom" style="width: 80%"></el-input>
   </el-form-item>
   <el-form-item label="外部链接" prop="elink" >
-    <el-input v-model="Form.elink" style="width: 500"></el-input>
+    <el-input v-model="Form.elink" style="width: 80%"></el-input>
   </el-form-item>
   <el-form-item label="内容" prop="content" v-show="is_show">
-      <tinymce v-model="Form.content" :height="400" :width="600"/>
+      <tinymce v-model="Form.content" :height="400" width="80%"/>
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="submitForm('Form')" :loading="submitLoding">保存</el-button>