Heim > Web-Frontend > Layui-Tutorial > Einführung in das Hintergrundlayout von Django + Layui

Einführung in das Hintergrundlayout von Django + Layui

Freigeben: 2019-12-23 17:45:39
nach vorne
4760 Leute haben es durchsucht

Einführung in das Hintergrundlayout von Django + Layui

Layui-Hintergrundlayout:

1. Obere Seitenleiste des Hintergrundlayouts

<div class="layui-header">
        <div class="layui-logo">layui 后台布局</div>
        <!-- 头部区域(可配合layui已有的水平导航) -->
        <ul class="layui-nav layui-layout-left">
            <li class="layui-nav-item"><a href="">控制台</a></li>
            <li class="layui-nav-item"><a href="">商品管理</a></li>
            <li class="layui-nav-item"><a href="">用户</a></li>
            <li class="layui-nav-item">
                <a href="javascript:;">其它系统</a>
                <dl class="layui-nav-child">
                    <dd><a href="">邮件管理</a></dd>
                    <dd><a href="">消息管理</a></dd>
                    <dd><a href="">授权管理</a></dd>
                </dl>
            </li>
        </ul>
        <ul class="layui-nav layui-layout-right">
            <li class="layui-nav-item">
                <a href="javascript:;">
                    <img  src="http://t.cn/RCzsdCq" class="layui-nav-img" alt="Einführung in das Hintergrundlayout von Django + Layui" >
                    {{request.user.username}}
                </a>
                <dl class="layui-nav-child">
                    <dd><a href="">基本资料</a></dd>
                    <dd><a href="">安全设置</a></dd>
                </dl>
            </li>
            <li class="layui-nav-item"><a href="">退了</a></li>
        </ul>
    </div>
Nach dem Login kopieren

Die Zeile mit orangem Hintergrund im Code ist der aktuell übergebene Login an Django Der Benutzername des Benutzers.

Der endgültige Effekt ist wie folgt:

Einführung in das Hintergrundlayout von Django + Layui

2. Seitenleiste des Hintergrundlayouts

Die Seitenleiste muss Knoten und Unter- Knoten. Daher müssen Sie zuerst das Modell der Knoten und Unterknoten in Django erstellen. Der Modellcode lautet wie folgt:

# 节点类
class NavigationProfile(models.Model):
    name=models.CharField(max_length=20,verbose_name=&#39;节点名称&#39;)
    url=models.CharField(max_length=50,verbose_name=&#39;链接地址&#39;)
    iconCls=models.CharField(max_length=50,verbose_name=&#39;图标icon&#39;)

    class Meta:
        verbose_name=&#39;节点名称&#39;
        verbose_name_plural=verbose_name

    def __str__(self):
        return self.name

# 子节点类
class NavigationSubProfile(models.Model):
    name=models.CharField(max_length=20,verbose_name=&#39;子节点名称&#39;)
    url=models.CharField(max_length=50,verbose_name=&#39;链接地址&#39;)
    iconCls=models.CharField(max_length=50,verbose_name=&#39;图标icon&#39;)
    parent=models.ForeignKey(NavigationProfile,on_delete=models.CASCADE,verbose_name=&#39;父节点&#39;)

    class Meta:
        verbose_name=&#39;子节点名称&#39;
        verbose_name_plural=verbose_name

    def __str__(self):
        return self.name
Nach dem Login kopieren

Der Django-URL-Code lautet wie folgt:

def open_index(request):
    if request.user.is_authenticated == False:
        return HttpResponseRedirect(&#39;/account/login/&#39;)
    else:
        navigation = NavigationProfile.objects.all()
        dict = []

        for nav in navigation:
            dic = {}
            id = nav.id
            dic[&#39;id&#39;] = nav.id
            dic[&#39;text&#39;] = nav.name
            dic[&#39;url&#39;] = nav.url
            dic[&#39;iconCls&#39;] = nav.iconCls
            dic[&#39;nid&#39;] = 0
            sub_navigation = NavigationSubProfile.objects.filter(parent_id=id)

            sub_dict = []
            for sub_nav in sub_navigation:
                sub_dic = {}
                sub_dic[&#39;id&#39;] = sub_nav.id
                sub_dic[&#39;text&#39;] = sub_nav.name
                sub_dic[&#39;url&#39;] = sub_nav.url
                sub_dic[&#39;iconCls&#39;] = sub_nav.iconCls
                sub_dic[&#39;nid&#39;] = sub_nav.parent_id
                sub_dict.append(sub_dic)

            dic["children"] = sub_dict
            dict.append(dic)30         return render(request,&#39;index.html&#39;,{&#39;dict&#39;:dict})
Nach dem Login kopieren

Der HTML-Sidebar-Code lautet wie folgt:

 urlpatterns = [
     path(&#39;get-navigationProfile/&#39;,views.get_navigationProfile,name=&#39;get_navigationProfile&#39;),
 ]
Nach dem Login kopieren

Endgültiges Rendering

Einführung in das Hintergrundlayout von Django + LayuiWeitere Informationen Wenn Sie über Laui-Kenntnisse verfügen, beachten Sie bitte die Spalte

Tutorial zur Verwendung von Lauii

.

Das obige ist der detaillierte Inhalt vonEinführung in das Hintergrundlayout von Django + Layui. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:cnblogs.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage