修改素材 选择图片和音频的上传按钮

src/pages/teacher/components/ChooseImg.vue

 <template>
   <div class="ChooseImg" style="width: 900px; max-width: 80vw;">
-    <div style="margin:10px;">选择图片</div>
+    <div style="margin:10px;" v-if="type==1|| type==0">选择图片</div>
+    <div style="margin:10px;" v-if="type==2">选择音频</div>
+    <div style="margin:10px;" v-if="type==3">选择视频</div>
+
     <el-row v-loading="loading" style="border: 1px solid rgb(227, 227, 227);">
       <el-col :span="24">
-        <div style="margin-top: 10px;margin-left: 20px;" class="appendInput">
+        <div style="margin-top: 10px;margin-left: 20px;display: flex;" class="appendInput">
           <el-input size="small" style="width:250px" placeholder="请输入内容" @keyup.enter.native="GetPageList" v-model="msg.MediaName">
             <el-button @click="GetPageList" slot="append" icon="el-icon-search"></el-button>
           </el-input>
+          <q-btn color="accent" size="sm" class="q-mr-md" icon="cloud_upload" style="margin-left: 15px;" @click="goadd" label="上传"></q-btn>
         </div>
         <!-- type=0  图片单选 -->
         <template v-if="type==0">
-          <div class="basefix app-attachment-list">
+          <div class="basefix app-attachment-list" v-if="dataList && dataList.length>0">
             <el-tooltip v-for="(item,index) in dataList" :key="index" class="item" effect="dark"
               :content="item.MediaGroupName" placement="top-start">
               <div @click="PageSelect(item)" :class="getChecked(item) ? 'selected' :''"
@@ -20,10 +24,11 @@
               </div>
             </el-tooltip>
           </div>
+         
         </template>
          <!-- type=1  图片多选 -->
         <template v-if="type==1">
-          <div class="basefix app-attachment-list">
+          <div class="basefix app-attachment-list" v-if="dataList && dataList.length>0">
             <el-tooltip v-for="(item,index) in dataList" :key="index" class="item" effect="dark"
               :content="item.MediaGroupName" placement="top-start">
               <div @click="PageSelect(item)" :class="getChecked(item) ? 'selected' :''"
@@ -36,7 +41,7 @@
         </template>
         <!-- type2 音频 -->
         <template v-if="type==2">
-          <div class="basefix app-attachment-list">
+          <div class="basefix app-attachment-list" v-if="dataList && dataList.length>0">
             <el-tooltip v-for="(x,y) in dataList" :key="y" class="item" effect="dark"
               :content="x.MediaGroupName" placement="top-start">
               <div @click="PageSelect(x)" :class="getChecked(x) ? 'selected' :''"
@@ -54,7 +59,7 @@
         </template>
         <!-- type3 视频 -->
         <template v-if="type==3">
-          <div class="basefix app-attachment-list">
+          <div class="basefix app-attachment-list" v-if="dataList && dataList.length>0">
             <el-tooltip v-for="(x,y) in dataList" :key="y" class="item" effect="dark"
               :content="x.MediaGroupName" placement="top-start">
               <div style="width:200px;height:185px;padding:10px;" @click.stop="PageSelect(x)" :class="getChecked(x) ? 'selected' :''"
@@ -68,6 +73,9 @@
 
           </div>
         </template>
+        <div style="width: 100%;display: flex;align-items: center;justify-content: center;height: 100px;" v-if="dataList.length==0">
+          暂无数据
+        </div>
         <div style="padding:0 10px 10px 0">
           <el-pagination style="text-align:right" background :current-page="currentPage"
             @current-change="handleCurrentChange" :page-size="msg.pageSize" layout="prev, pager, next,jumper"
@@ -80,10 +88,19 @@
       <el-button size="small" @click="closeDialog">取消</el-button>
       <el-button size="small" type="primary" @click="SelectImgId">选定</el-button>
     </div>
+    <div v-if="Isadd==true">
+      <alladdsc :allclassifyList="allclassifyList" :type='msg.Type' @editsuccess="getchildren" :editobj='editobj'
+                @getcancel='Isadd=false'></alladdsc>
+    </div>
   </div>
 </template>
 
 <script>
+    import alladdsc from '../components/alladdsc'
+    import {
+      GetContributeMediumGroupList,
+  
+    } from '../../../api/system/wechat';
   import {
     GetContributeMediumPage
   } from '../../../api/system/wechat';
@@ -91,6 +108,9 @@
 
   export default {
     name: 'ChooseImg',
+    components: {
+       alladdsc
+    },
     props: {
       type: {
         type: Number,
@@ -119,9 +139,14 @@
         PageCount:0,
         dataList:[],
         playRec: null, //播放对象
+        Isadd: false,
+        editobj: null,
+        allclassifyList:[],
       }
     },
-    created() {},
+    created() {
+      this.getWeChatMediumGroupList()
+    },
     computed: {
 
     },
@@ -137,6 +162,11 @@
       this.GetPageList();
     },
     methods: {
+      getWeChatMediumGroupList() {
+        GetContributeMediumGroupList({}).then(res => {
+          this.allclassifyList = JSON.parse(JSON.stringify(res.Data))
+        })
+      },
        playVoice(_url, index) {
         // TODO 这里暂时没处理 音频播放中暂停
         let vm = this
@@ -263,6 +293,13 @@
             this.loading = false
           })
       },
+      goadd(){
+        this.Isadd = true;
+      },
+      getchildren(){
+        this.handleCurrentChange(1)
+        this.Isadd = false
+      },
     },
   }
 
@@ -349,5 +386,16 @@
     border-left: none;
     padding: 0 15px;
   }
+   .materialupload {
+    width: 118px;
+    height: 118px;
+    border-radius: 4px;
+    border: 1px dashed #d9d9d9;
+    background: #fafafa;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    padding: 4px;
+  }
 
 </style>

src/pages/teacher/components/alladdsc.vue

@@ -350,6 +350,7 @@
                     } else {
                       that.$forceUpdate();
                       that.addMsg.Path = res.FileUrl;
+                      that.addMsg.MediaName = res.FileName?res.FileName:'';
                       that.addMsg.Minutes = parseInt(that.duration.toFixed());
                       console.log(that.addMsg.Minutes, 'Minutes');
                     }
@@ -393,6 +394,7 @@
               amr.initWithUrl(res.FileUrl).then(function () {
                 that.duration = amr.getDuration();
                 that.addMsg.Path = res.FileUrl;
+                that.addMsg.MediaName = res.FileName?res.FileName:'';
                 that.addMsg.Minutes = parseInt(that.duration.toFixed());
               }).catch((e) => {