53.Python-web框架-Django开始第一个应用的多语言

        针对上一篇的功能,本次仅对页面做了多语言,大家可以看看效果。

51.Python-web框架-Django开始第一个应用的增删改查-CSDN博客

目录

部门列表

新增部门

编辑部门

部门列表

源码

<!DOCTYPE html>
{% load static %}
{% load i18n %}
<html lang="en">
<head><meta charset="UTF-8"><title>{% trans "i18n.depart.Title" %}</title><link rel="stylesheet" href="{% static 'bootstrap5/css/bootstrap.min.css' %}"><script src="{% static 'bootstrap5/js/bootstrap.bundle.min.js' %}"></script><script src="{% static 'jquery-3.7.1.min.js' %}"></script>
</head>
<body>
<div class="container"><div style="margin: 10px 0"><a href="../depart/add/" class="btn btn-primary">{% trans "common.action.add" %}</a></div><table class="table table-striped  table-hover "><thead><tr><th scope="col">#</th><th scope="col">{% trans "i18n.depart.name" %}</th><th scope="col">{% trans "i18n.depart.description" %}</th><th scope="col">{% trans "i18n.depart.parent" %}</th><th scope="col">{% trans "common.is_active" %}</th><th scope="col">{% trans "common.is_locked" %}</th><th scope="col">{% trans "common.created_by" %}</th><th scope="col">{% trans "common.created_at" %}</th><th scope="col">{% trans "common.updated_by" %}</th><th scope="col">{% trans "common.updated_at" %}</th><th scope="col">{% trans "common.action" %}</th></tr></thead><tbody>{% for depart in departs %}<tr><td scope="row">{{ depart.id }}</td><td>{{ depart.name }}</td><td>{{ depart.description }}</td><td>{{ depart.parent }}</td><td>{{ depart.is_active }}</td><td>{{ depart.is_locked }}</td><td>{{ depart.created_by }}</td><td>{{ depart.created_at }}</td><td>{{ depart.updated_by }}</td><td>{{ depart.updated_at }}</td><td><a href="../depart/edit/?id={{depart.id}}" class="btn btn-primary btn-sm">{% trans "common.action.edit" %}</a><button id="deleteBtn" type="button"  class="btn btn-danger btn-sm  delete-btn"  data-id="{{ depart.id }}">{% trans "common.action.delete" %}</button ></td></tr>{% endfor %}</tbody></table><!-- 确认删除的模态框 -->
<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"><div class="modal-dialog" role="document"><div class="modal-content"><div class="modal-header"><h5 class="modal-title" id="exampleModalLabel">确认删除</h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button></div><div class="modal-body">确定要删除这条记录吗?</div><div class="modal-footer"><button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button><form id="deleteForm" method="post">{% csrf_token %}<input type="hidden" name="id" id="object_id"><button type="submit" class="btn btn-danger">确定删除</button></form></div></div></div>
</div><nav aria-label="Page navigation example"><ul class="pagination"><li class="page-item"><a class="page-link" href="#" aria-label="Previous"><span aria-hidden="true">&laquo;</span></a></li><li class="page-item"><a class="page-link" href="#">1</a></li><li class="page-item active" ><a class="page-link" href="#">2</a></li><li class="page-item"><a class="page-link" href="#">3</a></li><li class="page-item"><a class="page-link" href="#" aria-label="Next"><span aria-hidden="true">&raquo;</span></a></li></ul>
</nav>
</div>
</body>
<script>document.querySelectorAll('.delete-btn').forEach(button => {button.addEventListener('click', function() {const objectId = this.getAttribute('data-id');// 设置隐藏输入框的值document.getElementById('object_id').value = objectId;// 显示模态框$('#deleteModal').modal('show');});});// 提交删除表单时,使用Ajax发送请求$('#deleteForm').on('submit', function(event) {event.preventDefault(); // 阻止表单默认提交行为const formData = $(this).serialize(); // 序列化表单数据$.ajax({type: 'POST',url: '/depart/delete/', // 替换为你的删除视图URLdata: formData,success: function(response) {if (response.success) {// alert('删除成功!');location.reload(); // 刷新页面} else {alert('删除失败,请重试!');}},error: function(xhr, status, error) {console.error(error);alert('发生错误,请检查控制台日志。');}});});
</script>
</html>

外观

中文

英文

新增部门

源码

<!DOCTYPE html>
{% load static %}
{% load i18n %}
<html lang="en">
<head><meta charset="UTF-8"><title>{% trans "i18n.depart.Title" %}</title><link rel="stylesheet" href="{% static 'bootstrap5/css/bootstrap.min.css' %}">
</head>
<body><div class="container"><nav aria-label="breadcrumb" style="margin: 10px 0"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="/depart/">{% trans "i18n.depart.Title" %}</a></li><li class="breadcrumb-item active" aria-current="page">{% trans "i18n.depart.add" %}</li></ol></nav><form method="post" action="/depart/add/">{% csrf_token %}<div class="mb-3 row"><label for="formGroupExampleInput" class="col-sm-2 col-form-label">{% trans "i18n.depart.name" %}</label><div class="col-sm-10"><input type="text" class="form-control" placeholder="{% trans 'i18n.depart.name' %}" name="name"></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">{% trans "i18n.depart.description" %}</label><div class="col-sm-10"><input type="text" class="form-control" placeholder="{% trans 'i18n.depart.description' %}" name="description"></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">{% trans "i18n.depart.parent" %}</label><div class="col-sm-10"><select  class="form-select" name="parent"><option value="0">{% trans "i18n.depart.select" %}</option>{% for depart in departs %}<option value="{{ depart.id }}">{{ depart.name }}</option>{% endfor %}</select></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label"></label><div class="form-check col-sm-2"><input class="form-check-input" type="checkbox" name="is_active" checked><label class="form-check-label" for="gridCheck">{% trans "common.is_active" %}</label></div><div class="form-check col-sm-2"><input class="form-check-input" type="checkbox" name="is_locked" ><label class="form-check-label" for="gridCheck">{% trans "common.is_locked" %}</label></div></div><button type="submit" class="btn btn-primary" >{% trans "common.action.save" %}</button></form></div>
</body>
</html>

外观

中文

英文

编辑部门

源码

<!DOCTYPE html>
{% load static %}
{% load i18n %}
<html lang="en">
<head><meta charset="UTF-8"><title>{% trans "i18n.depart.Title" %}</title><link rel="stylesheet" href="{% static 'bootstrap5/css/bootstrap.min.css' %}">
</head>
<body><div class="container"><nav aria-label="breadcrumb" style="margin: 10px 0"><ol class="breadcrumb"><li class="breadcrumb-item"><a href="/depart/">{% trans "i18n.depart.Title" %}</a></li><li class="breadcrumb-item active" aria-current="page">{% trans "i18n.depart.edit" %}</li></ol></nav><form method="post" action="/depart/edit/">{% csrf_token %}<div class="mb-3 row"><label for="formGroupExampleInput" class="col-sm-2 col-form-label">#</label><div class="col-sm-10"><input type="text" class="form-control" readonly placeholder="" name="id" value="{{depart.id}}"></div></div><div class="mb-3 row"><label for="formGroupExampleInput" class="col-sm-2 col-form-label">{% trans "i18n.depart.name" %}</label><div class="col-sm-10"><input type="text" class="form-control" placeholder="{% trans 'i18n.depart.name' %}" name="name" value="{{depart.name}}"></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">{% trans "i18n.depart.description" %}</label><div class="col-sm-10"><input type="text" class="form-control" placeholder="{% trans 'i18n.depart.description' %}" name="description"  value="{{depart.description}}"></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label">{% trans "i18n.depart.parent" %}</label><div class="col-sm-10"><select  class="form-select" name="parent"><option  value="-1">{% trans "i18n.depart.select" %}</option>{% for depart1 in departs %}{% if depart1.id == depart.parent %}<option selected value="{{ depart1.id }}">{{ depart1.name }}(id={{ depart1.id }})</option>{% else %}<option value="{{ depart1.id }}">{{ depart1.name }}(id={{ depart1.id }})</option>{% endif %}{% endfor %}</select></div></div><div class="mb-3 row"><label for="formGroupExampleInput2" class="col-sm-2 col-form-label"></label><div class="form-check col-sm-2"><input class="form-check-input" type="checkbox" name="is_active"{% if depart.is_active %}checked{% endif %}><label class="form-check-label" for="gridCheck">{% trans "common.is_active" %}</label></div><div class="form-check col-sm-2"><input class="form-check-input" type="checkbox" name="is_locked"{% if depart.is_locked %}checked{% endif %}><label class="form-check-label" for="gridCheck">{% trans "common.is_locked" %}</label></div></div><button type="submit" class="btn btn-primary" >{% trans "common.action.save" %}</button></form></div>
</body>
</html>

外观

中文

英文

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/1451051.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

echarts学习:使用dataset管理数据

前言 在我们公司的组件库中有许多echarts图表相关的组件&#xff0c;这些组件在使用时&#xff0c;只需将图表数据以特定的格式传入组件中&#xff0c;十分方便。因此当我得知echarts 可以使用dataset集中管理数据时&#xff0c;我就决定自己一定要搞懂它&#xff0c;于是在最…

STM32硬件接口I2C应用(基于HMC5883L)

目录 概述 1 STM32Cube控制配置I2C 1.1 I2C参数配置 1.2 使用STM32Cube产生工程 2 HAL库函数介绍 2.1 初始化函数 2.2 写数据函数 2.3 读数据函数 3 认识HMC5883L 3.1 HMC5883L功能介绍 3.2 HMC5883L的寄存器 4 HMC5883L驱动程序实现 4.1 驱动函数实现 4.2 完整驱…

bean实例化

黑马程序员SSM 文章目录 一、bean是如何创建的二、实例化bean的三种方式3.1 构造方法&#xff08;常用&#xff09;3.2 静态工厂3.3 实例化工厂&#xff08;了解&#xff09;3.4 FactoryBean 一、bean是如何创建的 Spring 创建bean的时候使用的是无参构造 二、实例化bean的三…

【数组】【快慢双指针】删除有序数组中的重复项+移除元素+删除有序数组中的重复项II

今天趁热打铁&#xff0c;接着刷了几道标签是【数组】的题&#xff0c;基本都是双指针就能解决。 1、删除有序数组中的重复项 该题对应力扣网址 class Solution { public:int removeDuplicates(vector<int>& nums) {int i,j;int count 0;int n nums.size();nums.…

网络加密机的核心技术是什么

随着信息技术的飞速发展&#xff0c;网络已经成为现代社会不可或缺的基础设施。然而&#xff0c;网络空间的开放性和互联性也带来了诸多安全隐患&#xff0c;其中数据泄露和非法访问是最常见的问题。为了保障数据传输的安全性和完整性&#xff0c;网络加密机应运而生&#xff0…

为什么选择 ABBYY FineReader PDF ?

帮助用户们对PDF文件进行快速的编辑处理&#xff0c;同时也可以快速识别PDF文件里的文字内容&#xff0c;并且可以让用户们进行文本编辑&#xff0c;所以可以有效提升办公效率。 ABBYY-ABBYY Finereader 15 Win-安装包&#xff1a;https://souurl.cn/OY2L3m 高级转换功能 ABBY…

WARNING: pip is configured with locations that require TLS/SSL

在pycharm中运行pip下载软件包遇到该问题&#xff1a;WARNING: pip is configured with locations that require TLS/SSL, however the ssl module in Python is not available 原因&#xff1a;没有安装openssl&#xff1b; 到https://slproweb.com/products/Win32OpenSSL.ht…

Blender帧动画

时间线窗口Timeline用于定义帧动画 -视图&#xff1a;方法&#xff0c;平移&#xff0c;框显全部 -帧范围&#xff1a;可以调整动画共多少帧 -当前帧&#xff1a;可以拖动或手工指定 默认每秒24帧 定义一个帧动画类似unity的Timeline&#xff0c;只需定义关键帧&#xff0c…

MultiTrust:首个综合统一的多模态信任度基准(下)

2 实验 2.1 实验设计 实验设计基于对MLLMs可信度的全面理解&#xff0c;包括真实性、安全性、鲁棒性、公平性和隐私性五个主要方面。这些方面共同构成了一个综合框架&#xff0c;用于评估模型在防止不良结果和确保对用户社会影响的可靠性。 真实性&#xff08;Truthfulness&…

minIo ubuntu单节点部署

资源准备 minio二进制包 下载地址:https://dl.min.io/server/minio/release/linux-amd64/minio ubuntu-单节点部署 选择一台ubuntu18.04机器10.253.9.41、intel 或者 amd 64位处理器 上传minio到~目录 sudo cp minio /usr/local/bin/ sudo chmod x /usr/local/bin/minio 设…

变压器空载合闸励磁涌流的Simulink仿真

利用图 1所示的仿真模型分析三相变压器空载合闸过程时, 设置三相断路器模块 的切换时间为0s,仿真时间为 0.5s, 仿真算法为 ode23t 。三相断路器模块 QF2、故障模 块 Fault1 和 Fault2 在仿真中均不动作&#xff08;设置其切换时间大于仿真时间即可&#xff09;。 为了观察合闸时…

Java接口实现与类继承

学习初期发现接口实现与类继承很像&#xff0c;随着学习深入发现它们之间的联系与区别&#xff0c;整理如下&#xff1a; 经实验发现&#xff0c;实现接口的类中含有接口中的所有属性和方法&#xff0c;继承父类的子类中也含有父类中所有的属性和方法&#xff0c;可以说接口实…

车牌识别(附源代码)

完整项目已上传至github:End-to-end-for-chinese-plate-recognition/License-plate-recognition at master duanshengliu/End-to-end-for-chinese-plate-recognition GitHub 整体思路&#xff1a; 1.利用u-net图像分割得到二值化图像 2.再使用cv2进行边缘检测获得车牌区域坐…

11.1 Go 标准库的组成

&#x1f49d;&#x1f49d;&#x1f49d;欢迎莅临我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…

内网穿透方法有哪些?路由器端口映射外网和软件方案步骤

公网IP和私有IP不能互相通讯。我们通常在局域网内部署服务器和应用&#xff0c;当需要将本地服务提供到互联网外网连接访问时&#xff0c;由于本地服务器本身并无公网IP&#xff0c;就无法实现。这时候就需要内网穿透技术&#xff0c;即内网映射&#xff0c;内网IP端口映射到外…

iOS 18 照片应用程序增加了新分类用于查找二维码、收据、插图等

苹果照片应用 苹果在iOS 18的照片应用中引入了全新的设计&#xff0c;将图库和推荐部分合并为一个更集成的多合一视图。重新设计的实用工具部分经过全面改造&#xff0c;使得查找不同类型的图片更加容易。 实用工具 在iOS 17中&#xff0c;照片应用的实用工具部分只包括导入…

【代码随想录】【算法训练营】【第36天】[452]用最少数量的箭引爆气球 [435]无重叠区间 [763]划分字母区间

前言 思路及算法思维&#xff0c;指路 代码随想录。 题目来自 LeetCode。 day 36&#xff0c;周三&#xff0c;最难坚持的一天~ 题目详情 [452] 用最少数量的箭引爆气球 题目描述 452 用最少数量的箭引爆气球 解题思路 前提&#xff1a;区间可能重叠 思路&#xff1a;…

自动控制:滑模控制(Sliding Mode Control, SMC)

自动控制&#xff1a;滑模控制(Sliding Mode Control, SMC) 滑模控制&#xff08;Sliding Mode Control, SMC&#xff09;是一种在处理非线性系统时非常有效的控制技术。它通过驱动系统状态达到并保持在特定的滑模面附近&#xff0c;来实现控制目标。本文将介绍滑模控制的基本…

潞晨训推一体机,画出大模型到企业的一条龙路线图

最近跟一位企业的CIO交流&#xff0c;对方关于大模型的认知让我惊呆了&#xff0c;他说&#xff0c;“听说做私域大模型要两千万的软件投入和两千万的算力投入&#xff0c;我们公司没有这个预算”。 于是我问道&#xff1a;“那如果按照你们公司的数据基础和业务场景&#xff0…

功能测试 之 单模块测试----轮播图、登录、注册

单功能怎么测&#xff1f; 需求分析 拆解测试点 编写用例 1.轮播图 &#xff08;1&#xff09;需求分析 位置&#xff1a;后台--页面--广告管理---广告列表(搜索index页面增加广告位2) 操作完成后需要点击admin---更新缓存,前台页面刷新生效 &#xff08;2&#xff09;拆解…