编写

src/components/lesson/dialog.vue

@@ -200,6 +200,8 @@
               item_category_ids:[],
               cover:0,
           };
+
+            this.imageList = [];
             this.selectedLessonList = [];
             this.selectedBoxList = [];
             break;

src/components/lesson/index.vue

@@ -61,9 +61,9 @@
         width="250"
         label="操作">
         <template slot-scope="scope">
-          <el-button size="mini" plain type="primary" @click="detail(scope.row)">
-            查看详情
-          </el-button>
+          <!--<el-button size="mini" plain type="primary" @click="detail(scope.row)">-->
+            <!--查看详情-->
+          <!--</el-button>-->
           <el-button size="mini" plain type="warning" @click="edit(scope.row)">
             编辑
           </el-button>

src/components/resources/editor.vue

@@ -7,12 +7,12 @@
             课程基本信息编辑
           </el-button>
           缩放：<el-input-number v-model="bigNum"  size="mini" :min="30" :max="150" :step="10"></el-input-number>
-          <el-button size="mini" type="success" style="float: right" @click="dialogVisible = true">
+          <el-button size="mini" type="success" style="float: right" @click="setOpen()">
             编辑当前页参数
           </el-button>
         </div>
         <div class="head-content">
-          <div>
+          <div v-if="selectedMould.length > 0">
             {{ selectedMould[nowIndex].title }}
           </div>
         </div>
@@ -20,7 +20,7 @@
       <el-container>
         <el-aside width="150px">
           <div class="page-list">
-            <div v-for="data in selectedMould" :key="data.name" @click="chooseThat(data)">
+            <div v-for="(data,index) in selectedMould" :key="index" @click="chooseThat(index)">
               <el-card shadow="hover" class="box" :body-style="{ padding: '0px' }">
                 <img :src="data.imgUrl" class="image">
               </el-card>
@@ -28,7 +28,7 @@
           </div>
         </el-aside>
         <el-main>
-          <div v-if="selectedMould[nowIndex].key === 'look1'">
+          <div v-if="selectedMould[nowIndex] && selectedMould[nowIndex].key === 'look1'">
             <div class="look1" :style="{backgroundImage:`url(${mouldImg.look1.bg}`,transform:`scale(${bigNum/100},${bigNum/100})`}">
               <div class="bg-block">
                 <img :src="mouldImg.look1.reqiqiu" class="reqiqiu"/>
@@ -39,14 +39,26 @@
                 </div>
                 <div>
                   <img :src="mouldImg.look1.radio"/>
+                  <audio :src="selectedMould[nowIndex].content.radioUrl"></audio>
                 </div>
-                <div>
+                <div class="today-block">
                   <img :src="mouldImg.look1.tadayBg"/>
+                  <div class="today-text">
+                    <div class="zhanwei1"></div>
+                    <div class="zhanwei2"></div>
+                    <div class="zhanwei3"></div>
+                    <div v-html="selectedMould[nowIndex].content.today">
+                    </div>
+                  </div>
                 </div>
                 <div class="title2-block">
                   <img :src="mouldImg.look1.title2" class="title2"/>
                   <img :src="mouldImg.look1.redM" class="redM"/>
                   <img :src="mouldImg.look1.flour" class="flour"/>
+                  <div class="directory-text">
+                    <div  v-html="selectedMould[nowIndex].content.directory">
+                    </div>
+                  </div>
                 </div>
               </div>
               <div class="bottom-block">
@@ -55,33 +67,90 @@
               </div>
             </div>
           </div>
