主要用到内容:vue,coreui bootstrap框架,Ajax,springmvc搭建的接口,css之类的都是顺手拈来的简单的界面设计

网页代码

<!DOCTYPE html>
<html lang="en" xmlns:v-bind="http://www.w3.org/1999/xhtml"> <head>
<meta charset="UTF-8">
<meta charset="UTF-8">
<meta charset="UTF-8">
<base href="./">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, shrink-to-fit=no">
<meta name="description" content="CoreUI - Open Source Bootstrap Admin Template">
<meta name="author" content="Łukasz Holeczek">
<meta name="keyword" content="Bootstrap,Admin,Template,Open,Source,jQuery,CSS,HTML,RWD,Dashboard"> <link href="vendors/@coreui/icons/css/coreui-icons.min.css" rel="stylesheet">
<link href="vendors/flag-icon-css/css/flag-icon.min.css" rel="stylesheet">
<link href="vendors/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<link href="vendors/simple-line-icons/css/simple-line-icons.css" rel="stylesheet">
<!-- Main styles for this application-->
<link href="css/style.css" rel="stylesheet">
<link href="vendors/pace-progress/css/pace.min.css" rel="stylesheet">
<title>bus station admin (bus 站点信息管理页面)</title>
</head>
<body>
Wellcome 管理员: <!--菜单栏目-->
<header class="app-header navbar"> <ul class="nav navbar-nav d-md-down-none">
<li class="nav-item px-3">
<a class="nav-link" href="busAdmin.html">管理员首页</a>
</li>
<li class="nav-item px-3">
<a class="nav-link" href="bususerAdmin.html">用户信息管理</a>
</li>
<li class="nav-item px-3">
<a class="nav-link" href="buslineAdmin.html">公交线路管理</a>
</li>
<li class="nav-item px-3">
<a class="nav-link" href="busstationAdmin.html">站点信息管理</a>
</li>
<li class="nav-item px-3">
<a class="nav-link" href="buscarAdmin.html">车辆信息管理</a>
</li> <!--item头像-->
<li class="nav-item dropdown">
<a class="nav-link" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
<img class="img-avatar" src="img/avatars/6.jpg" alt="admin@bootstrapmaster.com">
</a>
<div class="dropdown-menu dropdown-menu-right">
<div class="dropdown-header text-center">
<strong>用户</strong>
</div> <a class="dropdown-item" href="#">
<i class="fa fa-envelope-o"></i> 用户名
</a>
<a class="dropdown-item" href="#">
<i class="fa fa-tasks"></i> 个性签名
</a> <div class="dropdown-header text-center">
<strong>Settings</strong>
</div>
<a class="dropdown-item" href="#">
<i class="fa fa-lock"></i> Logout</a>
</div>
</li>
</ul> </header> <main class="main">
<div class="row">
<div class="col">
<div class="card">
<div class="card-header">
<i class="fa fa-align-justify"></i> 车站点信息
<small>功能管理</small>
</div>
<div class="card-body">
<div class="row">
<div class="col-4">
<div class="list-group" id="list-tab" role="tablist"> <a class="list-group-item list-group-item-action active show" id="list-messages-list" data-toggle="tab" href="#list-messages" role="tab" aria-controls="list-messages" aria-selected="true">添加站点</a>
<a class="list-group-item list-group-item-action" id="list-profile-list" data-toggle="tab" href="#list-profile" role="tab" aria-controls="list-profile" aria-selected="false">搜索站点</a>
<a class="list-group-item list-group-item-action" id="list-home-list" data-toggle="tab" href="#list-home" role="tab" aria-controls="list-home" aria-selected="false">所有站点</a>
</div>
</div>
<div class="col-8">
<div class="tab-content" id="nav-tabContent">
<div class="tab-pane fade" id="list-home" role="tabpanel" aria-labelledby="list-home-list">
<!--所有站点-->
<div class="card-body">
<table class="table table-responsive-sm table-bordered" id="usersTable">
<thead>
<tr>
<th>车站点名</th>
<th>车站点信息</th>
<th>车站点出发时间</th>
<th>车站点结束时间</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr v-for="(item, index) in items"> <td>{{item.busstationname}}</td>
<td>{{item.businfo}}</td>
<td>{{item.stationstarttime}}</td>
<td>{{item.stationendtime}}</td> <td>
<button class="btn btn-primary" type="button" data-toggle="modal"
data-target="#primaryModal" v-bind:data-rowindex="index"
aria-pressed="true"><i class="fa fa-edit"></i>&nbsp;编辑站点信息
</button>
&nbsp;
<button class="btn btn-danger" type="button" data-toggle="modal"
data-target="#dangerModal" v-bind:data-rowindex="index" aria-pressed="true">
<i class="fa fa-close"></i>&nbsp;删除
</button>
</td>
</tr>
</tbody>
</table> </div> </div>
<div class="tab-pane fade" id="list-profile" role="tabpanel" aria-labelledby="list-profile-list"> <p>请输入你要查找的站点名字(查找到对应的站点也可以对应编辑信息处理):</p> <input class="form-control" type="text" id="findwhatstation" placeholder="请输入你要查找的站点名字:">
<button class="btn btn-outline-primary btn-lg btn-block" type="button" data-toggle="modal" data-target="#findstationModal" aria-pressed="true">点击查询</button>
</div> <div class="tab-pane fade active show" id="list-messages" role="tabpanel" aria-labelledby="list-messages-list">
<div class="col-sm-5 col-md-12">
<div class="card card-accent-warning">
<div class="card-header">添加站点信息编辑</div>
<div class="card-body"> <form class="form-horizontal" action="" method="post">
<div class="form-group row">
<label class="col-md-3 col-form-label" for="newstationname">车站点名字</label>
<div class="col-md-9">
<input class="form-control" id="newstationname" type="text" name="newstationname" placeholder="车站点名字..">
<span class="help-block">Please enter your 你想添加的车站点名</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 col-form-label" for="newbusinfo">车站点详情(例子:下站通往某某大道,某某医院,某某街道)</label>
<div class="col-md-9">
<input class="form-control" id="newbusinfo" type="text" name="newbusinfo" placeholder="车站点详情..">
<span class="help-block">Please enter your 车站点详情</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 col-form-label" for="newstationstarttime">车站点出发时间(例子:6:00或者21:00)</label>
<div class="col-md-9">
<input class="form-control" id="newstationstarttime" type="text" name="newstationstarttime" placeholder="车站点详情..">
<span class="help-block">Please enter your 车站点开始时间</span>
</div>
</div>
<div class="form-group row">
<label class="col-md-3 col-form-label" for="newstationendtime">车站点结束时间</label>
<div class="col-md-9">
<input class="form-control" id="newstationendtime" type="text" name="newstationendtime" placeholder="车站点结束时间">
<span class="help-block">Please enter your 车站点结束时间(例子:6:00或者21:00)</span>
</div>
</div>
<button class="btn btn-primary btn-lg btn-block" type="button" onclick="addnewstatio()">确认添加一个新站点</button>
</form> </div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row"> <div class="col-md-8">
</div>
<!--时钟 参考https://www.jb51.net/article/88600.htm-->
<div class="col-md-4"> </div>
</div> <!-- 说明:每row行共12列,分个2div,第1个div占4列,第2个div则占8列,即4列+8列=12列 --> <!-- Breadcrumb--> </main>
<div class="modal fade show" id="primaryModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-primary" role="document">
<div class="modal-content">
<form id="modalForm" class="needs-validation" action="" method="post">
<div class="modal-header">
<h4 class="modal-title">编辑</h4>
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="form-group">
<label for="busstationname">车站点名</label>
<input class="form-control" id="busstationname" type="text" name="busstationname" placeholder="输入修改车站点名.."
required>
<!--<span class="help-block">用户名</span>-->
<div class="invalid-feedback">
修改名不能为空!
</div>
</div>
<div class="form-group">
<label for="businfo">站点信息</label>
<input class="form-control" id="businfo" type="text" name="businfo"
placeholder="站点信息..">
<!--<span class="help-block">注册时间</span>-->
</div>
<div class="form-group">
<label for="stationstarttime">开始时间</label>
<input class="form-control" id="stationstarttime" type="text" name="stationstarttime" placeholder="开始时间..">
<!--<span class="help-block">角色</span>-->
</div>
<div class="form-group">
<label for="stationendtime">开始时间</label>
<input class="form-control" id="stationendtime" type="text" name="stationendtime" placeholder="结束时间..">
<!--<span class="help-block">角色</span>-->
</div> </div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" data-dismiss="modal">取消</button>
<button class="btn btn-primary" type="button" name="" onclick="save();">保存</button>
</div>
</form>
</div>
<!-- /.modal-content-->
</div>
<!-- /.modal-dialog-->
</div> <div class="modal fade show" id="dangerModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-danger" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">删除</h4>
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
删除后无法恢复,确认删除该记录么?
</div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" data-dismiss="modal">取消</button>
<button class="btn btn-primary" type="button" onclick="deleteUser();">确定</button>
</div>
</div>
<!-- /.modal-content-->
</div>
<!-- /.modal-dialog-->
</div> <div class="modal fade show" id="findstationModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-primary" role="document">
<div class="modal-content">
<form id="myfindstation" class="needs-validation" action="" method="post">
<div class="modal-header">
<h4 class="modal-title">查找到的信息:</h4>
<button class="close" type="button" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="form-group"> <label class="bg-warning theme-color w-60 rounded mb-2">(请不要随意删除站点,站点会影响线路)</label>
<label for="findstationinformation">查询的站点信息如下:</label>
<div class="col-md-8 mb-5">
<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link active show" data-toggle="tab" href="#home3" role="tab" aria-controls="home" aria-selected="true">
<i class="icon-calculator"></i> 查询到的信息</a>
</li>
<li class="nav-item">
<a class="nav-link" data-toggle="tab" href="#profile3" role="tab" aria-controls="profile" aria-selected="false">
<i class="icon-basket-loaded"></i> 修改该站点信息</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-pane active show" id="home3" role="tabpanel"> <textarea class="form-control" id="findstationinformation" name="textarea-input" rows="6" placeholder="Content.." disabled></textarea>
</div>
<div class="tab-pane" id="profile3" role="tabpanel">
站点名: <input class="form-control" id="findbusstationname" type="text" name="findstationname" placeholder="输入修改车站点名.." required="">
站点信息:<input class="form-control" id="findbusinfo" type="text" name="findstationinfo" placeholder="输入修改车站站点信息.." required="">
站点出发时间:<input class="form-control" id="findstarttime" type="text" name="findstarttime" placeholder="输入修改车站开始时间.." required="">
站点结束使时间: <input class="form-control" id="findendtime" type="text" name="findendtime" placeholder="输入修改车站结束时间.." required=""> </div>
</div> <!--<input class="form-control" id="findstationinformation" type="text" name="findstationinformation" disabled>-->
</div>
</div>
<div class="modal-footer">
<button class="btn btn-secondary" type="button" data-dismiss="modal">返回</button>
<button class="btn btn-danger" type="button" onclick="deletfindstation()">删除该站点</button>
<button class="btn btn-primary" type="button" name="" onclick="savefindstation();">修改保存</button>
</div></div>
</form>
</div>
<!-- /.modal-content-->
</div>
<!-- /.modal-dialog-->
</div> <script src="vendors/jquery/js/jquery.min.js"></script>
<script src="vendors/popper.js/js/popper.min.js"></script>
<script src="vendors/bootstrap/js/bootstrap.min.js"></script>
<script src="vendors/pace-progress/js/pace.min.js"></script>
<script src="vendors/perfect-scrollbar/js/perfect-scrollbar.min.js"></script>
<script src="vendors/@coreui/coreui/js/coreui.min.js"></script>
<script src="vendors/chart.js/js/Chart.min.js"></script>
<script src="vendors/@coreui/coreui-plugin-chartjs-custom-tooltips/js/custom-tooltips.min.js"></script>
<script src="js/main.js"></script>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
<script>
var users = [ ];//获取到的bus所有站点信息
var rowIndex = -1;
var findstationid=0;
$.ajax({
url: "/busstations",
type:"GET",
success: function(response){
users = response; console.log(users)
//查看到获取信息成功
var example1 = new Vue({
el: '#usersTable',
data: {
items: users
}
});
return;
}
}); $('#primaryModal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget) // Button that triggered the modal
rowIndex = button.data('rowindex') // Extract info from data-* attributes
// If necessary, you could initiate an AJAX request here (and then do the updating in a callback).
// Update the modal's content. We'll use jQuery here, but you could use a data binding library or other methods instead.
var user = users[rowIndex];
var modal = $(this);
// modal.find('.modal-title').text('New message to ' + recipient)
modal.find('.modal-body #busstationname').val(user.busstationname);
modal.find('.modal-body #businfo').val(user.businfo);
modal.find('.modal-body #stationstarttime').val(user.stationstarttime);
modal.find('.modal-body #stationendtime').val(user.stationendtime); }); $('#findstationModal').on('show.bs.modal', function (event) {
var findwhatstation= $('#findwhatstation').val();
var i=0;
var modal = $(this);
for(i=0;i<users.length;i++)
{
if(findwhatstation===users[i].busstationname)//找到busstation了
{
modal.find('.modal-body #findstationinformation').val("站点名:"+users[i].busstationname+"\n"+"站点信息:"+users[i].businfo+"\n"+"开始时间:"+users[i].stationstarttime+"\n"+"结束时间:"+users[i].stationendtime);
modal.find('.modal-body #findbusstationname').val(users[i].busstationname);
modal.find('.modal-body #findbusinfo').val(users[i].businfo);
modal.find('.modal-body #findstarttime').val(users[i].stationstarttime);
modal.find('.modal-body #findendtime').val(users[i].stationendtime);
findstationid=users[i].id;
break;
}
else{
modal.find('.modal-body #findstationinformation').val("很抱歉,sorry,没找到你想要找的站点信息!!!");
}
} }); $('#dangerModal').on('show.bs.modal', function (event) {
var button = $(event.relatedTarget) // Button that triggered the modal
rowIndex = button.data('rowindex') // Extract info from data-* attributes
return;
}); function addnewstatio() {
var newstationname = $('#newstationname').val();
var newbusinfo = $('#newbusinfo').val();
var newstationstarttime = $('#newstationstarttime').val();
var newstationendtime = $('#newstationendtime').val();
var needid=users.length+1;
alert(needid);
console.log("站点信息:"+newbusinfo+"站点名字:"+newstationname+"站点开始时间:"+newstationstarttime+"站点结束时间:"+newstationendtime);
$.ajax({
url: "/busstations/create",
type:"POST",
contentType: "application/json; charset=utf-8",
data : JSON.stringify({id:needid,busstationname:newstationname,businfo:newbusinfo,stationstarttime:newstationstarttime,stationendtime:newstationendtime}),
dataType: "json", success: function (res) {
alert("成功"); },
error: function (message) {
// alert(message);
}
});
} function deletfindstation(){
var ids=findstationid;
$.ajax({
type: "POST",
url: "/busstations/delete",
contentType: 'application/json',
data: JSON.stringify(ids),
dataType: "json",
success: function (data) {
users.splice(rowIndex, 1);
$('#findstationModal').modal('hide');//隐藏模态框
},
error: function (msg) {
alert(ids);
}
}); }
function savefindstation(){
var id=findstationid;
var findstationname=$('#findbusstationname').val();
var findbusinfo=$('#findbusinfo').val();
var findendtime=$('#findendtime').val();
var findstarttime=$('#findstarttime').val();
console.log(findstationname+findstationid); $.ajax({
type: "POST",
url: "/busstations/delete",
contentType: 'application/json',
data: JSON.stringify(id),
dataType: "json",
success: function (data) { $.ajax({
url: "/busstations/create",
type:"POST",
contentType: "application/json; charset=utf-8",
data : JSON.stringify({id:id,busstationname:findstationname,businfo:findbusinfo,stationstarttime:findstarttime,stationendtime:findendtime}),
dataType: "json", success: function (res) {
// alert(res); },
error: function (message) {
// alert(message);
}
}); }
}); $('#findstationModal').modal('hide');//隐藏模态框 }
function save() { //验证表单
var form = document.getElementById('modalForm');
if (form.checkValidity() === true) {
// modal.find('.modal-title').text('New message to ' + recipient)
var busstationname = $('#busstationname').val();
var businfo = $('#businfo').val();
var stationstarttime = $('#stationstarttime').val();
var stationendtime = $('#stationendtime').val(); users[rowIndex].busstationname = busstationname;
users[rowIndex].businfo = businfo;
users[rowIndex].stationstarttime = stationstarttime;
users[rowIndex].stationendtime = stationendtime; var ids = users[rowIndex].id; $('#primaryModal').modal('hide');//隐藏模态框
$.ajax({
type: "POST",
url: "/busstations/delete",
contentType: 'application/json',
data: JSON.stringify(ids),
dataType: "json",
success: function (data) { $.ajax({
url: "/busstations/create",
type:"POST",
contentType: "application/json; charset=utf-8",
data : JSON.stringify({id:ids,busstationname:busstationname,businfo:businfo,stationstarttime:stationstarttime,stationendtime:stationendtime}),
dataType: "json", success: function (res) {
// alert(res); },
error: function (message) {
// alert(message);
}
}); }
}); } form.classList.add('was-validated');
$('#primaryModal').modal('hide');//隐藏模态框 } function deleteUser() {
var ids = users[rowIndex].id; $.ajax({
type: "POST",
url: "/busstations/delete",
contentType: 'application/json',
data: JSON.stringify(ids),
dataType: "json",
success: function (data) {
users.splice(rowIndex, 1);
$('#dangerModal').modal('hide');//隐藏模态框
},
error: function (msg) {
alert(ids);
}
}); }; </script> </body>
</html>

添加新的站点:

控制台提示:

查看数据库就肯定会多一条数据了。

查询功能也实现

所有站点信息:

(下一任务安排实现车辆信息管理功能,线路比较复杂先搁到下下任务)

基于web公交查询系统----管理员公交站点管理页面实现的更多相关文章

  1. 基于web公交查询系统----数据库设计

    要求:公交查询系统,管理员可以新增线路,修改车辆参数,发车时间表,删除车次,站名等. 用户可以按线路查询,按站点查询相关信息,也可查询两站点之间的换乘信息等. 数据库应包含管理员表,车站表,线路表,车 ...

  2. 基于Web在线考试系统的设计与实现

    这是一个课程设计的文档,源码及文档数据库我都修改过了,貌似这里复制过来的时候图片不能贴出,下载地址:http://download.csdn.net/detail/sdksdk0/9361973   ...

  3. 基于Web的监控系统的开发进行分布式和现代生产(外文翻译)

    摘要 近年来,Web技术发展迅速.尤其是网络浏览器增强了其功能因为JavaScript,CSS3和HTML5的改进.因此,功能越来越丰富的基于Web的软件解决方案功能范围可用.通过使用响应式网页设计( ...

  4. 【转】如何在CentOS/RHEL中安装基于Web的监控系统 linux-das

    Linux-dash是一款为Linux设计的基于Web的轻量级监控面板.这个程序会实时显示各种不同的系统属性,比如CPU负载.RAM使用率.磁盘使用率.网速.网络连接.RX/TX带宽.登录用户.运行的 ...

  5. 预约系统(四) 管理页面框架搭建easyUI

    Manage控制器用于管理页面 Index视图为管理页面首页,采用easyUi的后台管理框架 Html头部调用,jquery库,easyui库,easyui.css,icon.css,语言包 < ...

  6. 基于web公交查询系统---站点信息管理

    界面设计: 界面设计代码获取: 搭建好框架获取信息: 核心代码: var users = [ ];//获取到的bus所有站点信息 var rowIndex = -1; $.ajax({ url: &q ...

  7. 基于web公交查询系统自我安排进度

    这周完成站点信息管理

  8. 基于web公交查询系统---搭建mvc连接数据库(我的毕业设计,进度继续)

    建立一个spring的项目:我在已经做过的项目基础下做的,所以接口连接数据库挺快. 搭建好的.对应好数据库: 前几天进度已经完成简单的设计: 完成登录,用户管理(修改删除). 继续的数据库的信息获取, ...

  9. Solr 08 - 在Solr Web管理页面中查询索引数据 (Solr中各类查询参数的使用方法)

    目录 1 Solr管理页面的查询入口 2 Solr查询输入框简介 3 Solr管理页面的查询方案 1 Solr管理页面的查询入口 选中需要查询的SolrCore, 然后在菜单栏选择[Query]: 2 ...

随机推荐

  1. Codeforces Round #602 (Div. 2, based on Technocup 2020 Elimination Round 3) F2. Wrong Answer on test 233 (Hard Version) dp 数学

    F2. Wrong Answer on test 233 (Hard Version) Your program fails again. This time it gets "Wrong ...

  2. React: 认识React

    一.简介 React-Native是Facebook开源的跨平台框架,用于实现前端和原生进行混合开发.React-Native开发可以很好的使用原生UI构建用户界面,与传统的使用WebView相比,不 ...

  3. Anaconda安装第三方库与pip和conda 添加国内源

    Anaconda安装第三方库 PIP使用命令 Anaconda命令 pip和conda 添加国内源 1:PIP相关命令 卸载 pip uninstall XXX 1.升级pip python -m p ...

  4. 定时任务之SpringSchedule的注意事项

    在我们现在的项目中,或多或少的都会涉及到定时任务,Spring在3.0之后引入了SpringSchedule,这让我们在使用Spring的时候,可以很容易的整合SpringSchedule.但是好用归 ...

  5. Netty—TCP的粘包和拆包问题

    一.前言 虽然TCP协议是可靠性传输协议,但是对于TCP长连接而言,对于消息发送仍然可能会发生粘贴的情形.主要是因为TCP是一种二进制流的传输协议,它会根据TCP缓冲对包进行划分.有可能将一个大数据包 ...

  6. python基础(25):面向对象三大特性二(多态、封装)

    1. 多态 1.1 什么是多态 多态指的是一类事物有多种形态. 动物有多种形态:人,狗,猪. import abc class Animal(metaclass=abc.ABCMeta): #同一类事 ...

  7. Python爬取《冰雪奇缘2》豆瓣影评

    前言 文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者: 刘铨@CCIS Lab PS:如有需要Python学习资料的小伙伴可 ...

  8. SQLserver创建用户和给用户权限(学)

    数据库基础知识:http://blog.csdn.net/u014600432/article/details/39645701 在SQL Server中创建用户角色及授权(使用SQL语句):http ...

  9. VMWare虚拟机应用介绍

    目录 一:VMWare简介 二:VMWare启动第一个虚拟机 一:VMWare简介   VMWare虚拟机软件是一个"虚拟PC"软件,它使你可以在一台机器上同时运行二个或更多Win ...

  10. Redis设置密码,保护数据安全

    1.设置密码方法 在 redis.conf 的配置文件中修改参数 requirepass 的值为需要设置的密码, 保存配置文件后,重启Redis就可以. 建议 设置比较复杂和长的密码,防止被暴力破解. ...