├── .gitignore
├── wxmenu.jpg
├── routes
    └── web.php
├── src
    ├── WXMenu.php
    ├── WXMenuFormField.php
    ├── WXMenuServiceProvider.php
    └── Http
    │   └── Controllers
    │       └── WXMenuController.php
├── composer.json
├── LICENSE
├── README.md
└── resources
    ├── assets
        ├── css
        │   └── style.min.css
        └── js
        │   └── index.min.js
    └── views
        └── index.blade.php


/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | 


--------------------------------------------------------------------------------
/wxmenu.jpg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/yisonli/wxmenu/HEAD/wxmenu.jpg


--------------------------------------------------------------------------------
/routes/web.php:
--------------------------------------------------------------------------------
1 | <?php
2 | 
3 | use Yisonli\WXMenu\Http\Controllers\WXMenuController;
4 | 
5 | //Route::get('wxmenu', WXMenuController::class.'@index');


--------------------------------------------------------------------------------
/src/WXMenu.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace Yisonli\WXMenu;
 4 | 
 5 | use Encore\Admin\Extension;
 6 | 
 7 | class WXMenu extends Extension
 8 | {
 9 |     public $name = 'wxmenu';
10 | 
11 |     public $views = __DIR__.'/../resources/views';
12 | 
13 |     public $assets = __DIR__.'/../resources/assets';
14 | 
15 |     public $menu = [
16 |         'title' => 'WeChatMenu',
17 |         'path'  => 'wxmenu',
18 |         'icon'  => 'fa-gears',
19 |     ];
20 | }


--------------------------------------------------------------------------------
/composer.json:
--------------------------------------------------------------------------------
 1 | {
 2 |     "name": "yisonli/wxmenu",
 3 |     "description": "An editor for wechat menu.",
 4 |     "type": "library",
 5 |     "keywords": ["laravel-admin", "extension"],
 6 |     "homepage": "https://github.com/yisonli/wxmenu",
 7 |     "license": "MIT",
 8 |     "authors": [
 9 |         {
10 |             "name": "yisonli",
11 |             "email": "yisonli@vip.qq.com"
12 |         }
13 |     ],
14 |     "require": {
15 |         "php": ">=7.0.0",
16 |         "encore/laravel-admin": "~1.6"
17 |     },
18 |     "require-dev": {
19 |         "phpunit/phpunit": "~6.0"
20 |     },
21 |     "autoload": {
22 |         "psr-4": {
23 |             "Yisonli\\WXMenu\\": "src/"
24 |         }
25 |     },
26 |     "extra": {
27 |         "laravel": {
28 |             "providers": [
29 |                 "Yisonli\\WXMenu\\WXMenuServiceProvider"
30 |             ]
31 |         }
32 |     }
33 | }
34 | 


--------------------------------------------------------------------------------
/src/WXMenuFormField.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace Yisonli\WXMenu;
 4 | 
 5 | use Encore\Admin\Form\Field;
 6 | 
 7 | class WXMenuFormField extends Field
 8 | {
 9 |     protected $view = 'wxmenu::index';
10 | 
11 |     protected static $css = [
12 |         'vendor/laravel-admin-ext/wxmenu/css/style.min.css'
13 |     ];
14 |     protected static $js = [
15 |         'https://cdn.jsdelivr.net/npm/vue',
16 |         'vendor/laravel-admin-ext/wxmenu/js/index.min.js'
17 |     ];
18 | 
19 |     public function render()
20 |     {
21 |         if(empty($this->value)) {
22 |             $this->value = !empty($this->default) ? $this->default : [
23 |                 "button" => [],
24 |             ];
25 |         }
26 |         if (!is_string($this->value)) {
27 |             $this->value = json_encode($this->value);
28 |         }else {
29 |             $this->value = json_encode(json_decode($this->value));   //兼容json里有类似</p>格式，首次初始化显示会丢失的问题
30 |         }
31 | 
32 |         return parent::render();
33 |     }
34 | }


--------------------------------------------------------------------------------
/src/WXMenuServiceProvider.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace Yisonli\WXMenu;
 4 | 
 5 | use Encore\Admin\Admin;
 6 | use Encore\Admin\Form;
 7 | use Illuminate\Support\ServiceProvider;
 8 | 
 9 | class WXMenuServiceProvider extends ServiceProvider