+          <div v-if="selectedMould[nowIndex] && selectedMould[nowIndex].key === 'radio1'">
+            <div class="look1 radio1" :style="{backgroundImage:`url(${mouldImg.radio1.bg}`,transform:`scale(${bigNum/100},${bigNum/100})`}">
+              <div class="bg-block" :style="{backgroundImage:`url(${mouldImg.radio1.contentBg}`}">
+                <div>
+                  <img :src="mouldImg.radio1.title"/>
+                </div>
+                <div>
+                  <img :src="mouldImg.radio1.CD"/>
+                </div>
+                <div class="name-block">
+                  <div class="name">{{selectedMould[nowIndex].content.title}}</div>
+                  <div class="ahtor">{{selectedMould[nowIndex].content.name}}</div>
+                </div>
+                <div class="play-block">
+                  <img :src="mouldImg.radio1.loading"/>
+                  <div class="radius-icon"></div>
+                </div>
+                <div class="btn-block">
+                  <img :src="mouldImg.radio1.near"/>
+                  <img :src="mouldImg.radio1.play" class="play"/>
+                  <img :src="mouldImg.radio1.next"/>
+                </div>
+              </div>
+              <div class="title2-block">
+                <img :src="mouldImg.radio1.title2" class="title2"/>
+                <img :src="mouldImg.radio1.redM" class="redM"/>
+                <img :src="mouldImg.radio1.flour" class="flour"/>
+                <div class="directory-text">
+                </div>
+              </div>
+              <div class="bottom-block">
+                <img :src="mouldImg.radio1.backLookBtn"/>
+                <img :src="mouldImg.radio1.showBtn"/>
+              </div>
+            </div>
+          </div>
+          <div v-if="selectedMould[nowIndex] && selectedMould[nowIndex].key === 'play1'">
+            <div class="look1 play1" :style="{backgroundImage:`url(${mouldImg.play1.bg}`,transform:`scale(${bigNum/100},${bigNum/100})`}">
+              <div class="bg-block">
+                <div class="video-block">
+                  <img :src="mouldImg.play1.play"/>
+                </div>
+                <img :src="mouldImg.play1.radio" class="radio-img"/>
+                <img :src="mouldImg.play1.backBtn" class="btn back"/>
+                <img :src="mouldImg.play1.next" class="btn next"/>
+              </div>
+            </div>
+          </div>
         </el-main>
   </el-container>
   </el-container>
   <el-dialog
     title="编辑"
-      v-if="selectedMould[nowIndex].key === 'look1'"
     :visible.sync="dialogVisible"
     :modal="false"
     width="30%">
-      <el-form label-width="80px">
+    <el-form label-width="80px" v-if="selectedMould[nowIndex] && selectedMould[this.nowIndex].key === 'look1'">
       <el-form-item label="音频">
-          <el-input></el-input>
+        <el-input v-model="selectedMould[nowIndex].content.radioUrl"></el-input>
       </el-form-item>
       <el-form-item label="今日目标">
-          <el-input type="textarea"></el-input>
+        <el-input type="textarea" v-model="selectedMould[nowIndex].content.today"></el-input>
       </el-form-item>
       <el-form-item label="陪玩指南">
-          <el-input type="textarea"></el-input>
+        <el-input type="textarea" v-model="selectedMould[nowIndex].content.directory"></el-input>
+      </el-form-item>
+      <el-form-item label="停留时长">
+        <el-input-number v-model="selectedMould[nowIndex].content.timeLang"></el-input-number>
+      </el-form-item>
+    </el-form>
+    <el-form label-width="80px" v-if="selectedMould[nowIndex] && selectedMould[this.nowIndex].key === 'radio1'">
+      <el-form-item label="音频">
+        <el-input v-model="selectedMould[nowIndex].content.radioUrl"></el-input>
+      </el-form-item>
+      <el-form-item label="音频名字">
+        <el-input type="textarea" v-model="selectedMould[nowIndex].content.title"></el-input>
+      </el-form-item>
+      <el-form-item label="音频作者">
+        <el-input type="textarea" v-model="selectedMould[nowIndex].content.name"></el-input>
       </el-form-item>
       <el-form-item label="停留时长">
-          <el-input-number></el-input-number>
+        <el-input-number v-model="selectedMould[nowIndex].content.timeLang"></el-input-number>
       </el-form-item>
     </el-form>
-      <span slot="footer" class="dialog-footer">
-        <el-button @click="dialogVisible = false">取 消</el-button>
-        <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
-      </span>
   </el-dialog>
   </div>
 </template>
@@ -101,21 +170,23 @@
         mouldImg:mouldImg
       }
     },
+    methods:{
+      setOpen(){
+        this.dialogVisible = true;
+      },
+      chooseThat(data){
+        this.nowIndex = data;
+      }
+    },
     watch:{
       'selectedMould':{
         handler(newValue, oldValue) {
-          console.log(newValue)
           this.pageList = newValue
         },
         deep: true
       }
     },
-    methods:{
-      chooseThat(data){
-        this.nowIndex = this.selectedMould.indexOf(data)
-        console.log(this.nowIndex)
-      }
-    }
+
   }
 </script>
 
@@ -156,6 +227,89 @@
     overflow: hidden;
     margin: auto;
     position: relative;
