首页
共享系统
文档中心
关于我们
开发社区
注册/登录控制台
我们的服务
共享系统
文档中心
关于我们
交流论坛
免费注册
登入控制台
在线咨询
初始化一个模板项目
初始化一个模板项目
纠错上报
一、创建一个新的模板项目
创建一个新的文件夹,文件夹名称需要英文,不得有中文符号,推荐不要太长,6-10个字符即可
二、模板目录结构
├─ config.php 配置文件
├─ configuration_page.php 配置页面
├─ index.php 入口文件
├─ page 页面存放文件夹
├─ page/index.php
二、编写相关信息
在文件夹中创建一个pack.json文件,并写入如下代码
{
"name":"您的模板名称 例如:我的模板",
"version":"您的模板版本号:例如:V1.0.0",
"picture":"这里是您的模板展示图 例如:https://imgsbad.semoun.com/uploads/2025/01/22/6790f5f715336.png",
"introduce": "这里是模板介绍 例如:系统自带,包含PC+移动端",
"ProgramCode": "这里是模板编码 例如:mytep",
"tepid": "这里是模板ID 需要和文件夹名称一致 若您的模板文件夹名称为:mytep,则tepid的值为:mytep"
}
在文件夹中创建一个config.php文件,说明:这是您模板的配置文件,例如您模板的自定义配置,请自行添加,具体可参考系统自带模板的config.php文件
<?php
return array (
"mid"=>"apptep20", // 这是必要的 是您模板的ID
// 示例配置:是否显示公告通知
"show_notice"=>false
// 注意:配置文件会通过获取系统配置API接口返回您模板的所有配置信息,因此,这里不要存放任何敏感信息,例如:数据库配置,密码等
);
在文件夹中创建一个configuration_page.php文件,说明:这是您的模板配置页面,具体可参考系统自带模板的configuration_page.php文件,会在后台的模板配置中显示,由于官方用的是Vue,因此,我们使用Vue来渲染页面,因此,您需要使用Vue来编写您的配置页面,具体可参考系统自带模板的configuration_page.php文件
<?php
// 读取配置文件
$configFile = __DIR__ . '/./config.php';
$config = include($configFile);
// 检查是否有更新请求 POST请求则是更新配置
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
$newStyle = $_POST['show_notice'] ?? $config['show_notice'];
// 更新配置文件 过程省略...
// 返回状态
echo json_encode(['status' => 'success', 'message' => '配置已更新']);
exit; // 结束脚本,不渲染 HTML
}
/* 获取配置文件 */
$packFile = __DIR__ . '/./pack.json';
// 读取文件内容
$jsonContent = file_get_contents($packFile);
// 将 JSON 字符串转换为 PHP 数组
$pack = json_decode($jsonContent, true);
?>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>更新配置</title>
<link rel="stylesheet" href="/static/app_store_deft/assets/css/config_page.min.css">
</head>
<body>
<div class="container" id="TePage">
<div class="page_config_home">
<div class="page_config_home_item">
<p class="page_config_home_item_title">是否显示公告通知</p>
<div class="page_config_home_item_content">
<p :class="{style_deft:true,show_ok:from.show_notice}" @click="from.show_notice = true">显示</p>
<p :class="{style_deft:true,show_ok:!from.show_notice}" @click="from.show_notice = false">不显示</p>
</div>
</div>
</div>
<button class="gengx_but" @click="updateStyle()">更新样式</button>
</div>
<script src="/static/app_store_deft/assets/js/vue.js"></script>
<script src="/static/app_store_deft/assets/js/axios.js"></script>
<script>
const {createApp,ref} = Vue;
const TePage = createApp({
setup() {
/* 配置文件 */
const from = ref({
show_notice: <?php echo $config['show_notice'] ?? false ?>,
})
async function updateStyle() {
const tepid = "<?php echo $pack['tepid']; ?>"; // 从 PHP 获取 tepid
await axios.post('/apiv3/geteitep_page',{
tepid: tepid,
...from.value
},{
// headers 如无需要 不要动
headers: {
'Authadmincode': localStorage.getItem("xu_admin_token"),
'Content-Type': 'application/x-www-form-urlencoded'
}
}).then(res=>{
if(res.data.status == 'error'){
alert('更新失败 请检查文件权限',res.data.message)
}else {
alert("更新成功");
}
})
}
return {
from,
swapArrayElements,
updateStyle,
};
}
});
TePage.mount('#TePage');
</script>
</body>
</html>
模板更新接口是固定的POST请求,您可以利用接口自由开发
接口地址为:/apiv3/geteitep_page
请求方式:POST
请求头:
{
'Authadmincode': localStorage.getItem("xu_admin_token"), // 这个是后台登录的token 需要用js获取
'Content-Type': 'application/x-www-form-urlencoded'
}
传参类型:
{
tepid: 'mytep',// 这是模板ID
show_notice: true,// 这是配置文件里的配置项
}
创建一个index.php文件,说明:这是您的模板首页,具体可参考系统自带模板的index.php文件
<?php
// 获取请求的 URI
$path = $_SERVER['REQUEST_URI'];
// 使用 parse_url 去除查询字符串,只保留路径部分
$parsed_url = parse_url($path);
$path = isset($parsed_url['path']) ? $parsed_url['path'] : '/';
// 检查路径是否是根目录 '/',如果是则包含 'index.php'
if ($path === '/' || $path === '') {
include __DIR__ . "/page/index.php";
} else {
$page = ltrim($path, '/');
include __DIR__ . "/page/" . $page . ".php";
}
?>