10 | {
11 |     /**
12 |      * {@inheritdoc}
13 |      */
14 |     public function boot(WXMenu $extension)
15 |     {
16 |         if (! WXMenu::boot()) {
17 |             return ;
18 |         }
19 | 
20 |         if ($views = $extension->views()) {
21 |             $this->loadViewsFrom($views, 'wxmenu');
22 |         }
23 | 
24 |         if ($this->app->runningInConsole() && $assets = $extension->assets()) {
25 |             $this->publishes(
26 |                 [$assets => public_path('vendor/laravel-admin-ext/wxmenu')],
27 |                 'wxmenu'
28 |             );
29 |         }
30 | 
31 |         Admin::booting(function () {
32 |             Form::extend('wxmenu', WXMenuFormField::class);
33 |         });
34 | 
35 |         $this->app->booted(function () {
36 |             WXMenu::routes(__DIR__.'/../routes/web.php');
37 |         });
38 |     }
39 | }


--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
 1 | The MIT License (MIT)
 2 | 
 3 | Copyright (c) 2019 yisonli(yyeer.com)
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy of
 6 | this software and associated documentation files (the "Software"), to deal in
 7 | the Software without restriction, including without limitation the rights to
 8 | use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
 9 | the Software, and to permit persons to whom the Software is furnished to do so,
