{layout name="layout/food" /}

<div class="row-content am-cf">

    <div class="row">

        <div class="am-u-sm-12 am-u-md-12 am-u-lg-12">

            <div class="widget am-cf">

                <form id="myform" class="am-form tpl-form-line-form" method="post">
                    <fieldset>
                        <div class="widget-head am-cf">
    
                            <div class="widget-title am-fl">用户中心设置</div>
        
                        </div>
                        <div class="widget-body">
							<div class="am-form-group">

                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">会员卡 </label>

                                <div class="am-u-sm-9 am-u-end">

                                	<label class="am-radio-inline">

                                        <input type="radio" v-model="model.vip" name="data[vip]" value="1" data-am-ucheck>
                                        显示

                                    </label>
                                    <label class="am-radio-inline">
                                        <input type="radio" v-model="model.vip" name="data[vip]" value="0" data-am-ucheck>
                                        隐藏
                                    </label>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">权限设置 </label>
                                <div class="am-u-sm-9 am-u-end">
                                	<label class="am-radio-inline">
                                        <input type="radio" v-model="model.setting" name="data[setting]" value="1" data-am-ucheck>
                                        显示
                                    </label>
                                    <label class="am-radio-inline">
                                        <input type="radio" v-model="model.setting" name="data[setting]" value="0" data-am-ucheck>
                                        隐藏
                                    </label>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">商家助手 </label>
                                <div class="am-u-sm-9 am-u-end">
                                	<label class="am-radio-inline">
                                        <input type="radio" v-model="model.helper" name="data[helper]" value="1" data-am-ucheck>
                                        显示
                                    </label>
                                    <label class="am-radio-inline">
                                        <input type="radio" v-model="model.helper" name="data[helper]" value="0" data-am-ucheck>
                                        隐藏
                                    </label>
                                </div>
                            </div>
                            <div class="am-form-group">
                                <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">联系我们 </label>
                                <div class="am-u-sm-9 am-u-end">
                                	<label class="am-radio-inline">
                                        <input type="radio" v-model="model.contact.is_open" name="data[contact][is_open]" value="1" data-am-ucheck>
                                        显示
                                    </label>
                                    <label class="am-radio-inline">
                                        <input type="radio" v-model="model.contact.is_open" name="data[contact][is_open]" value="0" data-am-ucheck>
                                        隐藏
                                    </label>
                                </div>
                            </div>
                            <div v-if="model.contact.is_open == 1">
                                <div class="am-form-group">
                                    <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require">联系方式 </label>
                                    <div class="am-u-sm-9 am-u-end">
                                    	<label class="am-radio-inline">
                                            <input type="radio" v-model="model.contact.type" name="data[contact][type]" value="wechat" data-am-ucheck>
                                            微信客服
                                        </label>
                                        <label class="am-radio-inline">
                                            <input type="radio" v-model="model.contact.type" name="data[contact][type]" value="phone" data-am-ucheck>
                                            电话号码
                                        </label>
                                    </div>
                                </div>
                                <div v-if="model.contact.type == 'phone'" class="am-form-group">
                                    <label class="am-u-sm-3 am-u-lg-2 am-form-label form-require"> 电话号码 </label>
                                    <div class="am-u-sm-9 am-u-end">
                                        <input type="text" class="tpl-form-input" v-model="model.contact.phone"  name="data[contact][phone]" placeholder="请输入联系电话" required>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="am-form-group">
                            <label class="am-u-sm-3 am-u-lg-2 am-form-label">菜单列表</label>
                            <div class="am-u-sm-9 am-u-end">
                                <div style="padding-bottom:20px">
                                    <button type="button" class="hema-add am-btn am-btn-primary am-radius am-btn-xs">
                                        <i class="am-icon-plus"></i> 添加菜单
                                    </button>
                                </div>
                                <div v-if="model.menu.length > 0">
                                    <table width="100%" class="am-table am-table-hover tpl-table-black">
                                        <thead>
                                        <tr>
                                            <th>编号</th>
                                            <th>图标</th>
                                            <th>标题</th>
                                            <th>链接</th>
                                            <th>排序</th>
                                            <th>操作</th>
                                        </tr>
                                        </thead>
                                        <tbody>
                                            <tr v-for="(item,index) in model.menu">
                                                <td class="am-text-middle">{{index+1}}</td>
                                                <td class="am-text-middle">
                                                    <img :src="item.logo" width="50" height="50" alt="菜单图标">
                                                </td>
            									<td class="am-text-middle">{{item.title}}</td>
            									<td class="am-text-middle">{{item.path}}</td>
            									<td class="am-text-middle">{{item.sort}}</td>
                                                <td class="am-text-middle">
                                                    <div class="tpl-table-black-operation">
                                                        <a href="javascript:;" class="hema-edit" 
                                                        :data-index="index"
                                                        :data-logo="item.logo"
                                                        :data-title="item.title"
                                                        :data-path="item.path"
                                                        :data-sort="item.sort">
                                                            <i class="am-icon-pencil"></i> 编辑
                                                        </a>
                                                        <a href="javascript:;" class="hema-del tpl-table-black-operation-del" 
                                                        :data-id="index">
                                                            <i class="am-icon-trash"></i> 删除
                                                        </a>
                                                    </div>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div class="am-form-group">
    
                            <div class="am-u-sm-9 am-u-sm-push-2 am-margin-top-lg">
    
                                <button type="submit" class="j-submit am-btn am-btn-secondary">提交
    
                                </button>
    
                            </div>
    
                        </div>
                    </fieldset>
                </form>

            </div>

        </div>

    </div>

</div>
<!-- 图片文件列表模板 -->
{include file="../addons/upload/view/template/tpl_file_item_url.html" /}
<!-- 文件库弹窗 -->
{include file="../addons/upload/view/template/file_library.html" /}
{include file="food/applet/center/add" /}
{include file="food/applet/center/edit" /}
<script src="/assets/plugins/vue/vue.min.js?v={$version}"></script>
<script>
    $(function () {
        new Vue({
		  el: '#myform',
		  data: {
            model: <?= json_encode($model) ?>
		  }
		});
		$('.hema-add').on('click', function () {
            $.showAction({
                title: '添加', 
                area: '750px', 
                content: template('tpl-add', {}), 
                uCheck: true, 
                success: function ($content) {
                    // 选择图片
                    $('.upload-file').selectImages({
                        name: 'data[logo]'
                    });
                    $('#my-form').formPost({
                        url: "{:url('food.applet.center/add')}"
                    });
                }, 
                btn2: function ($content) {
                    return true;
                }
            });
        });     
        //编辑
        $('.hema-edit').on('click', function () {
            var data = $(this).data();
            console.log(data);
            $.showAction({
                title: '编辑', 
                area: '750px', 
                content: template('tpl-edit', {menu:data}), 
                uCheck: true, 
                success: function ($content) {
                    // 选择图片
                    $('.upload-file').selectImages({
                        name: 'data[logo]'
                    });
                    $('#my-form').formPost({
                        url: "{:url('food.applet.center/edit')}?index=" + data.index
                    });
                }, 
                btn2: function ($content) {
                    return true;
                }
            });
        });
        // 删除元素
        var url = "{:url('food.applet.center/delete')}";
        $('.hema-del').del('id', url);
		$('#myform').formPost();
    });
</script>