需求:
1:查看当前的语音视频频道的队列状况
2:获取到临时的语音视频用户名
3:跳转到指定的语音聊天房间
lc/Pyfile/Pywebback/app/yuyin/templates/zhuye/base.html
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0" /><title>{% block title %}语音主页{% endblock %}</title>
</head>
<body class="bg-gray-1200 text-white"><div>{% block content %}{% endblock %}</div><!-- <div class="max-w-4xl mx-auto py-8 px-4"></div> -->
</body>
</html>
lc/Pyfile/Pywebback/app/yuyin/templates/zhuye/zhuye.html
{% extends "zhuye/base.html" %}{% block title %}替换掉base中的title{% endblock %}<!-- 插入各个html 这里就是设置整个页面的主题 -->
{% block content %}<!-- 页面上部分显示 语音列表中的繁忙程度-->{% include "zhuye/yuyin_list.html" %}<!-- 获取验证码 -->{% include "zhuye/getcode.html" %}<!-- 进入语音按钮 -->{% include "zhuye/get_voice.html" %}
{% endblock %}
lc/Pyfile/Pywebback/app/yuyin/templates/zhuye/yuyin_list.html
{% load static %} <!-- 加载静态文件标签 -->
<link rel="stylesheet" href="{% static 'test/yuyin/yuyin_list.css' %}"> <!-- 引用CSS文件 -->
<!-- 获取频道排队数据列表 -->
<script src="{% static 'test/yuyin/get_channel_list.js' %}"></script><div><div>视频语音频道列表</div><div><span>语音频道1</span><span>排队人数:</span><span id="audio1-queue">(当前排队的人数数量)</span></div><div><span>语音频道2</span><span>排队人数:</span><span id="audio2-queue">(当前排队的人数数量)</span></div><div><span>视频语音频道3</span><span>排队人数:</span><span id="video1-queue">(当前排队的人数数量)</span></div><div><span>视频语音频道4</span><span>排队人数:</span><span id="video2-queue">(当前排队的人数数量)</span></div>
</div>
<hr>
<div class="container4"><div><span>语音频道1</span><span>排队人数:</span><span id="audio1-queue-summary">(当前排队的人数数量)</span><p>排队列表</p><div id="audio1-queue-list"></div></div><div><span>语音频道2</span><span>排队人数:</span><span id="audio2-queue-summary">(当前排队的人数数量)</span><p>排队列表</p><div id="audio2-queue-list"></div></div><div><span>视频语音频道3</span><span>排队人数:</span><span id="video1-queue-summary">(当前排队的人数数量)</span><p>排队列表