Files
php-official-website/src/template/pc/lists_guestbook_project.htm
2025-12-17 16:48:13 +08:00

333 lines
9.8 KiB
HTML

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=0.28,user-scalable=no" />
<title>{$eyou.field.seo_title}</title>
<meta name="description" content="{$eyou.field.seo_description}" />
<meta name="keywords" content="{$eyou.field.seo_keywords}" />
<link href="{eyou:global name='web_ico' /}" rel="shortcut icon" type="image/x-icon" />
{eyou:static file="skin/css/base.css" /}
{eyou:static file="skin/css/style.css" /}
{eyou:static file="skin/js/jquery.tools.min.js" /}
{eyou:static file="skin/js/jquery.kinMaxShow-1.0.min.js" /}
{eyou:static file="/public/static/common/js/jquery.min.js"/}
{eyou:static file="/public/plugins/layer-v3.1.0/layer.js"/}
{eyou:static file="users/skin/js/global.js" /}
</head>
<style>
/* 美化后的样式 */
.container-wrapper {
max-width: 600px;
margin: 60px auto 0;
}
.search-container {
padding: 40px;
background: #fff;
border-radius: 10px;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
text-align: center;
margin-bottom: 30px;
}
.header_title {
margin-bottom: 30px;
font-size: 28px;
font-weight: 600;
color: #333;
position: relative;
padding-bottom: 15px;
}
.header_title:after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 60px;
height: 3px;
background: #bd2a15;
border-radius: 3px;
}
.form-group {
margin-bottom: 25px;
text-align: left;
}
.form-label {
display: block;
margin-bottom: 8px;
font-size: 16px;
font-weight: 500;
color: #555;
}
.form-control {
width: 100%;
padding: 14px 15px;
font-size: 16px;
color: #333;
border: 1px solid #ddd;
border-radius: 6px;
transition: all 0.3s;
box-sizing: border-box;
}
.form-control:focus {
border-color: #bd2a15;
box-shadow: 0 0 0 3px rgba(189, 42, 21, 0.1);
outline: none;
}
.search-btn {
width: 100%;
padding: 14px;
font-size: 18px;
font-weight: 600;
color: #fff;
background: #bd2a15;
border: none;
border-radius: 6px;
cursor: pointer;
transition: all 0.3s;
margin-top: 10px;
}
.search-btn:hover {
background: #a52513;
transform: translateY(-2px);
box-shadow: 0 5px 15px rgba(189, 42, 21, 0.3);
}
.result-container {
padding: 30px;
background: #fff;
border-radius: 10px;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
display: none;
margin-bottom: 30px;
}
.result-title {
font-size: 22px;
font-weight: 600;
color: #333;
margin-bottom: 25px;
text-align: center;
padding-bottom: 15px;
border-bottom: 1px solid #eee;
}
.result-item {
display: flex;
margin-bottom: 20px;
padding-bottom: 20px;
border-bottom: 1px solid #f5f5f5;
}
.result-item:last-child {
margin-bottom: 0;
padding-bottom: 0;
border-bottom: none;
}
.result-label {
width: 120px;
font-weight: 600;
color: #555;
}
.result-value {
flex: 1;
color: #333;
}
.qrcode-container {
max-width: 800px;
margin: 0 auto 40px;
padding: 30px;
background: #fff;
border-radius: 10px;
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.1);
text-align: center;
display: none;
}
.qrcode-img {
max-width: 100%;
height: auto;
margin-bottom: 20px;
border: 1px solid #eee;
border-radius: 8px;
}
.close-btn {
display: inline-block;
padding: 10px 25px;
font-size: 16px;
font-weight: 600;
color: #bd2a15;
background: #fff;
border: 2px solid #bd2a15;
border-radius: 30px;
cursor: pointer;
transition: all 0.3s;
}
.close-btn:hover {
background: #bd2a15;
color: #fff;
}
.content-wrap {
background: none;
padding: 20px 0;
}
.content-inner {
background: none;
min-height: 600px;
}
@media (max-width: 768px) {
.container-wrapper {
margin: 30px 15px;
}
.search-container, .result-container, .qrcode-container {
padding: 25px 20px;
}
.form-control {
padding: 12px 12px;
}
.search-btn {
padding: 12px;
font-size: 16px;
}
}
</style>
<body>
<!--头部--star-->
{eyou:include file="header.htm" /}
<!--头部---end-->
<!---layui--->
{eyou:include file="layui.htm" /}
<!---layui--->
<div class="content-wrap">
<div class="content-inner">
<div class="content">
<div class="container-wrapper">
<div class="search-container">
<h2 class="header_title">原生应用查询</h2>
<form class="layui-form" name='theForm' id="theForm" method="post">
<div class="form-group">
<label class="form-label">关键词:</label>
<input type="text" name="username" class="form-control" placeholder="请输入关键词">
</div>
<div class="form-group">
<label class="form-label">查询密码:</label>
<input type="password" name="password" class="form-control" placeholder="请输入查询密码">
</div>
<input type="button" name="submit" class="search-btn" value="搜索"/>
</form>
</div>
<div class="result-container" id="show">
<h3 class="result-title">查询结果</h3>
<div class="result-item">
<div class="result-label">名称:</div>
<div class="result-value" id="name"></div>
</div>
<div class="result-item">
<div class="result-label">申请状态:</div>
<div class="result-value">可申请</div>
</div>
</div>
</div>
<div class="qrcode-container" id="showqrcode">
<h3 class="result-title">二维码</h3>
<img src="" id="imgs" class="qrcode-img">
<button type="button" class="close-btn" id="close">关闭</button>
</div>
</div>
</div>
</div>
<script>
$('#close').click(function(){
$('#showqrcode').hide();
$('#theForm').show();
$('.search-container').show();
})
$(function(){
$('input[name=submit]').on('click',function(){
var username = $('input[name=username]');
var password = $('input[name=password]');
if(username.val() == ''){
layer.msg('关键词不能为空!', {time: 1500, icon: 5});
username.focus();
return false;
}
if(password.val() == ''){
layer.msg('密码不能为空!', {time: 1500, icon: 5});
password.focus();
return false;
}
var data = {
username:username.val(),
password:password.val(),
type:0
}
var url = "{eyou:url link='api/Ajax/projectsearch' /}";
$('#show').hide();
$.ajax({
url : url,
data:data,
type:'post',
dataType:'json',
success:function(res){
console.log(res);
if( res.code<=0){
if(res.code == -1){
layer.msg(res.msg, {time: 1500, icon: 5});
}else{
$('#show').show();
$('#name').html(res.name);
}
}else{
$('.search-container').hide();
$('#imgs').attr('src',res.img);
$('#showqrcode').show();
}
},
error:function(e) {
layer.closeAll();
showErrorAlert(e.responseText);
}
});
});
});
</script>
<!--底部-star-->
{eyou:include file="footer.htm" /}
<!--底部--end-->
</body>
</html>