发布文章bug修改

src/api/act/submitinfo.js

     })
 }
 
+export function getEditVidoInfo(id,param){
+    console.log("params是啥?",param)
+    return request({
+        url:"/api/acticle/getEditVidoInfo?id="+id,
+        method:"Get",
+        param:param,
+    })
+}
+
 export function getMenus(params){
-    console.log("params是什么",params)
+    console.log("params分类号是什么",params)
     return request({
         url:"/api/acticle/getMenus",
         method:'Get',
    })
 }
 
+export function updataVidoInfo(id,data){
+    console.log("修改视频内容",data)
+    return request({
+        url:"/api/acticle/updateVidoInfo?id="+id,
+        method:'Post',
+        data:data
+    })
+}
+
+export function SaveVidodraft(id,data){
+    console.log("保存视频草稿",data);
+    return request({
+        url:"/api/acticle/savevidodraft?id="+id,
+        method:'Post',
+        data:data
+    })
+}
+
+export function saveArticleDraft(id,data){
+    console.log("保存文章草稿",data);
+    return request({
+        url:"/api/acticle/saveArticleDraft?id="+id,
+        method:"Post",
+        data:data
+    })
+}
+
 export function previewEditArticle(id,data){
    return request({
        url:"/api/acticle/previewEditArticle?id="+id,
       method:"delete",
       data:data, 
    })
-}
+}
+

src/lang/zh.js

     editArticle: '编辑文章',
     articleList: '文章列表',
     articlePreview:'文章预览',
+    editVido:'编辑视频',
     errorPages: '错误页面',
     page401: '401',
     page404: '404',

src/router/modules/article.js

       hidden:true,
       meta: { title: 'editArticle', noCache: true }
     },