10 | subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
17 | FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
18 | COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
19 | IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
20 | CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
21 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | # An editor for WeChat Menu.
 2 | 
 3 | This is a `laravel-admin` extension that integrates [wx_menu](http://www.jq22.com/jquery-info21835) into `laravel-admin`.
 4 | 
 5 | 
 6 | ## Screenshot
 7 | 
 8 | <img src="wxmenu.jpg">
 9 | 
10 | ## Installation
11 | 
12 | First, install dependencies:
13 | 
14 | ```bash
15 | composer require yisonli/wxmenu
16 | ```
17 | 
18 | Then, publish the resource directory:
19 | 
20 | ```bash
21 | php artisan vendor:publish --tag=wxmenu --force
22 | ```
23 | 
24 | ## Configuration
25 | 
26 | In the `extensions` section of the `config/admin.php` file, add some configuration that belongs to this extension.
27 | 
28 | ```php
29 | 'extensions' => [
30 |     'wxmenu' => [
31 |         // set to false if you want to disable this extension
32 |         'enable' => true,
33 |     ]
34 | ]
35 | ```
36 | 
37 | 
38 | ## Usage
39 | 
40 | Use it in the form form:
41 | 
42 | ```php
43 | $form->wxmenu('content');
44 | 
45 | // Also you can set default value like this
46 | $form->wxmenu('content')->default($default_value);
47 | ```
48 | 
49 | ## License
50 | 
51 | Licensed under [The MIT License](LICENSE).
52 | 
53 | ## About Me
54 | name: yison.li  
55 | blog: [http://yyeer.com](http://yyeer.com)  
56 | github: [https://github.com/yisonli](https://github.com/yisonli)
57 | 
58 | ![](http://yyeer.com/assets/img/YisonWechat.png)


--------------------------------------------------------------------------------
/src/Http/Controllers/WXMenuController.php:
--------------------------------------------------------------------------------
 1 | <?php
 2 | 
 3 | namespace Yisonli\WXMenu\Http\Controllers;
 4 | 
 5 | use Encore\Admin\Layout\Content;
 6 | use Illuminate\Routing\Controller;
 7 | 
 8 | class WXMenuController extends Controller
 9 | {
10 |     public function index(Content $content)
11 |     {
12 |         if(empty($value)) {
13 |             $value = [
14 |                 "button" => [
15 |                     [
16 |                         "name" => "菜单1",
17 |                         "sub_button" => [
18 |                             [
19 |                                 "name" => "子菜单5",
20 |                                 "type" => "view",
21 |                             ],
22 |                             [
23 |                                 "name" => "子菜单4",
24 |                                 "type" => "view",
25 |                             ],
26 |                         ],
27 |                     ],
28 |                     [
29 |                         "name" => "菜单名称",
30 |                         "type" => "click",
31 |                         "url" => "http://yyeer.com/",
32 |                     ],
33 |                     [
34 |                         "name" => "菜单名称",
35 |                         "type" => "view",
36 |                         "url" => "http://yyeer.com/",
37 |                     ],
38 |                 ],
39 |             ];
40 |         }
41 |         return $content
42 |             ->title('Title')
43 |             ->description('Description')
44 |             ->body(view('wxmenu::index', ['value'=>json_encode($value, JSON_UNESCAPED_UNICODE)]));
45 |     }
46 | }


--------------------------------------------------------------------------------
/resources/assets/css/style.min.css:
--------------------------------------------------------------------------------
1 | .editor-handler-tips{position:absolute;left:50%;top:50%;margin:-10px 0 0 -10px;color:#07a4ef}.custom-menu-wraper{padding:20px 25px}.custom-menu-wraper h2,.custom-menu-wraper p,.custom-menu-wraper ul,.custom-menu-wraper h3{margin:0;padding:0}.custom-phone-box{min-width:320px;max-width:320px;background:#fff;height:565px;box-shadow:2px 3px 5px #e7e7eb;border-radius:2px;border:1px solid #e7e7eb;text-align:center}.custom-nav-title{line-height:55px;background:#333;border-radius:2px 2px 0 0;color:#fff;font-size:15px;margin:0}.custom-phone-body{line-height:457px;margin:0;color:#999}.custom-phone-footer{border-top:1px solid #e7e7eb;line-height:50px;background:#fbfbfb}.custom-a-button{display:block;line-height:50px;text-align:center}.custom-a-button:hover{text-decoration:none}.custom-svg-size{display:inline-block;width:25px;height:25px;margin:0;padding:0;vertical-align:top;position:relative}.custom-svg-size:after,.custom-svg-size::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:23px;height:3px;border-radius:10px;background:#666}.custom-svg-size::before{height:23px;width:3px}.custom-a-button .custom-svg-size{vertical-align:-9px}.custom-a-button:hover .custom-svg-size::before,.custom-a-button:hover .custom-svg-size::after{background:#1b8bf5}.custom-edit-menu{background-color:#f4f5f9;border:1px solid #e7e7eb;padding:0 20px 5px;min-height:565px;position:relative;border-radius:2px}.custom-editor_arrow_wrp{position:absolute;left:-13px;bottom:40px}.custom-editor_arrow_wrp .editor_arrow{display:inline-block;width:0;height:0;border-width:12px;border-style:dashed;border-color:transparent;border-left-width:0;border-right-color:#e7e7eb;border-right-style:solid;left:0;position:absolute}.custom-editor_arrow_wrp .editor_arrow_in{left:1px;border-right-color:#f4f5f9}.custom-editor-title{padding-top:10px;border-bottom:1px solid #e6e6e6;margin:0;line-height:40px}.custom-edit-menu h2{font-size:15px;line-height:40px;font-weight:normal}.form-horizontal{padding-top:20px}.form-horizontal .control-label{font-weight:normal;padding-right:0}.menu-type-select{margin-right:10px;display:inline-block}.custom-panel-default{background:#fff;border-radius:3px;padding:25px 5px;border:1px solid #e6e6e6}.form-horizontal .submit-button{margin-top:40px}.custom-menu-wraper .submit-menu-handler{padding:20px 0}.pre_menu_list{display:box;display:-webkit-box;display:flex;display:-webkit-flex;margin:0;padding:0}.pre_menu_list li{list-style:none;flex:1;border:1px solid #fbfbfb;transition:all .3s;position:relative}.pre_menu_item+.pre_menu_item{border-left:1px solid #e7e7eb;font-size:12px}.pre_menu_item a{color:#444}.pre_menu_item.active{border-color:#07a4ef}.pre_menu_item.active a.pre_menu_link{color:#07a4ef}.pre_menu_item.selected .sub_pre_menu_box{display:block}.sub_pre_menu_box{display:none;position:absolute;bottom:63px;left:2.5%;width:95%;border:1px solid #e7e7eb;background-color:#fff}.sub_pre_menu_box .arrow{position:absolute;left:50%;margin-left:-6px;display:inline-block;width:0;height:0;border-style:dashed;border-color:transparent;border-bottom-width:0;border-top-style:solid;border-width:6px}.sub_pre_menu_box .arrow_out{border-top-color:#e7e7eb;bottom:-13px}.sub_pre_menu_box .arrow_in{bottom:-12px;border-top-color:#fff}.sub_pre_menu_box a{line-height: 22px;color: #444;font-size: 13px;padding: 8px 2px;}.sub_pre_menu_item+.sub_pre_menu_item{border-top:1px solid #e7e7eb}.sub_pre_menu_item .custom-a-button:hover{background:#fbfbfb;border-color:#fbfbfb}.sub_pre_menu_item.active .custom-a-button{background:#07a4ef;color:#fff}.custom-toast{margin-top:20px;color:#fb000b;font-weight:bold}


--------------------------------------------------------------------------------
/resources/assets/js/index.min.js:
--------------------------------------------------------------------------------
1 | var time=null;function jsonFormat(options){if(!options){return{}};var array=options.button||[];for(var i=0;i<array.length;i++){var item=array[i];if(!item.name){array.splice(i,1)}}options.button=array;return options}function VueInit(option,submitHandler){var extendsOptions=jsonFormat(option);var app=new Vue({el:'#app',data:{toastMsg:'',zindex:-1,subZindex:-1,nowItem:{},resultJson:JSON.stringify({menu:extendsOptions||{}},null,'  '),menu:extendsOptions,menuTypeList:[{value:'view',label:'跳转链接'},{value:'click',label:'事件推送'},{value:'miniprogram',label:'跳转小程序'},],},methods:{toast:function(msg){clearTimeout(time);this.toastMsg=msg;var that=this;time=setTimeout(function(){that.toastMsg=''},2000)},addMenuHandler:function(type){if(type==0){this.menu.button.push({name:'菜单名称',type:'view',})}else if(type==1){var item={name:'子菜单名称',type:'view',};if(this.menu.button[this.zindex].hasOwnProperty('sub_button')){this.menu.button[this.zindex].sub_button.push(item);this.nowItem=deepClone(this.menu.button[this.zindex])}else{Vue.set(this.menu.button[this.zindex],'sub_button',[item]);Vue.set(this.nowItem,'sub_button',[item])}Vue.delete(this.menu.button[this.zindex],'url');Vue.delete(this.menu.button[this.zindex],'type');Vue.delete(this.menu.button[this.zindex],'appid')}},removeMenuHandler:function(){if(this.subZindex<0){this.menu.button.splice(this.zindex,1);this.zindex=-1;this.nowItem={}}else{this.menu.button[this.zindex].sub_button.splice(this.subZindex,1);this.subZindex=-1;this.nowItem=deepClone(this.menu.button[this.zindex])}},selectedMenuItem:function(value){this.zindex=value;this.nowItem=deepClone(this.menu.button[value]);this.subZindex=-1},selectedSubMenuItem:function(value){this.subZindex=value;this.nowItem=deepClone(this.menu.button[this.zindex].sub_button[value],)},confirmEditor:function(){if(this.nowItem.name==''){this.toast('请填写菜单名称');return false}else{if(this.nowItem.type=='view'&&!this.nowItem.url){this.toast('请输入跳转链接');return false}else if(this.nowItem.type=='click'&&!this.nowItem.key){this.toast('请输入推送的内容');return false}else if(this.nowItem.type=='miniprogram'){if(!this.nowItem.pagepath){this.toast('请输入小程序路径');return false}else if(!this.nowItem.url){this.toast('请输入备用链接');return false}else if(!this.nowItem.appid){this.toast('请输入AppId');return false}}}if(this.subZindex<0){this.menu.button.splice(this.zindex,1,this.nowItem)}else{this.menu.button[this.zindex].sub_button.splice(this.subZindex,1,this.nowItem,)};this.resultJson=JSON.stringify({menu:this.menu},null,'  ');this.toast('修改成功')},saveHandler:function(event){var flag=false;function verification(menuArr){for(var i=0;i<menuArr.length;i++){var nowItem=menuArr[i];if(nowItem.name==''){alert('请完善菜单名称');flag=true;break}else if(nowItem.sub_button&&nowItem.sub_button.length){verification(nowItem.sub_button)}else{if(nowItem.type=='view'&&!nowItem.url){alert('请输入 ['+nowItem.name+'] 跳转链接');flag=true;break}else if(nowItem.type=='click'&&!nowItem.key){alert('请输入 ['+nowItem.name+'] 推送的内容');flag=true;break}else if(nowItem.type=='miniprogram'){if(!nowItem.pagepath){alert('请输入 ['+nowItem.name+'] 小程序路径');flag=true;break}else if(!nowItem.url){alert('请输入 ['+nowItem.name+'] 备用链接');flag=true;break}else if(!nowItem.appid){alert('请输入 ['+nowItem.name+'] AppId');flag=true;break}}}}return flag}if(verification(this.menu.button)){event&&event.preventDefault()}submitHandler&&submitHandler({menu:this.menu})},selectedMenuType:function(value){var item={type:value,name:this.nowItem.name,};if(value=='click'){item.key=this.nowItem.url||''}else if(value=='view'){item.url=this.nowItem.url||''}else{item.appid='';item.url=this.nowItem.url||'';item.pagepath=''}this.nowItem=item},},})}function deepClone(data){var obj;if(isArray(data)){obj=[]}else if(isObject(data)){obj={}}else{return data}if(isArray(data)){for(var i=0,len=data.length;i<len;i++){obj.push(deepClone(data[i]))}}else if(isObject(data)){for(var key in data){obj[key]=deepClone(data[key])}}return obj}function isArray(arg){return Object.prototype.toString.call(arg)==='[object Array]'}function isObject(arg){return Object.prototype.toString.call(arg)==='[object Object]'}


--------------------------------------------------------------------------------
/resources/views/index.blade.php:
--------------------------------------------------------------------------------
  1 | 
  2 | <div id="{{$id}}">
  3 |     <div class="row custom-menu-wraper">
  4 |         <div class="col-md-2" style="width:360px">
  5 |             <div class="custom-phone-box">
  6 |                 <h3 class="custom-nav-title">{{$label}}</h3>
  7 |                 <p class="custom-phone-body">内容区域</p>
  8 |                 <div class="custom-phone-footer">
  9 |                     <ul class="pre_menu_list">
 10 |                         <li class="jsMenu pre_menu_item "
 11 |                             v-bind:class="{ selected: zindex == index , active: zindex == index&&subZindex ==-1 }"
 12 |                             v-for="item,index in menu.button">
 13 |                             <a href="javascript:void(0);" class="custom-a-button pre_menu_link"
 14 |                                v-on:click="selectedMenuItem(index)">
 15 |                                 <?php echo"{{ item.name }}" ?>
 16 |                             </a>
 17 |                             <div class="sub_pre_menu_box">
 18 |                                 <ul class="sub_pre_menu_list">
 19 |                                     <li class="sub_pre_menu_item" v-bind:class="{ active: subZindex == v }"
 20 |                                         v-if="item.sub_button && item.sub_button.length" v-for="subItem,v in item.sub_button">
 21 |                                         <a href="javascript:void(0);" class="custom-a-button sub_pre_menu_link"
 22 |                                            v-on:click="selectedSubMenuItem(v)">
 23 |                                             <?php echo"{{ subItem.name }}" ?>
 24 |                                         </a>
 25 |                                     </li>
 26 |                                     <li class="sub_pre_menu_item" v-if="!item.sub_button || item.sub_button.length < 5">
 27 |                                         <a href="javascript:void(0);" class="custom-a-button" title="最多添加五个菜单"
 28 |                                            v-on:click="addMenuHandler(1)">
 29 |                                             <i class="custom-svg-size">
 30 |                                             </i>
 31 |                                         </a>
 32 |                                     </li>
 33 |                                 </ul>
 34 |                                 <i class="arrow arrow_out"></i>
 35 |                                 <i class="arrow arrow_in"></i>
 36 |                             </div>
 37 |                         </li>
 38 |                         <li class="pre_menu_item" v-if="menu.button.length < 3">
 39 |                             <a href="javascript:void(0);" class="custom-a-button" title="最多添加三个菜单" v-on:click="addMenuHandler(0)">
 40 |                                 <i class="custom-svg-size">
 41 |                                 </i>
 42 |                             </a>
 43 |                         </li>
 44 |                     </ul>
 45 |                 </div>
 46 |             </div>
 47 |         </div>
 48 |         <div class="col-md-8">
 49 |             <div class="custom-edit-menu">
 50 |           <span class="custom-editor_arrow_wrp">
 51 |             <i class="editor_arrow editor_arrow_out"></i>
 52 |             <i class="editor_arrow editor_arrow_in"></i>
 53 |           </span>
 54 |                 <div v-if="zindex>=0">
 55 |                     <div class="row custom-editor-title">
 56 |                         <h2 class="col-md-10">编辑菜单</h2>
 57 |                         <a class="col-md-2" href="javascript:void(0);" v-on:click="removeMenuHandler">删除菜单</a>
 58 |                     </div>
 59 |                     <div class="form-horizontal">
 60 |                         <div class="form-group">
 61 |                             <label class="col-sm-2 control-label">菜单名称：</label>
 62 |                             <div class="col-sm-10">
 63 |                                 <input type="text" class="form-control" v-model.trim="nowItem.name" placeholder="请输入菜单名称" />
 64 |                             </div>
 65 |                         </div>
 66 |                         <div v-if="!nowItem.sub_button||!nowItem.sub_button.length">
 67 |                             <div class="form-group">
 68 |                                 <label class="col-sm-2 control-label">菜单类型：</label>
 69 |                                 <div class="col-sm-10">
 70 |                                     <div class="radio menu-type-select" v-for="item,index in menuTypeList">
 71 |                                         <label :for="index">
 72 |                                             <input type="radio" name="menuType" v-model="nowItem.type" :id="index"
 73 |                                                    v-on:click="selectedMenuType(item.value)" :value="item.value" />
 74 |                                             <?php echo"{{ item.label }}" ?>
 75 |                                         </label>
 76 |                                     </div>
 77 |                                 </div>
 78 |                             </div>
 79 | 
 80 |                             <div class="form-group">
 81 |                                 <label for="inputEmail3" class="col-sm-2 control-label"></label>
 82 |                                 <div class="col-sm-10">
 83 |                                     <div class="custom-panel-default" v-if='nowItem.type == "miniprogram" '>
 84 |                                         <div class="form-group">
 85 |                                             <label class="col-sm-2 control-label">小程序路径：</label>
 86 |                                             <p class="col-sm-9">
 87 |                                                 <input type="text" class="form-control" v-model="nowItem.pagepath" placeholder="请输入小程序路径" />
 88 |                                             </p>
 89 |                                         </div>
 90 |                                         <div class="form-group">
 91 |                                             <label class="col-sm-2 control-label">备用链接：</label>
 92 |                                             <p class="col-sm-9">
 93 |                                                 <input type="text" v-model="nowItem.url" class="form-control" placeholder="请输入备用的地址" />
 94 |                                             </p>
 95 |                                         </div>
 96 |                                         <div class="form-group">
 97 |                                             <label class="col-sm-2 control-label">AppId：</label>
 98 |                                             <p class="col-sm-9">
 99 |                                                 <input type="text" v-model="nowItem.appid" class="form-control" placeholder="请输入小程序appId" />
100 |                                             </p>
101 |                                         </div>
102 |                                     </div>
103 |                                     <div class="custom-panel-default" v-else-if='nowItem.type == "view" '>
104 |                                         <div class="form-group">
105 |                                             <label class="col-sm-2 control-label">跳转地址：</label>
106 |                                             <p class="col-sm-9">
107 |                                                 <input type="text" class="form-control" v-model="nowItem.url" placeholder="跳转地址" />
108 |                                             </p>
109 |                                         </div>
110 |                                     </div>
111 |                                     <div class="custom-panel-default" v-else>
112 |                                         <div class="form-group">
113 |                                             <label class="col-sm-2 control-label">事件KEY：</label>
114 |                                             <p class="col-sm-9">
115 |                           <textarea type="text" class="form-control" v-model="nowItem.key"
116 |                                     placeholder="用户点击时，需传给后端的事件KEY"></textarea>
117 |                                             </p>
118 |                                         </div>
119 |                                     </div>
120 |                                 </div>
121 |                             </div>
122 |                         </div>
123 | 
124 |                         <div class="form-group">
125 |                             <label class="col-sm-2 control-label"></label>
126 |                             <div class="col-sm-10">
127 |                                 <button type="button" class="btn btn-primary submit-button" v-on:click="confirmEditor">
128 |                                     确认修改
129 |                                 </button>
130 |                                 <div class="custom-toast" if='toastMsg!=""'>
131 |                                     <?php echo"{{ toastMsg }}" ?>
132 |                                 </div>
133 |                             </div>
134 |                         </div>
135 |                     </div>
136 |                 </div>
137 |                 <p v-else class="editor-handler-tips">请选择左侧菜单</p>
138 |             </div>
139 |         </div>
140 |     </div>
141 |     <input type="hidden" id="{{$id}}_input" name="{{$name}}" v-model="resultJson" />
142 | 
143 | </div>
144 | 
145 | 
146 | <script>
147 |     var initJson = <?php echo $value ?>;
148 |     $(document).ready(function(){
149 |         VueInit(initJson, function (data) {
150 |             console.log(data);
151 |         },"#{{$id}}");
152 |     })
153 | </script>
154 | 


--------------------------------------------------------------------------------