+    &.play1{
+      .bg-block{
+        width:1110px ;
+        height: 650px;
+        transform-origin: 355px 365px;
+        transform: rotate(90deg);
+        padding: 20px;
+        .radio-img{
+          position: absolute;
+          right: 20px;
+          top: 20px;
+        }
+        .btn{
+          position: absolute;
+          right: 20px;
+          bottom: 40px;
+          &.back{
+            bottom:120px
+          }
+        }
+        .video-block{
+          background: black;
+          border-radius: 8px;
+          height: 100%;
+          width: 1000px;
+          position: relative;
+          img{
+            position: absolute;
+            top: 50%;
+            left: 50%;
+            margin-top: -50px;
+            margin-left: -50px;
+          }
+        }
+      }
+    }
+    &.radio1{
+      .bg-block{
+        background-color: transparent;
+        border: none;
+        box-shadow: none;
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+        .name-block{
+          margin-top: 40px;
+          font-family: PingFang-SC-Regular;
+          color: #333333;
+          .name{
+            height: 50px;
+            line-height: 50px;
+            font-size: 32px;
+          }
+          .ahtor{
+            font-size: 24px;
+          }
+        }
+        .play-block{
+          width: 544px;
+          margin: 40px auto auto auto;
+          position: relative;
+          .radius-icon{
+            position: absolute;
+            width: 25px;
+            top: -2px;
+            left: 0;
+            height: 25px;
+            background: #aacc38;
+            border-radius: 100px;
+          }
+        }
+        .btn-block{
+          line-height: 200px;
+          img{
+            vertical-align: middle;;
+            margin-right: 20px;
+            &:last-child{
+              margin-right: 0;
+            }
+          }
+        }
+      }
+
+    }
     &>div{
       margin: auto;
       text-align: center;
@@ -169,6 +323,41 @@
       border-radius: 8px;
       margin: auto;
       top: 150px;
+      .today-block{
+        position: relative;
+        .today-text{
+          position: absolute;
+          top: 70px;
+          left: 0;
+          bottom: 0;
+          right: 0;
+          font-size: 28px;
+          line-height: 70px;
+          text-align: left;
+          padding-left: 40px;
+          padding-right: 30px;
+          z-index: 3;
+          overflow: hidden;
+          .zhanwei1{
+            float: left;
+            clear: left;
+            width: 30px;
+            height: 70px;
+          }
+          .zhanwei2{
+            float: left;
+            clear: left;
+            width: 120px;
+            height: 70px;
+          }
+          .zhanwei3{
+            float: left;
+            clear: left;
+            width: 140px;
+            height: 70px;
+          }
+        }
+      }
       .reqiqiu{
         position: absolute;
         left: -30px;
@@ -204,6 +393,20 @@
         position: relative;
         top: 35px;
         height: 450px;
+        .directory-text{
+          position: absolute;
+          top: 50px;
+          left: 0;
+          bottom: 0;
+          right: 0;
+          font-size: 28px;
+          line-height: 70px;
+          text-align: left;
+          padding-left: 40px;
+          padding-right: 30px;
+          z-index: 3;
+          overflow: hidden;
+        }
         .title2{
           position: absolute;
           top: -45px;

src/components/resources/editorDialog.vue

@@ -58,8 +58,7 @@
     },
     methods:{
       addMould(data){
-        this.selectedMould.push(data)
-        console.log(this.selectedMould)
+        this.selectedMould.push(JSON.parse(JSON.stringify(data)))
       }
     }
   }

src/components/resources/list.vue

@@ -67,8 +67,7 @@
     },
     methods:{
       getList(){
-        console.log(this.id)
-        getCateListApi(this.id).then(res=>{
+        getCateListApi({category_id:this.id}).then(res=>{
           this.list = res.list
         })
       },

src/components/system/menu.vue

+<template>
+    
+</template>
+
+<script>
+    export default {
+        name: "menu"
+    }
+</script>
+
+<style scoped>
+
+</style>

src/components/weChat/weChatResource.vue

+<template>
+    
+</template>
+
+<script>
+    export default {
+        name: "weChatResource"
+    }
+</script>
+
+<style scoped>
+
+</style>

src/router/index.js

@@ -9,6 +9,7 @@ import login from '@/components/login'
 import resources from '@/components/resources'
 import admin from '@/components/system/admin'
 import role from '@/components/system/role'
+import menu from '@/components/system/menu'
 import user from '@/components/user'
 import teacher from '@/components/teacher'
 import lesson from '@/components/lesson'
@@ -24,6 +25,7 @@ import weChat from '@/components/weChat'
 import help from '@/components/help'
 import sysConfig from '@/components/system/sysConfig'
 import autoReply from '@/components/weChat/autoReply'
+import weChatResource from '@/components/weChat/weChatResource'
 
 Vue.use(Router);
 
@@ -51,6 +53,14 @@ const router =new Router({
           path: '/help',
           name:'help',
           component: help
+        },{
+          path: '/weChatResource',
+          name:'weChatResource',
+          component: weChatResource
+        },{
+          path: '/menu',
+          name:'menu',
+          component: menu
         },{
           path: '/focusReply',
           name:'focusReply',

src/service/api.js

@@ -153,9 +153,9 @@ export const sortCategoryApi = function (json) {
   return Vue.prototype.$patch(sortCategoryUrl,json)
 };
 //获取分类下的元素列表
-const getCateDetailListUrl = `${_baseUrl}api/admin/element/list/0?category_id=`;
+const getCateDetailListUrl = `${_baseUrl}api/admin/element/list/0`;
 export const getCateListApi = function (id) {
-  return Vue.prototype.$fetch(`${getCateDetailListUrl}${id}`)
+  return Vue.prototype.$fetch(getCateDetailListUrl,id)
 };
 // 获取单品列表
 const getSingleListUrl = `${_baseUrl}api/admin/item/stock/list`;

src/service/index.js

 import axios from 'axios';
 import md5 from 'js-md5';
 import { MessageBox ,Message  } from 'element-ui';
+import router from '../router'
 import Cookie from '../util/cookie'
 // 默认超时设置
 axios.defaults.timeout = 5000;

src/util/menuList.js

@@ -119,6 +119,11 @@ export default  [
         value:'公众号',
         routerName:'weChat',
         path:'/weChat'
+      },
+      {
+        value:'素材管理',
+        routerName:'weChatResource',
+        path:'/weChatResource'
       }
     ]
   },{
@@ -135,9 +140,9 @@ export default  [
         routerName:'role',
         path:'/role'
       },{
-        value:'权限管理',
-        routerName:'permission',
-        path:'/permission'
+        value:'菜单管理',
+        routerName:'menu',
+        path:'/menu'
       },{
         value:'系统配置',
         routerName:'sysConfig',

src/util/mouldImgUrl.js

@@ -13,6 +13,21 @@ import look1_title1 from '../assets/mould/look1/title1.png'
 import look1_title2 from '../assets/mould/look1/title2.png'
 import look1_xuxian from '../assets/mould/look1/xuxian.png'
 import look1_yun from '../assets/mould/look1/yun.png'
+import radio1_bg from '../assets/mould/radio1/bg.png'
+import radio1_backLookBtn from '../assets/mould/radio1/backLookBtn.png'
+import radio1_CD from '../assets/mould/radio1/CD.png'
+import radio1_contentBg from '../assets/mould/radio1/contentBg.png'
+import radio1_loading from '../assets/mould/radio1/loading.png'
+import radio1_near from '../assets/mould/radio1/near.png'
+import radio1_next from '../assets/mould/radio1/next.png'
+import radio1_play from '../assets/mould/radio1/play.png'
+import radio1_showBtn from '../assets/mould/radio1/showBtn.png'
+import playTitle from '../assets/mould/radio1/title.png'
+import play1_bg from '../assets/mould/video/bg.png'
+import play1_back from '../assets/mould/video/back.png'
+import play1_next from '../assets/mould/video/next.png'
+import play1_paly from '../assets/mould/video/paly.png'
+import play1_radio from '../assets/mould/video/radio.png'
 export default {
   look1:{
     bg:look1_bg,
@@ -30,5 +45,24 @@ export default {
     title2:look1_title2,
     xuxian:look1_xuxian,
     yun:look1_yun
+  },
+  radio1:{
+    bg:radio1_bg,
+    backLookBtn:radio1_backLookBtn,
+    CD:radio1_CD,
+    contentBg:radio1_contentBg,
+    loading:radio1_loading,
+    near:radio1_near,
+    next:radio1_next,
+    play:radio1_play,
+    showBtn:radio1_showBtn,
+    title:playTitle
+  },
+  play1:{
+    bg:play1_bg,
+    backBtn:play1_back,
+    next:play1_next,
+    radio:play1_radio,
+    play:play1_paly,
   }
 }

src/util/resourceMould.js

@@ -20,7 +20,17 @@ export const MOULDLIST = [
     title:'宝贝玩一玩',
     imgUrl:playRadioUrl,
     name:'玩-radio-1',
-    key:'radio1'
+    key:'radio1',
+    content:{
+      radio:[
+        {
+          radioUrl:'',
+          name:'',
+          title:'',
+        }
+      ],
+      timeLang: 0
+    }
   },{
     title:'宝贝玩一玩',
     imgUrl:playVideoUrl,