+    {
+      path: '/articles/editVido/:id',
+      component:() => import('@/scrm_pages/article/editVido'),
+      name:'editVido',
+      hidden:true,
+      meta: { title:'editVido',noCache: true}
+    },
     {
       path: '/articles/articleEditPreview',
       component: () => import('@/scrm_pages/article/articleEditPreview'),

src/scrm_pages/article/acticleCategory.vue

       return{
         crumbs: [
           { path: false, name: '文章管理' },
-          { path: '/articles/acticleCategory', name: '发布文章' }
+          { path: '/articles/acticleCategory', name: '文章分类' }
         ],
         articsData:[],
         articData:{

src/scrm_pages/article/articleCommentDetail.vue

                             <el-button type="primary" @click="send(item)">发送</el-button>
                        </div>
                 </div>
-                 <div class="reviewed" v-show="showReply==item.id" v-for="(child) in item.childs" :key="child.id">
+                 <div class="reviewed" v-show="showReply===item.id" v-for="(child) in item.childs" :key="child.id">
                      <div>
                      你&nbsp;回复了&nbsp;{{item.comment_user_name}}:{{child.content}}
                      <div  id="tub" class="el-icon-error" @click="clear(item.id,index)"></div>
                      </div>
                 </div>
                  <div>
-                  <div class="reviewed2" v-show="shows==item.id" v-for="(items,index) in commentsReplyInfo" :key="items.id">
+                  <div class="reviewed2" v-show="shows===item.id" v-for="(items,index) in commentsReplyInfo" :key="items.id">
                      <div>
                      你&nbsp;回复了&nbsp;{{items.comment_user_name}}:{{items.content}}
                      <div  id="tub" class="el-icon-error" @click="clear(items.id,index)"></div>
                 },
                 total:0,
                 comments:[],
-                show:true,
                 showindex:-1,
                 form:{
                   replycontent:'',  
           } 
             if(spancontent == "收起"){
               document.getElementById("copy").innerHTML = "展开";
-              this.shows = 0;              
+              this.shows = !parentid;       
           } 
            const articid = this.$route.params && this.$route.params.id;
           console.log("文章id",articid);   

src/scrm_pages/article/articleList.vue

           </div>
 
             <div class="filter-container" style="margin-top: 10px;margin-left: 5px">
-              <el-checkbox style="width: 30px">全选</el-checkbox> 
+              <el-checkbox style="width: 30px">全选</el-checkbox>
               <el-button size="small" icon="el-icon-delete">批量删除</el-button>
-            </div> 
-           <!-- <div class="filter-container" style="margin-top: 10px;margin-left: 5px">
-            <el-checkbox style="width: 30px" @change="changeCheck" v-model="checkAllStatus">全选</el-checkbox>
-            <el-button size="small" icon="el-icon-delete">批量删除</el-button>
-          </div> -->
-          <!-- <el-table ref="multipleTable" :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}" :data="articsData" border fit highlight-current-row  style="width: 100%;margin-top: 10px;"  @selection-change="handleSelectionChange">
-              <el-table-column
-                align="center"
-                type="selection"
-                width="55">
-              </el-table-column>
-             <el-table-column label="文章图片" align="center">
-               <template slot-scope="scope">
-                  <div class="parent">
-                 <span class="text">已发布</span>
-                 <div class="triangle-topleft">
+            </div>
+         
+      <div class="clearfix">
+        <div class="published-cell" v-for="(article,index) in articsData" :key="article.id">
+          <div class="checkbox">
+            <el-checkbox></el-checkbox>
+          </div>
 
-                 </div>
-                <img :src="memberAvatar(scope.row)" style="width:100%;height:100%">
+          <div class="activity-image-panel">
+            <span class="status-text">{{article.article_status ==1 ? '已发布':'' || article.article_status ==2 ? '草稿':'' || article.article_status ==3 ? '未通过':''}}</span>
+            <img :src="article.imgs"/>
           </div>
-               </template>
-             </el-table-column>
-            <el-table-column label="文章标题" align="center">
-              <template slot-scope="scope">
-                  {{scope.row.title}}
-              </template>
-            </el-table-column>
-            <el-table-column label="阅读量" align="center">
-              <template slot-scope="scope">
-                 {{scope.row.real_read_num}}
-              </template>
-            </el-table-column>
-            <el-table-column label="评论数" align="center">
-              <template slot-scope="scope">
-                  {{scope.row.comment_num}}
-              </template>
-            </el-table-column>
-            <el-table-column label="点赞数" align="center">
-              <template slot-scope="scope">
-                  {{scope.row.star_num}}
-              </template>
-            </el-table-column>
-            <el-table-column label="操作" align="center">
-              <template slot-scope="scope">
-                <el-tooltip class="item" effect="dark" content="编辑" placement="top">
-                  <el-button
-                    size="mini"
-                    type="primary"
-                    icon="el-icon-edit-outline"
-                    @click="$router.push('/articles/editArticle/'+scope.row.id)">
-                  </el-button>
-                </el-tooltip>
-                 <el-tooltip class="item" effect="dark" content="删除" placement="top">
-                  <el-button size="mini" type="danger" icon="el-icon-delete"  @click="openDelete(scope.row,scope.$index)" ></el-button>
-                </el-tooltip>
-              </template>
-            </el-table-column>
-          </el-table> -->
-          
-             <template v-for="(article,index) in articsData">
-               <published-cell v-if="article.status == 1" :article="article"  :key="index" @delete="deleteArticle(article.id, index)"></published-cell>
-               <published-cell v-if="article.status == 2" :article="article"  :key="index" @delete="deleteArticle(article.id, index)"></published-cell>
-               <published-cell v-if="article.status == 3" :article="article"  :key="index" @delete="deleteArticle(article.id, index)"></published-cell>
-             </template>
-         
+          <div class="activity-info-panel">
+            <h3 class="title">
+              <a>{{article.title}}</a>
+            </h3>
+            <div class="statistics">
+              阅读：{{article.real_read_num}} 丨 评论：{{article.comment_num}} 丨 点赞：{{article.star_num}}
+            </div>
+            <div>
+              <el-tooltip class="item" effect="dark" content="编辑" placement="top">
+                <el-button
+                  size="mini"
+                  type="primary"
+                  icon="el-icon-edit-outline"
+                  @click="editArticles(article.id,article.type)">
+                </el-button>
+              </el-tooltip>
+              <el-tooltip class="item" effect="dark" content="删除" placement="top">
+                <el-button
+                  size="mini"
+                  type="danger"
+                  icon="el-icon-delete"
+                  @click="deleteArticle(article.id,index)">
+                </el-button>
+              </el-tooltip>
+            </div>
+          </div>
+          <div class="activity-time-panel">
+            <span class="center">{{orgName}}</span>
+            <span class="time">2019-06-08</span>
+          </div>
+        </div>
+      </div>
+
+
           <el-pagination
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
         dialogVisible: false,
         checkAllStatus:false,
         selecting_status:'',
+        orgName:'',
+        statustext:'',
       }
     },
     methods:{
            GetAllArticles(){
               GetAllArticles(this.selecting_status,this.listQuery.classid,this.listQuery.keyword,this.listQuery.limit,this.listQuery.page).then(response=>{
                      if(response.data.state === 1){
-                        this.articsData = response.data.data.articles
-                        this.total = response.data.data.total
+                        this.articsData = response.data.data.articles;
+                        this.total = response.data.data.total;
                         console.log("文章列表",this.articsData)
                         console.log("total",this.total)
+                        this.orgName =  response.data.data.OrgName;
+                        console.log("机构姓名",this.orgName)
                      }
                      if(typeof(response.data.data.category != 'undefined')){
                        this.tagOptions = response.data.data.category
              this.selectedArticles = val;
          },
            deleteArticle(id,index){
+             
              this.$confirm('确定要删除吗?删除后信息将无法恢复!','删除提示',{
                dangerouslyUseHTMLString:true,
                 confirmButtonText: '确定',
               }).catch(e=>{});
              }).catch(() => {
                return false
-            });        
+            });
+           },
+           editArticles(articleid,articletype){
+               console.log("文章id",articleid);
+               console.log("文章内型",articletype)
+               if(articletype == 1){
+                  this.$router.push({path:'/articles/editArticle/'+articleid});
+               }
+
+               if(articletype ==2){
+                   this.$router.push({path:'/articles/editVido/'+articleid});
+               }
            }
