shishichen
/
qimall


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458
							<?php

/**
 * @var \yii\web\View $this
 * @var string $content
 */

use common\helpers\ComponentHelper;

$isAdmin = false;
$isSuperAdmin = false;

try {
    $this->title  = \Yii::$app->services->setting->get('system.name');
} catch (Exception $exception) {
}
$currentRoute = Yii::$app->controller->route;
function importComponent($component, $path = __DIR__)
{
    return file_get_contents($path . '/' . $component . '.php');
}

?>
<?php $this->beginPage(); ?>
<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0">
    <meta name="format-detection" content="telephone=no,email=no,address=no">
    <title><?= $this->title ? ($this->title . ' - ') : '' ?>商城管理</title>
    <!-- <link rel="stylesheet" href="https://unpkg.zhimg.com/element-ui@2.15.13/lib/theme-chalk/index.css"> -->
    <link rel="stylesheet" href="/resources/unpkg/element-ui@2.15.14/lib/theme-chalk/index.css">
    <link rel="stylesheet" href="/resources/css/flex.css">
    <link rel="stylesheet" href="/resources/css/qimall.css?t=<?= Yii::$app->params['css_cache_time'] ?>"">

    <link href=" /../favicon.ico" mce_href="/../favicon.ico" rel="shortcut icon" />
    <script>
        let _layout = null;
        let _aside = null;
        const _csrf = '<?= Yii::$app->request->csrfToken ?>';
        const _scriptUrl = '<?= Yii::$app->request->scriptUrl ?>';
        const _baseUrl = '<?= \Yii::$app->request->hostInfo . \Yii::$app->request->baseUrl ?>';
        const _requestRoute = '<?= Yii::$app->requestedRoute ?>';
        let _isWe7 = 'false';
        let _isInd = 'true';
        let _isAdmin = <?= $isAdmin ? 'true' : 'false' ?>;
        let _isSuperAdmin = <?= $isSuperAdmin ? 'true' : 'false' ?>;
        let currentRoute = "<?= $currentRoute ?>"
        let _diy_img_prefix = "<?= Yii::getAlias('@attachurl') ?>";
    </script>
    <script src="/resources/unpkg/jquery@3.3.1/dist/jquery.min.js"></script>
    <script src="/resources/unpkg/vue@2.6.10/dist/vue.js"></script>
    <script src="/resources/js/vueInit.js?t=<?= Yii::$app->params['js_cache_time'] ?>"></script>
    <!-- <script src="https://unpkg.zhimg.com/element-ui@2.15.13/lib/index.js"></script> -->
    <script src="/resources/unpkg/element-ui@2.15.14/lib/index.js"></script>
    <script src="/resources/unpkg/qs@6.5.2/dist/qs.js"></script>
    <script src="/resources/unpkg/axios@0.18.0/dist/axios.min.js"></script>
    <script src="/resources/unpkg/clipboard@1.0.0/dist/clipboard.min.js"></script>
    <script src="/resources/unpkg/dom-to-image@2.6.0/dom-to-image.js"></script>
    <script src="/resources/unpkg/vue-line-clamp@1.2.4/dist/vue-line-clamp.umd.js"></script>
    <script src="/resources/js/common.js?t=<?= Yii::$app->params['js_cache_time'] ?>"></script>
    <script src="/resources/js/dayjs.min.js"></script>
    <script src="/resources/js/echarts.min.js"></script>
    <script type="text/javascript" src="/resources/js/china.js"></script>
    <script type="text/javascript" src="/resources/js/world.js"></script>
    <script type="text/javascript" src="/resources/js/bmap.min.js"></script>
    <script src="/resources/js/qrcode.min.js"></script>
    <style>

    </style>
</head>
<?= ComponentHelper::loadComponentView('com-attachment') ?>
<?= ComponentHelper::loadComponentView('com-gallery') ?>
<?= ComponentHelper::loadComponentView('com-attachment') ?>
<?= ComponentHelper::loadComponentView('com-gallery') ?>
<?= ComponentHelper::loadComponentView('com-pick-link') ?>
<?= ComponentHelper::loadComponentView('com-upload') ?>
<?= ComponentHelper::loadComponentView('com-upload-oss') ?>
<?= ComponentHelper::loadComponentView('com-list-page') ?>
<?= ComponentHelper::loadComponentView('com-list-table') ?>

