抽离菜单列表组件

src/components/Pagination/index.vue

@@ -5,7 +5,7 @@
 </template>
 
 <script>
-import { scrollTo } from '@/utils/scroll-to';
+import { scrollTo } from '@/utils/scroll-to'
 
 export default {
   name: 'Pagination',
@@ -25,7 +25,7 @@ export default {
     pageSizes: {
       type: Array,
       default() {
-        return [10, 20, 30, 50];
+        return [10, 20, 30, 50]
       }
     },
     layout: {
@@ -48,36 +48,36 @@ export default {
   computed: {
     currentPage: {
       get() {
-        return this.page;
+        return this.page
       },
       set(val) {
-        this.$emit('update:page', val);
+        this.$emit('update:page', val)
       }
     },
     pageSize: {
       get() {
-        return this.limit;
+        return this.limit
       },
       set(val) {
-        this.$emit('update:limit', val);
+        this.$emit('update:limit', val)
       }
     }
   },
   methods: {
     handleSizeChange(val) {
-      this.$emit('pagination', { page: this.currentPage, limit: val });
+      this.$emit('pagination', { page: this.currentPage, limit: val })
       if (this.autoScroll) {
-        scrollTo(0, 800);
+        scrollTo(0, 800)
       }
     },
     handleCurrentChange(val) {
-      this.$emit('pagination', { page: val, limit: this.pageSize });
+      this.$emit('pagination', { page: val, limit: this.pageSize })
       if (this.autoScroll) {
-        scrollTo(0, 800);
+        scrollTo(0, 800)
       }
     }
   }
-};
+}
 </script>
 
 <style scoped>

src/router/modules/wechat.js

@@ -141,6 +141,7 @@ const wechatRouter = {
     },
     {
       path: 'hehe',
+      component: () => import('@/views/wechat/hehe/index'),
       redirect: '/wechat/hehe/menus',
       name: 'WeChatHehe',
       meta: { title: '呵呵商城公众号', icon: 'component' },
@@ -148,6 +149,7 @@ const wechatRouter = {
         {
           path: 'menus',
           component: () => import('@/views/wechat/hehe/menus/index'),
+          redirect: '/wechat/hehe/menus/list',
           name: 'WeChatHeMenus',
           meta: { title: '菜单管理' },
           children: [
@@ -177,6 +179,7 @@ const wechatRouter = {
         {
           path: 'reply',
           component: () => import('@/views/wechat/hehe/reply/index'),
+          redirect: '/wechat/hehe/reply/list',
           name: 'WeChatHeReply',
           meta: { title: '回复配置' },
           children: [
@@ -206,6 +209,7 @@ const wechatRouter = {
         {
           path: 'text',
           component: () => import('@/views/wechat/hehe/text/index'),
+          redirect: '/wechat/hehe/text/list',
           name: 'WeChatHeText',
           meta: { title: '文本素材管理' },
           children: [
@@ -235,28 +239,29 @@ const wechatRouter = {
         {
           path: 'image',
           component: () => import('@/views/wechat/hehe/image/index'),
-          name: 'WeChatHeImage',
+          redirect: '/wechat/hehe/image/list',
+          name: 'WeChatCmImage',
           meta: { title: '图文素材管理' },
           children: [
             {
               path: 'list',
               hidden: true,
               component: () => import('@/views/wechat/hehe/image/list.vue'),
-              name: 'WeChatHeImageList',
+              name: 'WeChatCmImageList',
               meta: { title: '图文素材列表' }
             },
             {
               path: 'edit',
               hidden: true,
               component: () => import('@/views/wechat/hehe/image/form.vue'),
-              name: 'WeChatHeImageEdit',
+              name: 'WeChatCmImageEdit',
               meta: { title: '编辑图文素材' }
             },
             {
               path: 'add',
               hidden: true,
               component: () => import('@/views/wechat/hehe/image/form.vue'),
-              name: 'WeChatHeImageEdit',
+              name: 'WeChatCmImageEdit',
               meta: { title: '添加图文素材' }
             }
           ]

src/views/dashboard/index.vue

@@ -1,5 +1,5 @@
 <template>
   <div class="dashboard-container">
-      <h1>首页</h1>
+    <h1>首页</h1>
   </div>
 </template>

src/views/wechat/caimei/menus/form.vue

@@ -1,172 +1,21 @@
 <template>
-  <div class="app-container">
-    <el-page-header :content="isEdit?'编辑菜单':'添加菜单'" @back="goBack" />
-    <el-card class="form-container" shadow="never">
-      <el-form ref="weChatMenuFrom" :model="menu" :rules="rules" label-width="150px">
-        <el-form-item label="上级菜单:" prop="parentId">
-          <el-input v-model="parentTitle" readonly />
-          <input v-model="menu.parentId" type="hidden">
-        </el-form-item>
-        <el-form-item label="菜单标题:" prop="name">
-          <el-input v-model="menu.name" />
-        </el-form-item>
-        <el-form-item label="响应动作类型:" prop="type">
-          <el-select v-model="menu.type" placeholder="请选择">
-            <el-option value="" label="请选择" />
-            <el-option value="view" label="跳转URL" />
-            <el-option value="miniprogram" label="跳转小程序" />
-            <el-option value="view_limited" label="跳转图文消息URL" />
-            <el-option value="media_id" label="下发消息（除文本消息）" />
-            <el-option value="click" label="点击推事件" />
-            <el-option value="scancode_push" label="扫码推事件" />
-            <el-option value="scancode_waitmsg" label="扫码推事件且弹出“消息接收中”提示框" />
-            <el-option value="pic_sysphoto" label="弹出系统拍照发图" />
-            <el-option value="pic_photo_or_album" label="弹出拍照或者相册发图" />
-            <el-option value="pic_weixin" label="弹出微信相册发图器" />
-            <el-option value="location_select" label="弹出地理位置选择器" />
-          </el-select>
-        </el-form-item>
-        <el-form-item v-show="menu.type=='view'" label="网页链接:" prop="url">
-          <el-input v-model="menu.url" />
-        </el-form-item>
-        <el-form-item v-show="menu.type=='miniprogram'" label="小程序APPID:" prop="appid">
-          <el-input v-model="menu.appid" />
-        </el-form-item>
-        <el-form-item v-show="menu.type=='miniprogram'" label="小程序页面链接:" prop="pagePath">
-          <el-input v-model="menu.pagePath" />
-        </el-form-item>
-        <el-form-item v-show="menu.type=='view_limited' || menu.type=='media_id'" label="mediaId:" prop="mediaId">
-          <el-input v-model="menu.mediaId" />
-        </el-form-item>
-        <el-form-item v-show="['click','scancode_push','scancode_waitmsg','pic_sysphoto','pic_photo_or_album','pic_weixin','location_select'].indexOf(menu.type)>=0" label="KEY:" prop="key">
-          <el-input v-model="menu.key" />
-        </el-form-item>
-        <el-form-item label="排序:">
-          <el-input v-model="menu.sort" />
-        </el-form-item>
-        <el-form-item>
-          <el-button type="primary" @click="onSubmit('weChatMenuFrom')">提交</el-button>
-          <el-button v-if="!isEdit" @click="resetForm('weChatMenuFrom')">重置</el-button>
-        </el-form-item>
-      </el-form>
-    </el-card>
-  </div>
+  <menus-form />
 </template>
 <script>
-import { getMenu, updateMenu, createMenu } from '@/api/wechat/menu'
-const defaultMenu = {
-  id: '',
-  name: '',
-  type: '',
-  url: '',
-  key: '',
-  mediaId: '',
-  appid: '',
-  pagePath: '',
-  sort: 0,
-  parentId: 0
-}
+import MenusForm from '../../components/menusForm'
 export default {
-  name: 'WeChatMenuForm',
-  data() {
+  components: { MenusForm },
+  data: function() {
     return {
-      rules: {
-        name: [{ required: true, message: '菜单标题不能为空', trigger: 'blur' }]
-      },
-      parentTitle: '',
-      menu: Object.assign({}, defaultMenu),
-      isEdit: false
-    }
-  },
-  watch: {
-    $route(route) {
-      this.getFormData()
+
     }
   },
   created() {
-    this.getFormData()
-  },
-  methods: {
-    goBack() {
-      window.history.go(-1)
-    },
-    getFormData() {
-      if (this.$route.query.id) {
-        this.menu.id = this.$route.query.id
-        this.isEdit = true
-        getMenu(this.menu.id).then(response => {
-          this.menu.name = response.data.name
-          this.menu.type = response.data.type
-          this.menu.url = response.data.url
-          this.menu.key = response.data.key
-          this.menu.mediaId = response.data.mediaId
-          this.menu.appid = response.data.appid
-          this.menu.pagePath = response.data.pagePath
-          this.menu.sort = response.data.sort
-          this.menu.parentId = response.data.parentId
-        })
-      } else {
-        this.menu.id = ''
-        this.isEdit = false
-        this.menu = Object.assign({}, defaultMenu)
-      }
-      if (this.$route.query.parentId) {
-        this.menu.parentId = this.$route.query.parentId
-        this.parentTitle = this.$route.query.title
-      } else {
-        this.menu.parentId = 0
-        this.parentTitle = '无'
-      }
-    },
-    resetForm(formName) {
-      this.$refs[formName].resetFields()
-      this.menu = Object.assign({}, defaultMenu)
-      this.getFormData()
-    },
-    onSubmit(formName) {
-      this.$refs[formName].validate(valid => {
-        console.log(this.menu)
-        if (valid) {
-          this.$confirm('是否提交数据', '提示', {
-            confirmButtonText: '确定',
-            cancelButtonText: '取消',
-            type: 'warning'
-          }).then(() => {
-            if (this.isEdit) {
-              updateMenu(this.$route.query.id, this.menu).then(response => {
-                this.$message({
-                  message: '修改成功',
-                  type: 'success',
-                  duration: 1000
-                })
-                this.$router.back()
-              })
-            } else {
-              createMenu(this.menu).then(response => {
-                this.$refs[formName].resetFields()
-                this.resetForm(formName)
-                this.$message({
-                  message: '提交成功',
-                  type: 'success',
-                  duration: 1000
-                })
-                this.$router.back()
-              })
-            }
-          })
-        } else {
-          this.$message({
-            message: '验证失败',
-            type: 'error',
-            duration: 1000
-          })
-          return false
-        }
-      })
-    }
+    // debugger
+    console.log('采美公众号表单')
   }
 }
 </script>
+<style>
 
-<style scoped>
 </style>

src/views/wechat/caimei/menus/list.vue

@@ -1,153 +1,21 @@
 <template>
-  <div class="app-container">
-    <div class="filter-container">
-      <el-button class="filter-item" type="primary" icon="el-icon-edit" @click="handleCreate">添加一级菜单</el-button>
-      <el-button class="filter-item" type="primary" icon="el-icon-upload2" @click="handlePush">发布菜单到微信公众号</el-button>
-    </div>
-    <el-table v-loading="listLoading" row-key="id" :data="list" default-expand-all :row-class-name="rowClassName" border fit highlight-current-row>
-      <el-table-column label="菜单名称" prop="name" align="center" />
-      <el-table-column label="按钮类型" prop="type" align="center">
-        <template slot-scope="{row}"><span v-text="showTypeText(row.type)" /></template>
-      </el-table-column>
-      <el-table-column label="排序" prop="sort" align="center" width="80">
-        <template slot-scope="{row}">
-          <el-input v-model="row.sort" maxlength="4" minlength="1" @blur="handleOnInputBlur(row)" />
-        </template>
-      </el-table-column>
-      <el-table-column label="设置" align="center">
-        <template slot-scope="{row}">
-          <el-button plain size="mini" :disabled="row.parentId | disableAddSub" @click="handleCreateNextLevel(row)">添加子菜单</el-button>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" align="center">
-        <template slot-scope="{row}">
-          <el-button size="mini" type="primary" @click="handleUpdate(row)">编辑</el-button>
-          <el-button size="mini" type="danger" @click="handleDelete(row)">删除</el-button>
-        </template>
-      </el-table-column>
-    </el-table>
-  </div>
+  <menus-list :list-type="1" :menus-title="menusTitle" />
 </template>
-
 <script>
-import { fetchList, deleteMenu, updateMenu, pushWechatMenu } from '@/api/wechat/menu'
-
+import MenusList from '../../components/menusList'
 export default {
-  name: 'WeChatMenuList',
-  filters: {
-    disableAddSub(value) {
-      if (value !== 1 && value !== 2) {
-        return true
-      } else {
-        return false
-      }
-    }
-  },
-  data() {
+  components: { MenusList },
+  data: function() {
     return {
-      list: [],
-      listQuery: {
-        // type 类型： 1采美，2呵呵商城
-        type: '1'
-      }
-    }
-  },
-  watch: {
-    $route(route) {
-      this.getList()
+      menusTitle: '采美网公众号'
     }
   },
   created() {
-    this.getList()
-  },
-  methods: {
-    showTypeText: function(type) {
-      if (type === 'view') return '跳转URL'
-      if (type === 'miniprogram') return '跳转小程序'
-      if (type === 'view_limited') return '跳转图文消息URL'
-      if (type === 'media_id') return '下发消息（除文本消息）'
-      if (type === 'click') return '点击推事件'
-      if (type === 'scancode_push') return '扫码推事件'
-      if (type === 'scancode_waitmsg') return '扫码推事件且弹出“消息接收中”提示框'
-      if (type === 'pic_sysphoto') return '弹出系统拍照发图'
-      if (type === 'pic_photo_or_album') return '弹出拍照或者相册发图'
-      if (type === 'pic_weixin') return '弹出微信相册发图器'
-      if (type === 'location_select') return '弹出地理位置选择器'
-    },
-    rowClassName: function(scope) {
-      if (scope.row.parentId === 1 || scope.row.parentId === 2) {
-        return 'parent-row'
-      }
-    },
-    getList() {
-      this.listLoading = true
-      fetchList(this.listQuery).then(response => {
-        this.listLoading = false
-        this.list = response.data
-        // Just to simulate the time of the request
-        setTimeout(() => {
-          this.listLoading = false
-        }, 1.5 * 1000)
-      })
-    },
-    handleCreate() {
-      this.$router.push({ path: '/wechat/caimei/menus/add', query: { parentId: this.listQuery.type, title: '采美公众号' }})
-    },
-    handleUpdate(row) {
-      this.$router.push({ path: '/wechat/caimei/menus/edit', query: { id: row.id, parentId: row.parentId, title: row.parentName }})
-    },
-    handleCreateNextLevel(row) {
-      this.$router.push({ path: '/wechat/caimei/menus/add', query: { parentId: row.id, title: row.name }})
-    },
-    handleDelete(row) {
-      this.$confirm('是否要删除该菜单', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        deleteMenu(row.id).then(response => {
-          this.$message({
-            message: '删除成功',
-            type: 'success',
-            duration: 1000
-          })
-          this.getList()
-        })
-      })
-    },
-    handlePush() {
-      this.$confirm('是否要发布菜单', '提示', {
-        confirmButtonText: '确定',
-        cancelButtonText: '取消',
-        type: 'warning'
-      }).then(() => {
-        pushWechatMenu(this.listQuery.type).then(response => {
-          this.$message({
-            message: '删除成功',
-            type: 'success',
-            duration: 1000
-          })
-          this.getList()
-        })
-      })
-    },
-    handleOnInputBlur(row) {
-      // 更新排序
-      updateMenu(row.id, { sort: row.sort }).then(response => {
-        this.$message({
-          message: '操作成功',
-          type: 'success',
-          duration: 1000
-        })
-        this.getList()
-      })
-    }
+    // debugger
+    console.log('采美网公众号菜单列表')
   }
 }
 </script>
-
 <style>
-.el-table .parent-row {
-  background-color: #fdf6ec;
-}
+
 </style>

src/views/wechat/components/menusForm.vue

@@ -0,0 +1,172 @@
+<template>
+  <div class="app-container">
+    <el-page-header :content="isEdit?'编辑菜单':'添加菜单'" @back="goBack" />
+    <el-card class="form-container" shadow="never">
+      <el-form ref="weChatMenuFrom" :model="menu" :rules="rules" label-width="150px">
+        <el-form-item label="上级菜单:" prop="parentId">
+          <el-input v-model="parentTitle" readonly />
+          <input v-model="menu.parentId" type="hidden">
+        </el-form-item>
+        <el-form-item label="菜单标题:" prop="name">
+          <el-input v-model="menu.name" />
+        </el-form-item>
+        <el-form-item label="响应动作类型:" prop="type">
+          <el-select v-model="menu.type" placeholder="请选择">
+            <el-option value="" label="请选择" />
+            <el-option value="view" label="跳转URL" />
+            <el-option value="miniprogram" label="跳转小程序" />
+            <el-option value="view_limited" label="跳转图文消息URL" />
+            <el-option value="media_id" label="下发消息（除文本消息）" />
+            <el-option value="click" label="点击推事件" />
+            <el-option value="scancode_push" label="扫码推事件" />
+            <el-option value="scancode_waitmsg" label="扫码推事件且弹出“消息接收中”提示框" />
+            <el-option value="pic_sysphoto" label="弹出系统拍照发图" />
+            <el-option value="pic_photo_or_album" label="弹出拍照或者相册发图" />
+            <el-option value="pic_weixin" label="弹出微信相册发图器" />
+            <el-option value="location_select" label="弹出地理位置选择器" />
+          </el-select>
+        </el-form-item>
+        <el-form-item v-show="menu.type=='view'" label="网页链接:" prop="url">
+          <el-input v-model="menu.url" />
+        </el-form-item>
+        <el-form-item v-show="menu.type=='miniprogram'" label="小程序APPID:" prop="appid">
+          <el-input v-model="menu.appid" />
+        </el-form-item>
+        <el-form-item v-show="menu.type=='miniprogram'" label="小程序页面链接:" prop="pagePath">
+          <el-input v-model="menu.pagePath" />
+        </el-form-item>
+        <el-form-item v-show="menu.type=='view_limited' || menu.type=='media_id'" label="mediaId:" prop="mediaId">
+          <el-input v-model="menu.mediaId" />
+        </el-form-item>
+        <el-form-item v-show="['click','scancode_push','scancode_waitmsg','pic_sysphoto','pic_photo_or_album','pic_weixin','location_select'].indexOf(menu.type)>=0" label="KEY:" prop="key">
+          <el-input v-model="menu.key" />
+        </el-form-item>
+        <el-form-item label="排序:">
+          <el-input v-model="menu.sort" />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit('weChatMenuFrom')">提交</el-button>
+          <el-button v-if="!isEdit" @click="resetForm('weChatMenuFrom')">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </el-card>
+  </div>
+</template>
+<script>
+import { getMenu, updateMenu, createMenu } from '@/api/wechat/menu'
+const defaultMenu = {
+  id: '',
+  name: '',
+  type: '',
+  url: '',
+  key: '',
+  mediaId: '',
+  appid: '',
+  pagePath: '',
+  sort: 0,
+  parentId: 0
+}
+export default {
+  name: 'WeChatMenuForm',
+  data() {
+    return {
+      rules: {
+        name: [{ required: true, message: '菜单标题不能为空', trigger: 'blur' }]
+      },
+      parentTitle: '',
+      menu: Object.assign({}, defaultMenu),
+      isEdit: false
+    }
+  },
+  watch: {
+    $route(route) {
+      this.getFormData()
+    }
+  },
+  created() {
+    this.getFormData()
+  },
+  methods: {
+    goBack() {
+      window.history.go(-1)
+    },
+    getFormData() {
+      if (this.$route.query.id) {
+        this.menu.id = this.$route.query.id
+        this.isEdit = true
+        getMenu(this.menu.id).then(response => {
+          this.menu.name = response.data.name
+          this.menu.type = response.data.type
+          this.menu.url = response.data.url
+          this.menu.key = response.data.key
+          this.menu.mediaId = response.data.mediaId
+          this.menu.appid = response.data.appid
+          this.menu.pagePath = response.data.pagePath
+          this.menu.sort = response.data.sort
+          this.menu.parentId = response.data.parentId
+        })
+      } else {
+        this.menu.id = ''
+        this.isEdit = false
+        this.menu = Object.assign({}, defaultMenu)
+      }
+      if (this.$route.query.parentId) {
+        this.menu.parentId = this.$route.query.parentId
+        this.parentTitle = this.$route.query.title
+      } else {
+        this.menu.parentId = 0
+        this.parentTitle = '无'
+      }
+    },
+    resetForm(formName) {
+      this.$refs[formName].resetFields()
+      this.menu = Object.assign({}, defaultMenu)
+      this.getFormData()
+    },
+    onSubmit(formName) {
+      this.$refs[formName].validate(valid => {
+        console.log(this.menu)
+        if (valid) {
+          this.$confirm('是否提交数据', '提示', {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+          }).then(() => {
+            if (this.isEdit) {
+              updateMenu(this.$route.query.id, this.menu).then(response => {
+                this.$message({
+                  message: '修改成功',
+                  type: 'success',
+                  duration: 1000
+                })
+                this.$router.back()
+              })
+            } else {
+              createMenu(this.menu).then(response => {
+                this.$refs[formName].resetFields()
+                this.resetForm(formName)
+                this.$message({
+                  message: '提交成功',
+                  type: 'success',
+                  duration: 1000
+                })
+                this.$router.back()
+              })
+            }
+          })
+        } else {
+          this.$message({
+            message: '验证失败',
+            type: 'error',
+            duration: 1000
+          })
+          return false
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped>
+</style>

src/views/wechat/components/menusList.vue

@@ -0,0 +1,173 @@
+<template>
+  <div class="app-container">
+    <div class="filter-container">
+      <el-button class="filter-item" type="primary" icon="el-icon-edit" @click="handleCreate">添加一级菜单</el-button>
+      <el-button class="filter-item" type="primary" icon="el-icon-upload2" @click="handlePush">发布菜单到微信公众号</el-button>
+    </div>
+    <el-table v-loading="listLoading" row-key="id" :data="list" default-expand-all :row-class-name="rowClassName" border fit highlight-current-row>
+      <el-table-column label="菜单名称" prop="name" align="center" />
+      <el-table-column label="按钮类型" prop="type" align="center">
+        <template slot-scope="{row}"><span v-text="showTypeText(row.type)" /></template>
+      </el-table-column>
+      <el-table-column label="排序" prop="sort" align="center" width="80">
+        <template slot-scope="{row}">
+          <el-input v-model="row.sort" maxlength="4" minlength="1" @blur="handleOnInputBlur(row)" />
+        </template>
+      </el-table-column>
+      <el-table-column label="设置" align="center">
+        <template slot-scope="{row}">
+          <el-button plain size="mini" :disabled="row.parentId | disableAddSub" @click="handleCreateNextLevel(row)">添加子菜单</el-button>
+        </template>
+      </el-table-column>
+      <el-table-column label="操作" align="center">
+        <template slot-scope="{row}">
+          <el-button size="mini" type="primary" @click="handleUpdate(row)">编辑</el-button>
+          <el-button size="mini" type="danger" @click="handleDelete(row)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+import { fetchList, deleteMenu, updateMenu, pushWechatMenu } from '@/api/wechat/menu'
+
+export default {
+  name: 'WeChatMenuList',
+  filters: {
+    disableAddSub(value) {
+      if (value !== 1 && value !== 2) {
+        return true
+      } else {
+        return false
+      }
+    }
+  },
+  props: {
+    listType: {
+      type: Number,
+      default: 1
+    },
+    menusTitle: {
+      type: String,
+      default: ''
+    }
+  },
+  data() {
+    return {
+      list: [],
+      listQuery: {
+        // type 类型： 1采美，2呵呵商城
+        type: '2'
+      },
+      createTitle: '',
+      linkPath: ''
+    }
+  },
+  watch: {
+    $route(route) {
+      this.getList()
+    }
+  },
+  created() {
+    this.listQuery.type = this.listType
+    this.createTitle = this.menusTitle
+    if (this.listQuery.type === 1) {
+      this.linkPath = 'caimei'
+    } else {
+      this.linkPath = 'hehe'
+    }
+    console.log('createTitle', this.createTitle)
+    this.getList()
+  },
+  methods: {
+    showTypeText: function(type) {
+      if (type === 'view') return '跳转URL'
+      if (type === 'miniprogram') return '跳转小程序'
+      if (type === 'view_limited') return '跳转图文消息URL'
+      if (type === 'media_id') return '下发消息（除文本消息）'
+      if (type === 'click') return '点击推事件'
+      if (type === 'scancode_push') return '扫码推事件'
+      if (type === 'scancode_waitmsg') return '扫码推事件且弹出“消息接收中”提示框'
+      if (type === 'pic_sysphoto') return '弹出系统拍照发图'
+      if (type === 'pic_photo_or_album') return '弹出拍照或者相册发图'
+      if (type === 'pic_weixin') return '弹出微信相册发图器'
+      if (type === 'location_select') return '弹出地理位置选择器'
+    },
+    rowClassName: function(scope) {
+      if (scope.row.parentId === 1 || scope.row.parentId === 2) {
+        return 'parent-row'
+      }
+    },
+    getList() {
+      this.listLoading = true
+      fetchList(this.listQuery).then(response => {
+        this.listLoading = false
+        this.list = response.data
+        // Just to simulate the time of the request
+        setTimeout(() => {
+          this.listLoading = false
+        }, 1.5 * 1000)
+      })
+    },
+    handleCreate() {
+      this.$router.push({ path: `/wechat/${this.linkPath}/menus/add`, query: { parentId: this.listQuery.type, title: this.createTitle }})
+    },
+    handleUpdate(row) {
+      this.$router.push({ path: `/wechat/${this.linkPath}/menus/edit`, query: { id: row.id, parentId: row.parentId, title: row.parentName }})
+    },
+    handleCreateNextLevel(row) {
+      this.$router.push({ path: `/wechat/${this.linkPath}/menus/add`, query: { parentId: row.id, title: row.name }})
+    },
+    handleDelete(row) {
+      this.$confirm('是否要删除该菜单', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        deleteMenu(row.id).then(response => {
+          this.$message({
+            message: '删除成功',
+            type: 'success',
+            duration: 1000
+          })
+          this.getList()
+        })
+      })
+    },
+    handlePush() {
+      this.$confirm('是否要发布菜单', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      }).then(() => {
+        pushWechatMenu(this.listQuery.type).then(response => {
+          this.$message({
+            message: '删除成功',
+            type: 'success',
+            duration: 1000
+          })
+          this.getList()
+        })
+      })
+    },
+    handleOnInputBlur(row) {
+      // 更新排序
+      updateMenu(row.id, { sort: row.sort }).then(response => {
+        this.$message({
+          message: '操作成功',
+          type: 'success',
+          duration: 1000
+        })
+        this.getList()
+      })
+    }
+  }
+}
+</script>
+
+<style>
+.el-table .parent-row {
+  background-color: #fdf6ec;
+}
+</style>

src/views/wechat/hehe/menus/form.vue

@@ -0,0 +1,21 @@
+<template>
+  <menus-form />
+</template>
+<script>
+import MenusForm from '../../components/menusForm'
+export default {
+  components: { MenusForm },
+  data: function() {
+    return {
+
+    }
+  },
+  created() {
+    // debugger
+    console.log('呵呵商城公众号表单')
+  }
+}
+</script>
+<style>
+
+</style>

src/views/wechat/hehe/menus/list.vue

@@ -0,0 +1,21 @@
+<template>
+  <menus-list :list-type="2" :menus-title="menusTitle" />
+</template>
+<script>
+import MenusList from '../../components/menusList'
+export default {
+  components: { MenusList },
+  data: function() {
+    return {
+      menusTitle: '呵呵商城公众号'
+    }
+  },
+  created() {
+    // debugger
+    console.log('呵呵商城公众号菜单列表')
+  }
+}
+</script>
+<style>
+
+</style>