-          // openDeletearticles(){
-          //   if (this.selectedArticles.length==0) {
-          //     this.$message.error("请选择要删除的信息");
-          //   return false;
-          //  }
-          //  this.$confirm('确定要删除吗?删除后信息将无法恢复!','删除提示',{
-          //      dangerouslyUseHTMLString:true,
-          //      confirmButtonText: '确定',
-          //      cancelButtonText: '取消',
-          //      type: 'warning'
-          //  }).then(()=>{
-          //       var ids = [];
-          //       var idMap = {};
-          //       for (const index in this.selectedArticles) {
-          //       ids.push(this.selectedArticles[index].id);
-          //       idMap[this.selectedArticles[index].id] = this.selectedArticles[index].id;
-          //   }
-          //      openDelete({ids:ids}).then(response=>{
-          //          if(response.data.state == 1){
-          //                var articsDatalength = this.articsData.length;
-          //            for (let index = articsDatalength-1; index >= 0; index--) {
-          //           if(this.articsData[index].id in idMap) {
-          //           this.articsData.splice(index, 1);
-          //          }
-          //        }
-          //         this.$message.success("删除成功");
-          //       }else{
-          //          this.$message.success("删除失败");
-          //        }
-          //      }).catch(e=>{});
-          //  }).catch(() => {
-          //     return false
-          //  });
-          // },
     },
     created(){
       this.GetAllArticles();
     },
+
+     
   }
 </script>
 
-<style scoped>
-      .parent{
+<style scoped  rel="stylesheet/scss" lang="scss">
+    .parent{
         position: relative;
         width: 160px;
         height: 120px;
         position: relative;
         margin-top: -140px;
     }
+
+    .published-cell {
+    padding: 20px 15px;
+    border: none;
+    border-bottom: 1px solid #e5e8ea;
+    float: left;
+    margin: 0;
+    width: 100%;
+    border-radius: 0;
+    position: relative;
+
+    .activity-image-panel {
+        width: 155px;
+        height: 122px;
+        border: 1px #dee2e5 solid;
+        display: flex;
+        justify-content: center;
+        position: relative;
+        -webkit-border-radius: 4px;
+        -moz-border-radius: 4px;
+        border-radius: 4px;
+        overflow: hidden;
+        float: left;
+
+        .status-text {
+            position: absolute;
+            font-size: 12px;
+            color: #fff;
+            top: 14px;
+            left: 3px;
+            -webkit-transform: rotate(316deg);
+            transform: rotate(316deg);
+        }
+
+        img {
+            width: 100%;
+            height: 100%;
+            object-fit: cover;
+            object-position: center;
+        }
+    }
+    .activity-image-panel::before {
+        border-top: 28px solid #5bd18b;
+        border-right: 28px solid transparent;
+        border-bottom: 28px solid transparent;
+        border-left: 28px solid #5bd18b;
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 0;
+        height: 0;
+        display: block;
+        content: "";
+    }
+
+    .activity-info-panel {
+        padding: 7px 20px;
+        width: 60%;
+        float: left;
+
+        .title {
+            padding-bottom: 5px;
+
+            a {
+                color: #495060;
+                font-size: 20px;
+                max-width: 100%;
+                font-weight: 500;
+                overflow: hidden;
+                white-space: nowrap;
+                text-overflow: ellipsis;
+                display: inline-block;
+            }
+        }
+
+        .statistics {
+            color: #a8b3ba;
+            font-size: 15px;
+            justify-content: space-between;
+            line-height: 30px;
+        }
+    }
+
+    .activity-time-panel {
+        float: right;
+        padding: 7px 0;
+
+        .time {
+            font-size: 15px;
+            color: #a8b3ba;
+        }
+    }
+    .center{
+        font-size:15px;
+        color: #a8b3ba;
+    }
+    .checkbox{
+        float:left;
+        position: relative;
+        left:-10px;
+    }
+}
+    
 </style>

src/scrm_pages/article/createArticle.vue

     <div class="app-container">
     <el-tabs type="border-card">
       <el-tab-pane label="文章">
-        <el-form label-width="100px" class="clearfix" :model="form" ref="arctileform"  :element-loading-text="loadingText" :rules="staffrules">
+        <el-form label-width="100px" class="clearfix" :model="form" ref="arctileform"  :element-loading-text="loadingText" :rules="artilcrules">
           <el-row>
             <el-col :span="23">
                 <el-form-item label="文章标题:" required prop="act_name">
                 <el-col :span="3">
                   <div>
                     <el-upload
-                      v-loading="uploading"
                       :element-loading-text="loadingText"
                       class="avatar-uploader"
                       :data="uploadData"
                     </el-upload>
                   </div>
                 </el-col>
+                <!-- 第二章图片 -->
                 <el-col :span="3">
-                  <div v-if="show">
+                  <div v-if="picshow">
                     <el-upload
-                      v-loading="uploading"
                       :element-loading-text="loadingText"
                       class="avatar-uploader"
                       :data="uploadData"
                       :on-error="handleAvatartwoError"
                       :on-success="handleAvatartwoSuccess"
                       :before-upload="beforeAvatartwoUpload">
-                      <img v-if="imageUrl" :src="imageUrl" class="avatar">
+                      <img v-if="this.imageUrl" :src="this.imageUrl" class="avatar">
                       <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                     </el-upload>
                   </div>
                 </el-col>
+
+                <!-- 第三张图片 -->
                 <el-col :span="3">
-                  <div v-if="show">
+                  <div v-if="picshow">
                     <el-upload
-                      v-loading="uploading"
                       :element-loading-text="loadingText"
                       class="avatar-uploader"
                       :data="uploadData"
         radio:'1',
         options: [],
         value: '',
-        show:false,
+        picshow:false,
         content: '',
         editorOption: {},
         company:"",
             vio_upload: [{required: true,message:"请上传视频"}],
             vid_type: [{required: true,message:"所属分类不能为空"}]
           },