<body>
    <?php $this->beginBody() ?>
    <div id="_layout"></div>
    <div class="el-container">

        <div v-cloak id="_aside" flex="dir:left">
            <!--            <div @click="isShowMenu = true" v-if="!isShowMenu" class="is-show-menu-2">>></div>-->
            <div @click="isShowMenu = true" v-if="!isShowMenu" class="is-show-menu-2">
                <i class="el-icon-s-unfold"></i>
            </div>
            <!-- 一级菜单 -->
            <div class="left-menu left-menu-1">
                <div class="aside-logo" flex="main:center cross:center">
                    管理中心
                </div>
                <div @click="menuClick1(leftMenu)" v-for="leftMenu in leftMenus" :key="leftMenu.id" class="menu-item menu-item-1" :class="{'active': currentMenu.opened_1 == leftMenu.id || currentMenu.temporary_opened_1 == leftMenu.id ? true : false,
                 'hover':currentMenu.temporary_opened_1 == leftMenu.id && currentMenu.opened_1 != leftMenu.id ? true : false }" flex="dir:left cross:center">
                    <i :class="leftMenu.icon" style="margin-right: 5px;"></i>
                    {{leftMenu.title}}
                </div>
            </div>
        </div>
        <div id="_layout_body" class="el-container is-vertical">
            <!-- 顶部工具栏 组件 -->
            <?= importComponent('header'); ?>
            <div id="_header">
                <mall-header></mall-header>
            </div>
            <!-- style="height: 100%;" -->
            <div id="_main" flex ref="_main">
                <div v-cloak id="_aside_2" ref="asideTwo">
                    <!-- 二级菜单 -->
                    <transition name="slide">
                        <div v-if="!_aside.overview && currentMenu.list && currentMenu.list.children && currentMenu.list.children.length > 0 && _aside.isShowMenu" @mouseenter="_aside.mouseenterEvent2()" @mouseleave="_aside.mouseleaveEvent2()" class="left-menu left-menu-2" :class="{'left-menu-2-show': !_aside.isShowMenu}">
                            <!-- 展示收起按钮 -->
                            <div @click="_aside.isShowMenu = false" v-if="_aside.isShowMenu" class="is-show-menu-1">
                                <i class="el-icon-s-fold"></i>
                            </div>
                            <div class="menu-item menu-item-2-title" flex="dir:left cross:center">
                                {{currentMenu.list.title}}

                            </div>
                            <div v-for="menu_1 in currentMenu.list.children" :key="menu_1.id" flex="dir:top">
                                <div @click="_aside.menuClick2(menu_1)" class="menu-item menu-item-2" :class="{'active': currentMenu.opened_2 == menu_1.id ? true : false}" flex="dir:left cross:center">
                                    <div class="menu-item-box" flex="dir:left cross:center">
                                        <div class="icon-box">
                                            <div v-if="menu_1.children">
                                                <i v-if="currentMenu.unfold_id_1 == menu_1.id" class="el-icon-arrow-down"></i>
                                                <i v-else class="el-icon-arrow-right"></i>
                                            </div>
                                        </div>
                                        {{menu_1.title}}

                                    </div>
                                </div>

                                <!-- 三级菜单 -->
                                <div v-if="currentMenu.unfold_id_1 == menu_1.id && menu_1.children" v-for="menu_2 in menu_1.children" :key="menu_2.id" flex="dir:top">
                                    <div @click="_aside.menuClick3(menu_2)" class="menu-item menu-item-3" :class="{'active': currentMenu.opened_3 == menu_2.id ? true : false}" flex="dir:left cross:center">
                                        <div class="menu-item-box" flex="dir:left cross:center">
                                            <div class="icon-box">
                                                <div v-if="menu_2.children">
                                                    <i v-if="currentMenu.unfold_id_2 == menu_2.id" class="el-icon-arrow-down"></i>
                                                    <i v-else class="el-icon-arrow-right"></i>
                                                </div>
                                            </div>
                                            {{menu_2.title}}

                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </transition>
                </div>

                <!-- 主页面部分 -->
                <main class="el-main" style="background: #f3f3f3">
                    <?= $content ?>
                    <!-- <components :is='content'></components> -->
                </main>

            </div>
        </div>

    </div>
    <script>
        _layout = new Vue({
            el: '#_layout',
            created() {},
        });
        _aside = new Vue({
            el: '#_aside',
            data() {
                return {
                    mall: null,
                    leftMenuLoading: false,
                    leftMenus: {},
                    defaultRoute: null,
                    currentMenu: {
                        list: null,
                        opened_1: 0,
                        temporary_opened_1: 0,
                        opened_2: 0,
                        opened_3: 0,
                        unfold_id_1: 0,
                        unfold_id_2: 0,
                    },
                    currentRoute: "<?= $currentRoute ?>",
                    isShowMenu: true,
                    overview: false
                };
            },
            methods: {

                getMenus() {
                    const cacheKey = 'admin_menus'; //缓存key
                    let data = localStorage.getItem(cacheKey);
                    if (data) {
                        try {
                            data = JSON.parse(data);
                        } catch (e) {
                            data = false;
                        }
                    }
                    if (data && data.menus) {
                        this.leftMenus = data.menus;
                    } else {
                        this.leftMenuLoading = true;
                    }
                    this.currentMenu.opened_1 = localStorage.getItem('open_menu_1_id');
                    this.currentMenu.opened_2 = localStorage.getItem('open_menu_2_id');
                    this.currentMenu.opened_3 = localStorage.getItem('open_menu_3_id');
                    this.currentMenu.unfold_id_1 = localStorage.getItem('unfold_id_1');
                    this.currentMenu.unfold_id_2 = localStorage.getItem('unfold_id_2');
                    this.setMenus();

                    let self = this;
                    /**优化点：只在首页请求最新菜单其他页面不需要再次请求 */
                    if (this.leftMenuLoading == true) {
                        this.$request({
                            params: {
                                r: 'common/menu/list',
                                route: getQuery('r')
                            },
                            method: 'get'
                        }).then(e => {
                            // 设置缓存
                            localStorage.setItem(cacheKey, JSON.stringify(e.data.data));
                            self.leftMenuLoading = false;
                            self.leftMenus = e.data.data.menus;
                            // 这里遍历侧边导航数组
                            self.leftMenus.forEach(function(item) {
                                if (item.is_active) {
                                    self.currentMenu.opened_1 = item.id;
                                    localStorage.setItem('open_menu_1_id', self.currentMenu.opened_1);
                                    if (item.children) {
                                        item.children.forEach(function(cItem1) {
                                            if (cItem1.is_active) {
                                                if (cItem1.children) {
                                                    self.currentMenu.unfold_id_1 = cItem1.id;
                                                    localStorage.setItem('unfold_id_1', self.currentMenu.unfold_id_1);
                                                    cItem1.children.forEach(function(cItem2) {
                                                        if (cItem2.is_active) {
                                                            if (cItem2.children) {
                                                                self.currentMenu.unfold_id_2 = cItem2.id;
                                                                localStorage.setItem('unfold_id_2', self.currentMenu.unfold_id_2);
                                                                cItem2.children.forEach(function(cItem3) {
                                                                    if (cItem3.is_active) {
                                                                        self.currentMenu.opened_2 = cItem3.id;
                                                                        localStorage.setItem('open_menu_2_id', self.currentMenu.opened_2);
                                                                    }
                                                                })
                                                            } else {
                                                                self.currentMenu.opened_2 = cItem2.id;
                                                                localStorage.setItem('open_menu_2_id', self.currentMenu.opened_2);
                                                            }
                                                        }
                                                    })
                                                } else {
                                                    self.currentMenu.opened_2 = cItem1.id;
                                                    localStorage.setItem('open_menu_2_id', self.currentMenu.opened_2);
                                                }
                                            }
                                        })
                                    }
                                }
                            });
                            self.setMenus();
                        }).catch(e => {
                            console.log(e);
                        });

                    }
                },

                openUrl(menu) {
                    localStorage.setItem('unfold_id_1', this.currentMenu.unfold_id_1);
                    localStorage.setItem('unfold_id_2', this.currentMenu.unfold_id_2);
                    if (menu) {
                        let args = {
                            r: menu.url
                        };
                        if (menu.params) {
                            for (let i in menu.params) {
                                args[i] = menu.params[i];
                            }
                        }
                        navigateTo(args)
                    }
                },
                setMenus() {
                    let self = this;
                    if (!self.currentMenu.opened_2 && !self.currentMenu.unfold_id_1) {
                        self.currentMenu.opened_1 = 0;
                    }

                    if (self.leftMenus && self.leftMenus.length > 0) {
                        self.leftMenus.forEach(function(item) {
                            if (item.id == self.currentMenu.opened_1) {
                                self.currentMenu.list = item;
                            }
                        });
                    }
                },
                // 点击一级菜单
                menuClick1(menu) {
                    this.clearMenuStorage();
                    this.currentMenu.opened_1 = menu.id;
                    this.currentMenu.list = menu;
                    localStorage.setItem('open_menu_1_id', menu.id);
                    console.log(menu);

                    if (!menu.children) {


                        this.openUrl(menu);
                    } else {
                        if (menu.key == 'app-manage') {
                            return
                        }
                        if (menu.children[0].children && menu.children[0].children.length > 0) {
                            this.openUrl(menu.children[0].children[0]);
                            localStorage.setItem('unfold_id_1', menu.children[0].id);
                            localStorage.setItem('open_menu_3_id', menu.children[0].children[0].id);
                        } else {
                            this.openUrl(menu.children[0]);
                            localStorage.setItem('open_menu_2_id', menu.children[0].id);
                        }
                    }
                },
                // 点击二级菜单
                menuClick2(menu) {
                    if (menu.children) {
                        let unfoldId1 = null;
                        if (this.currentMenu.unfold_id_1 == menu.id) {
                            unfoldId1 = 0;
                        } else {
                            unfoldId1 = menu.id;
                        }
                        this.currentMenu.unfold_id_1 = unfoldId1;
                    } else {
                        this.currentMenu.opened_2 = menu.id;
                        let temporary = this.currentMenu.temporary_opened_1;
                        if (temporary) {
                            localStorage.setItem('open_menu_1_id', temporary);
                        }
                        localStorage.setItem('open_menu_2_id', menu.id);
                        localStorage.setItem('open_menu_3_id', 0);
                        this.openUrl(menu);
                    }
                },
                // 点击三级菜单
                menuClick3(menu) {
                    if (menu.children) {
                        let unfoldId2 = null;
                        if (this.currentMenu.unfold_id_2 == menu.id) {
                            unfoldId2 = 0;
                        } else {
                            unfoldId2 = menu.id;
                        }
                        this.currentMenu.unfold_id_2 = unfoldId2;
                    } else {
                        this.currentMenu.opened_3 = menu.id;
                        let temporary = this.currentMenu.temporary_opened_1;
                        if (temporary) {
                            localStorage.setItem('open_menu_1_id', temporary);
                        }
                        localStorage.setItem('open_menu_2_id', 0);
                        localStorage.setItem('open_menu_3_id', menu.id);
                        this.openUrl(menu);
                    }
                },
                clearMenuStorage() {
                    localStorage.removeItem('open_menu_1_id');
                    localStorage.removeItem('open_menu_2_id');
                    localStorage.removeItem('open_menu_3_id');
                    localStorage.removeItem('unfold_id_1');
                    localStorage.removeItem('unfold_id_2');
                },
                mouseenterEvent2() {
                    let self = this;
                    if (self.currentMenu.temporary_opened_1 > 0) {
                        self.leftMenus.forEach(function(item) {
                            if (self.currentMenu.temporary_opened_1 === item.id) {
                                self.currentMenu.list = item;
                            }
                        })
                    }
                },
                mouseleaveEvent2() {
                    let self = this;
                    self.currentMenu.temporary_opened_1 = 0;
                    self.leftMenus.forEach(function(item) {
                        if (item.id === self.currentMenu.opened_1) {
                            self.currentMenu.list = item;
                        }
                    });
                    self.currentMenu.unfold_id_1 = localStorage.getItem('unfold_id_1');
                    self.currentMenu.unfold_id_2 = localStorage.getItem('unfold_id_2');
                    if (this.currentMenu.opened_1 <= 0) {
                        this.currentMenu.list = {};
                    }
                },
                initHeight() {
                    // 获取html可视区域高度：--这里需要按F5
                    let clientHeight = `${document.documentElement.clientHeight}`;
                    let mainHeight = clientHeight - 64;
                    // 动态设置元素高度：
                    var main = document.getElementById('_main'); //获取元素存储在变量中
                    main.style.cssText = 'height: ' + mainHeight + 'px !important';
                }
            },
            mounted: function() {
                this.initHeight()
                this.onResizEvent = () => {
                    this.initHeight()
                }
                window.addEventListener('resize', this.onResizEvent)
                if (this.currentRoute === 'admin/mall/index') {
                    localStorage.removeItem('admin_menus');
                }
                this.getMenus();
            },
            destroyed() {
                window.removeEventListener('resize', this.onResizEvent)
            }
        });
        _header = new Vue({
            el: '#_header'
        });

        //二级导航
        _main = new Vue({
            el: '#_aside_2',
            data() {
                return {
                    currentMenu: _aside.currentMenu,
                }
            },
        });

        Vue.use(VueLineClamp, {
            importCss: true,
        });
    </script>
    <?php $this->endBody() ?>
</body>
<?= ComponentHelper::loadComponentView('com-image') ?>
<?= ComponentHelper::loadComponentView('com-ellipsis') ?>

</html>
<?php $this->endPage() ?>