+       
         artilcrules:{
             act_name: [{required: true, message: "文章标题不能为空"},],
             act_content: [{required: true,message:"文章内容不能为空"}],
     methods: {
       //第一个图片
       handleAvatarSuccess(res, file) {
-       this.form.org_logo = this.qiniuDomain + res.url;
-        this.uploading = false
+        this.form.org_logo = this.qiniuDomain + res.url;     
       },
        handleAvatarError(err, file, fileList) {
             this.$message.error(err);
-            this.uploading = false;
             return false
       },
       beforeAvatarUpload(file) {
             const _self = this
             return new Promise((resolve, reject) => {
                 getToken().then(response => {
-                    const token = response.data.data.uptoken
-                    console.log("token是什么?",token)
-                    _self._data.uploadData.token = token
-                    _self._data.uploadData.key = key
+                    const tokentree = response.data.data.uptoken
+                    console.log("token是什么?",tokentree)
+                    _self._data.uploadData.token = tokentree;
+                    _self._data.uploadData.key = key;
                     resolve(true)
                 }).catch(err => {
                     reject(false)
                 })
             })
       },
-      //监听图片获取前三张
+
+
+      //监听图片获取富文本前三张图片
        paragraphContentChanged: function(content) {
             var images = [],temp;
             console.log("监听获取的文章内容是什么?",content)
 
       //第二个图片
       handleAvatartwoSuccess(res, file) {
-        this.imageUrlSecond = URL.createObjectURL(file.raw);
-        this.form.org_logo = this.qiniuDomain + res.url;
-        this.uploading = false
+        this.imageUrl = this.qiniuDomain + res.url;
       },
        handleAvatartwoError(err, file, fileList) {
             this.$message.error(err);
             const _self = this
             return new Promise((resolve, reject) => {
                 getToken().then(response => {
-                    const token = response.data.data.uptoken
-                    console.log("token是什么?",token)
-                    _self._data.uploadData.token = token
-                    _self._data.uploadData.key = key
+                    const tokentwo = response.data.data.uptoken
+                    console.log("第二章图片的token是什么?",tokentwo)
+                    _self._data.uploadData.token = tokentwo;
+                    _self._data.uploadData.key = key;
                     resolve(true)
                 }).catch(err => {
                     reject(false)
 
       //第三张图片
       handleAvatarlastSuccess(res, file) {
-        this.imageUrlLast = URL.createObjectURL(file.raw);
-        this.form.org_logo = this.qiniuDomain + res.url;
-        this.uploading = false
+        // this.imageUrlLast = URL.createObjectURL(file.raw);
+        this.imageUrlLast = this.qiniuDomain + res.url;     
       },
        handleAvatarlastError(err, file, fileList) {
             this.$message.error(err);
         }
           const isLt2M = file.size / 1024 / 1024 < 1;
         if (!isLt2M) {
-          this.$message.error('上传视频大小不能超过 1M!');
+          this.$message.error('上传图片大小不能超过 1M!');
         }
             var date = new Date()
             var ext = getFileExtension(file.name)
             })
        },
       select(){
-        this.show = false
+        this.picshow = false
       },
       clickitem(){
-        this.show = true
+        this.picshow = true
       },
       handleRemove(file, fileList) {
         console.log(file, fileList);
         })
       },
       gotolink(){
-         this.$router.go(0);
+           this.centerDialogVisible = false;
+           this.form.act_name = "";
+           this.form.act_content = "";
+           this.form.act_picture = "";
       },
       gobacklist(){
         this.$router.push({path:'/articles/articleList'})

src/scrm_pages/article/editArticle.vue

                 <keep-alive>
                   <neditor ref="neditor"
                            id="editor"
-                           v-bind:r_content="form.content">
+                           v-bind:r_content="form.content"  @content_changed="paragraphContentChanged">
                   </neditor>
                 </keep-alive>
               </el-form-item>
                     </el-upload>
                   </div>
                 </el-col>
+              
+              <!-- 第二张图片 -->
                 <el-col :span="3">
-                  <div v-if="show">
+                  <div v-if="picshow">
                     <el-upload
                       v-loading="uploading"
                       :element-loading-text="loadingText"
                       :on-error="handleAvatartwoError"
                       :on-success="handleAvatartwoSuccess"
                       :before-upload="beforeAvatartwoUpload">
-                      <img v-if="imageUrlSecond" :src="imageUrlSecond" class="avatar">
+                      <img v-if="imageUrl" :src="imageUrl" class="avatar">
                       <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                     </el-upload>
                   </div>
                 </el-col>
+
+                <!-- 第三张图片 -->
                 <el-col :span="3">
-                  <div v-if="show">
+                  <div v-if="picshow">
                     <el-upload
                       v-loading="uploading"
                       :element-loading-text="loadingText"
             <el-col :span="24">
                 <el-form-item>
                       <el-button size="small" type="primary" style="width: 100px"  @click="UpdataArticleInfo('arctileform');">发布</el-button>
-                      <el-button size="small" style="width: 100px" @click="preview('arctileform')">预览</el-button>
-                      <el-button size="small" style="width: 100px" @click="save('arctileform');centerdraftVisible = false">保存草稿</el-button>
+                      <!-- <el-button size="small" style="width: 100px" @click="preview('arctileform')">预览</el-button> -->
+                      <el-button size="small" style="width: 100px" @click="saveArticleDraft('arctileform');centerdraftVisible = false">保存草稿</el-button>
                   <el-button size="small" style="width: 100px" @click="centercancelVisible = true">取消</el-button>
                 </el-form-item>
             </el-col>
            :visible.sync="dialogVisible"
             width="30%"
             center>
-           <span>这是一段信息</span>
+           <!-- <span>这是一段信息</span> -->
            <span slot="footer" class="dialog-footer">
            <el-button @click="gobackList()">返回文章列表</el-button>
            </span>
     import Neditor from '@/components/Neditor'
     import { getToken } from '@/api/qiniu'
     import { getFileExtension} from '@/utils/tools'
-    import {getEditArticle,getMenus,UpdataArticleInfo,previewEditArticle} from '@/api/act/submitinfo'
+    import {getEditArticle,getMenus,UpdataArticleInfo,previewEditArticle,saveArticleDraft} from '@/api/act/submitinfo'
     export default {
         name: "editArticle",
          components:{
           title:'',                 
           file:'',
         },
+         picshow:false,
          acttypes:[],
          imageUrl:'',
          imageUrlSecond:'',
          methods:{
              //第一个图片
       handleAvatarSuccess(res, file) {
-       this.form.org_logo = this.qiniuDomain + res.url;
-        this.uploading = false
+       this.form.imgs = this.qiniuDomain + res.url;      
       },
        handleAvatarError(err, file, fileList) {
             this.$message.error(err);
                     resolve(true)
                 }).catch(err => {
                     reject(false)
-                    this.uploading = false;
+                    
                 })
             })
       },
       //第二个图片
       handleAvatartwoSuccess(res, file) {
-        this.imageUrlSecond = URL.createObjectURL(file.raw);
-        this.form.org_logo = this.qiniuDomain + res.url;
-        this.uploading = false
+        this.imageUrl = this.qiniuDomain + res.url;    
       },
        handleAvatartwoError(err, file, fileList) {
             this.$message.error(err);
       },
 
       //第三张图片
-      handleAvatarlastSuccess(res, file) {
-        this.imageUrlLast = URL.createObjectURL(file.raw);
-        this.form.org_logo = this.qiniuDomain + res.url;
-        this.uploading = false
+      handleAvatarlastSuccess(res, file) {  
+        this.imageUrlLast = this.qiniuDomain + res.url;
+      
       },
        handleAvatarlastError(err, file, fileList) {
             this.$message.error(err);
         },
         
         UpdataArticleInfo(forName){
-              this.form.act_content = this.$refs.neditor.content;
+              this.form.content = this.$refs.neditor.content;
               const id = this.$route.params && this.$route.params.id;
-             console.log("文章内容",this.$refs.neditor.content);
+             console.log("发布文章内容",this.$refs.neditor.content);
              console.log("id是多少?",id)
              this.$refs[forName].validate((valid)=>{
                  if(valid){
                  }
              })
         },
+        saveArticleDraft(forName){
+          const id = this.$route.params && this.$route.params.id;
+           this.form.content = this.$refs.neditor.content;
+           console.log("id是多少?",id);
+           console.log("文章内容",this.$refs.neditor.content);
+           this.$refs[forName].validate((valid)=>{
+             if(valid){
+               saveArticleDraft(id,this.form).then(response=>{
+                  if(response.data.state ==1 ){
+                      this.dialogVisible = true;
+                  }
+               })
+             }
+           })
+        },
         gobackList(){
            this.$router.push({path:'/articles/articleList'})
         },
                  })
               }
             })
-        }
+        },
+        select(){
+        this.picshow = false
+        },
+       clickitem(){
+        this.picshow = true
+      },
+        //监听图片获取富文本前三张图片
+       paragraphContentChanged: function(content) {
+            var images = [],temp;
+            console.log("监听获取的文章内容是什么?",content)
+            var patt = /<img[^>]+src=['"]([^'"]+)['"]+/g;
+            while ((temp = patt.exec(content)) != null) {
+            images.push(temp[1]);
+            }                 
+             console.log("图片数组",images);
+             this.form.imgs = images[0];
+             this.imageUrl = images[1];
+             this.imageUrlLast = images [2];           
+        },
       },
       created(){
          const id = this.$route.params && this.$route.params.id;

src/scrm_pages/article/editVido.vue

+<template>
+    <div class="main-contain">
+       <div class="position">
+          <bread-crumb :crumbs='crumbs'></bread-crumb> 
+       </div>
+       <div class="app-container">
+           <el-form label-width="100px" class="clearfix"  :rules="rules" :model="form" ref="vidoform">
+           <el-row>
+             <el-col :span="24">
+                 <div style="margin-bottom: 100px">
+                   <el-form-item>
+                       <div class="video-select" v-if="show">
+                        <el-upload
+                            class="upload-demo"
+                            :data="uploadFileData"
+                            action="https://upload.qiniup.com"
+                            :on-change="handleChange"
+                            :on-success="handleSuccess"
+                            :on-error="handleError"
+                            :before-upload="beforeUploadFile"
+                             accept="video/x-flv,video/mpeg,video/avi,video/x-ms-wmv,video/quicktime,.asf,.rm,.rmvb,video/x-matroska,video/x-m4v,video/mp4">                         
+                             <el-button size="small" type="primary" v-if="show">点击上传</el-button>
+                             <div slot="tip" class="el-upload__tip" v-if="show">支持大多视频文件格式,大小不超过2G</div>
+                        </el-upload>
+                       </div>
+                         <div class="video" v-if="shows">
+                         <img v-if="form.vio_upload" :src="form.vio_upload+'?vframe/jpg/offset/1/w/300/h/200'" class="avatar" id="upvideo">
+                       </div>
+                        <div id="upvideo"></div>                  
+                    </el-form-item>
+                  </div>
+
+                 <el-form-item label="视频标题:" required prop="vid_name">
+                   <el-input v-model="form.vid_name"></el-input>
+                 </el-form-item>
+
+                 <el-form-item label="视频封面:">
+                   <el-upload  class="avatar-uploader" :show-file-list="false" 
+                   :on-success="handlevioSuccess" 
+                   :before-upload="beforevidoFile" 
+                   :on-change="handleChange"
+                   action="https://upload.qiniup.com"
+                   :data="uploadvidoData">
+                     <img v-if="form.vid_pic" :src="form.vid_pic" class="avatar">                  
+                     <img v-if="form.vio_upload" :src="form.vio_upload+'?vframe/jpg/offset/1/w/300/h/200'" class="avatar">
+                     <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+                   </el-upload>
+                 </el-form-item>
+                 <div class="eltip">
+                   视频封面若不上传，系统会根据视频内容进行自动截取<br>
+                   目前支持PNG和JPG格式，图片大小不能超过1MB
+                   </div>
+                  <el-form-item label="所属分类:" required prop="vid_type">
+                    <el-select v-model="form.vid_type">
+                      <el-option
+                          v-for="item in options"
+                          :key="item.id"
+                          :label="item.name"
+                          :value="item.id"> 
+                      </el-option>
+                      </el-select>
+                  </el-form-item>
+                   <el-row :span="24">
+                     <el-col :span="24">
+                       <el-form-item>
+                         <el-button size="small" type="primary" style="width: 100px" @click="SumitVido('vidoform');centerDialogVisible = false">发布</el-button>
+                         <el-button size="small" style="width: 100px" @click="Savedraft('vidoform');centerdraftVisible = false">保存草稿</el-button>
+                         <el-button size="small" style="width: 100px" @click="clear();centercancelVisible = true">取消</el-button>
+                       </el-form-item>
+                     </el-col>
+                   </el-row>                   
+             </el-col>
+           </el-row>
+        </el-form>
+
+          <el-dialog
+           title="发表成功"
+           :visible.sync="dialogVisible"
+            width="30%"
+            center>
+           <span>这是一段信息</span>
+           <span slot="footer" class="dialog-footer">
+           <el-button @click="gobackList()">返回文章列表</el-button>
+           </span>
+         </el-dialog>
+  
+       </div>
+    </div>
+</template>
+
+<script>
+    import BreadCrumb from '../components/bread-crumb'
+    import {getEditVidoInfo,getMenus,updataVidoInfo,SaveVidodraft} from '@/api/act/submitinfo'
+    import { getFileExtension} from '@/utils/tools'
+    import { getToken } from '@/api/qiniu'
+    export default {
+        name: "editVido",
+        components:{
+         BreadCrumb,
+      },
+      data(){
+         return{
+         crumbs: [
+           { path: false, name: '文章管理' },
+           { path: '/articles/articleList', name: '视频编辑' }
+          ],
+          form:{ 
+            file:'',
+            vid_pic:'',
+            vio_upload:'',
+            vid_name:'',
+            vid_type:'',
+          },
+          show:true,
+          shows:false,
+          dialogVisible:false,
+          options: [],
+          qiniuDomain: 'https://images.shengws.com/',
+          uploadFileData:{token:'',key:''},
+          uploadvidoData:{token:'',key:''},
+          rules: {
+            vid_name: [{required: true, message: "视频标题不能为空"},],
+            vid_type: [{required: true,message:"所属分类不能为空"}]
+          },
+         } 
+      },
+      methods:{
+        //视频上传
+        handleChange(file, fileList) {
+          this.form.file =  file.raw
+        }, 
+        handleSuccess(res,file,fileList){  
+            this.$message.success("视频上传成功")               
+             this.form.vio_upload = this.qiniuDomain + res.url;           
+             console.log("是什么",this.form.vio_upload)
+
+             this.show=false;
+             this.shows = true;
+        },
+        handlevioSuccess(res,file,fileList){
+            console.log("上传成功没有?")
+           this.form.vid_pic = this.qiniuDomain + res.url;  
+
+        },
+         handleError(err, file, fileList) {
+             this.$message.error("视频上传失败")
+         },
+        beforeUploadFile(file) {
+        console.log("失身",file.size)    
+        const isLt2M = file.size / 1024 / 1024 < 2048;
+        if (!isLt2M) {
+          this.$message.error('上传视频大小不能超过 2G!');
+        }
+            var date = new Date()
+            var ext = getFileExtension(file.name)
+            console.log("文件名",file.name)
+            var key = date.getFullYear() + (date.getMonth() + 1) + date.getDate() + date.getHours()  + date.getMinutes()  + date.getSeconds()  +'_o_' + file.uid + '.' + ext;
+            const _self = this
+            return new Promise((resolve, reject) => {
+                getToken().then(response => {
+                    const token = response.data.data.uptoken
+                    console.log("token2是什么?",token)
+                    _self._data.uploadFileData.token = token
+                    _self._data.uploadFileData.key = key
+                    resolve(true)
+                }).catch(err => {
+                    reject(false)                  
+                })
+            })
+      },
+      beforevidoFile(file){
+          console.log(file.type)
+          const isJPG = file.type === 'image/jpg';
+          if (!isJPG) {
+          this.$message.error('上传头像图片只能是 png或者jpg格式!');
+        }
+          const isLt2M = file.size / 1024 / 1024 < 1;
+        if (!isLt2M) {
+          this.$message.error('上传图片大小不能超过 1M!');
+        }
+            var date = new Date()
+            var ext = getFileExtension(file.name)
+            var key = date.getFullYear() + (date.getMonth() + 1) + date.getDate() + date.getHours()  + date.getMinutes()  + date.getSeconds()  +'_o_' + file.uid + '.' + ext;
+            const _self = this
+            return new Promise((resolve, reject) => {
+                getToken().then(response => {
+                    const token = response.data.data.uptoken
+                    console.log("token2是什么?",token)
+                    _self._data.uploadvidoData.token = token
+                    _self._data.uploadvidoData.key = key
+                    resolve(true)
+                }).catch(err => {
+                    reject(false)                  
+                })
+            })
+       },
+      select(){
+        this.picshow = false
+      },
+      clickitem(){
+        this.picshow = true
+      },
+      handleRemove(file, fileList) {
+        console.log(file, fileList);
+      },
+      handlePreview(file) {
+        console.log(file);
+      },
+      handleExceed(files, fileList) {
+        this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
+      },
+      beforeRemove(file, fileList) {
+        return this.$confirm(`确定移除 ${ file.name }？`);
+      },
+      changeActtype(){
+         console.log("所属分类",this.form.act_type)
+       },
+       getEditVidoInfo(id){
+           getEditVidoInfo(id,this.form).then(response=>{
+               if(response.data.state==1){
+                 var vidos = response.data.data.vidos;
+                 this.form.vid_name = vidos.title;
+                 this.form.vid_pic = vidos.imgs;
+                 console.log("得到的是什么?",this.form.vid_pic)
+                 this.form.vid_type =  vidos.class_id
+                 console.log("视频vidos",vidos)
+               }    
+           })        
+       },
+       
+       getMenus(){
+           getMenus().then(response=>{
+               if(response.data.state ==1){
+                   var categorys = response.data.data.categorys;
+                   this.options = categorys;
+                  console.log("分类号",categorys)
+               }
+           });
+       },
+
+       SumitVido(forName){
+             const id = this.$route.params && this.$route.params.id;
+             console.log("id是多少?",id)
+          this.$refs[forName].validate((valid)=>{
+              if(valid){
+                 updataVidoInfo(id,this.form).then(response=>{
+                     if(response.data.state == 1){
+                         this.dialogVisible = true;      
+                     }
+                 })   
+              }
+          })
+       },
+        gobackList(){
+         this.$router.push({path:'/articles/articleList'})
+        },
+        clear(){
+          this.$confirm('是否确定取消编辑此文章/视频','取消提示',{
+            dangerouslyUseHTMLString:true,
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+          }).then(()=>{
+             this.$router.push({path:'/articles/articleList'})  
+          }) 
+        },
+
+        Savedraft(forName){
+           const id = this.$route.params && this.$route.params.id;
+           console.log("id是多少?",id);
+           this.$refs[forName].validate((valid)=>{
+               if(valid){
+                  SaveVidodraft(id,this.form).then(response=>{
+                      if(response.data.state == 1){
+                          this.dialogVisible = true;
+                      }
+                  });
+               }
+           })
+        }
+      },
+      created(){
+         const id = this.$route.params && this.$route.params.id;
+         console.log("id是什么?",id)
+         this.getEditVidoInfo(id);
+         this.getMenus();
+      }
+    }
+</script>
+
+<style scoped>
+      /*视频*/
+  .video-select {
+    padding: 150px 0 30px;
+    background: url("/static/images/video_load.png") no-repeat;
+    background-position: center 0;
+    background-size: 192px 132px;
+    text-align: center;
+    width: 200px;
+    height: 200px;
+    position: relative;
+    left: 500px;
+    margin-bottom: 1px;
+   }
+   .video{
+    padding: 150px 0 30px;
+    background-position: center 0;
+    background-size: 192px 132px;
+    text-align: center;
+    width: 200px;
+    height: 200px;
+    position: relative;
+    left: 500px;
+    margin-bottom: 60px;
+    margin-top: -140px;
+  }
+  .eltip{
+    font-size: 12px;
+    position: relative;
+    left: 80px;
+    margin-bottom: 20px;
+  }
+
+    .avatar-uploader{
+    border: 1px solid #d9d9d9;
+    border-radius: 6px;
+    cursor: pointer;
+    overflow: hidden;
+    width: 140px;
+    height: 140px;
+  }
+  .avatar-uploader{
+    border-color: #f0f2f5;
+  }
+  .avatar-uploader-icon {
+    font-size: 25px;
+    color: #8c939d;
+    width: 140px;
+    height: 140px;
+    line-height: 140px;
+    text-align: center;
+  }
+  .avatar {
+    width: 178px;
+    height: 178px;
+    display: block;
+  }
+</style>