# clock

**Repository Path**: dhl_cherish/clock

## Basic Information

- **Project Name**: clock
- **Description**: 2025年添韵打卡项目
- **Primary Language**: Unknown
- **License**: Apache-2.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-08-28
- **Last Updated**: 2025-12-04

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

> ThinkPHP5的运行环境要求PHP5.4以上。

详细开发文档参考 [ThinkPHP5完全开发手册](https://www.kancloud.cn/manual/thinkphp5/118003)

开发约定
===============

> 关于手动下载的sdk包，请勿存放于[vendor](vendor)，应将其存放于[extend](extend)

## 报错解决方案参考

+ open_basedir相关报错，参考文章：https://jingyan.baidu.com/article/f7ff0bfccce11c2e26bb1381.html
+ 后台验证码图片不显示：在[.htaccess](public/.htaccess)中加入代码：
  ~~~
  <IfModule mod_rewrite.c>
  Options +FollowSymlinks -Multiviews
  RewriteEngine On

  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteRule ^(.*)$ index.php?$1 [QSA,PT,L]

  SetEnvIf Authorization .+ HTTP_AUTHORIZATION=$0

  </IfModule>
  ~~~

## 忽略文件源代码

+ app/database.php
  ~~~
  <?php
    // +----------------------------------------------------------------------
    // | ThinkPHP [ WE CAN DO IT JUST THINK ]
    // +----------------------------------------------------------------------
    // | Copyright (c) 2006~2018 http://thinkphp.cn All rights reserved.
    // +----------------------------------------------------------------------
    // | Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
    // +----------------------------------------------------------------------
    // | Author: liu21st <liu21st@gmail.com>
    // +----------------------------------------------------------------------
    
    return [
        // 数据库类型
        'type'            => 'mysql',
        // 服务器地址
        'hostname'        => '127.0.0.1',
        // 数据库名
        'database'        => 'tp5',
        // 用户名
        'username'        => 'root',
        // 密码
        'password'        => 'root',
        // 端口
        'hostport'        => '3306',
        // 连接dsn
        'dsn'             => '',
        // 数据库连接参数
        'params'          => [],
        // 数据库编码默认采用utf8
        'charset'         => 'utf8',
        // 数据库表前缀
        'prefix'          => 'tp_',
        // 数据库调试模式
        'debug'           => true,
        // 数据库部署方式:0 集中式(单一服务器),1 分布式(主从服务器)
        'deploy'          => 0,
        // 数据库读写是否分离 主从式有效
        'rw_separate'     => false,
        // 读写分离后 主服务器数量
        'master_num'      => 1,
        // 指定从服务器序号
        'slave_no'        => '',
        // 自动读取主库数据
        'read_master'     => false,
        // 是否严格检查字段是否存在
        'fields_strict'   => true,
        // 数据集返回类型
        'resultset_type'  => 'array',
        // 自动写入时间戳字段
        'auto_timestamp'  => false,
        // 时间字段取出后的默认时间格式
        'datetime_format' => 'Y-m-d H:i:s',
        // 是否需要进行SQL性能分析
        'sql_explain'     => false,
    ];
  ~~~

## composer 安装 vendor

+ 点击下载[composer](https://getcomposer.org/Composer-Setup.exe) ，安装好之后，请重启电脑
+ 在项目中composer.json文件同级目录下执行composer install

## 调试配置

+ 配置文件：[config.php](app/config.php) ； 配置参数：app_debug 和 app_trace

## 文件命名规范

+ 控制器文件命名：首字母大写
+ 模板文件命名：对应的方法名如果使用的驼峰命名法，模板文件模板请采用小写加下划线方式命名；例：public function demoList(){} ==>  demo_list.html

## 菜单管理

+ 【首页】【管理】【系统配置】三大基础菜单请勿操作
+ 【首页】【系统配置】为系统模块，请勿写业务代码

## 封装函数

+ 后端封装函数文件：app/admin/common.php
+ 前端封装函数文件：app/index/common.php
+ 前后端封装函数文件：app/common.php

## API接口文档自动生成

+ GitHub源码[在线地址](https://github.com/greedying/makeapidoc)
+ 注释说明

~~~
/**
 * 接口名称
 * api 请求方式 接口地址
 * @param 请求参数类型 请求参数名 请求参数描述
 * @return 返回参数类型 返回参数名 返回参数描述
**/
~~~

## 弹框

### 信息提示框

+ 引入css、js

~~~
<link href="__ADMIN__/css/plugins/toastr/toastr.min.css" rel="stylesheet">

<script src="__STATIC__/jquery/jquery-3.1.1.min.js"></script>
<script src="__PLUG__/toastr/toastr.min.js"></script>
~~~

+ 使用方法，点击查看更多[详细用法](https://codeseven.github.io/toastr/demo.html)

~~~
// options这个配置参数可以不写，不写读取默认配置
toastr.options = {
    timeOut: 1000,
    positionClass: 'toast-top-full-width'
};

toastr.success('成功');
toastr.error('失败');
toastr.warning('警告');
toastr.info('提示信息');
~~~

### 询问框

+ 引入js

~~~
<script src="/static/layer/mobile/layer.js"></script>
~~~

+ 使用方法，点击查看更多[详细用法](https://jeesite.gitee.io/front/layer/3.0/layer.layui.com/mobile/index.htm)

~~~
layer.open({
    content: 'XXXXXXXXX？'
    , btn: ['确认', '取消']
    , yes: function (index) {
        layer.close(index);
        
        // 业务逻辑
    }
})
~~~

## layui-select
+ 引入文件
~~~
<link rel="stylesheet" type="text/css" href="__STATIC__/layui-select/css/layui.css"/>
<link rel="stylesheet" type="text/css" href="__ADMIN__/css/style.css">

<script src="__STATIC__/layui-select/layui.js"></script>
~~~
+ 用法
~~~
<div class="layui-form-item">
    <div id="category-select-box">

    </div>
</div>

layui.config({
    base: '__STATIC__/layui-select'
}).extend({
    selectN: './layui_extends/selectN',
    selectM: './layui_extends/selectM',
}).use(['layer', 'form', 'jquery', 'selectN'], function () {
    $ = layui.jquery;
    var form = layui.form
      , selectN = layui.selectN

    //无限级分类-基本配置
    var categorySelect = selectN({
        //元素容器【必填】
        elem: '#category-select-box'
        , search: [false, true]
        //候选数据【必填】
        , data: category_list
        , selected: category_ids
    });

    form.on('submit(demo)', function (data) {
        console.log('categorySelect 当前选中的值名：', categorySelect.selected);
        console.log('categorySelect 当前选中的值：', categorySelect.values);
        console.log('categorySelect 当前选中的名：', categorySelect.names);
        console.log('categorySelect 当前最后一个选中值：', categorySelect.lastValue);
        console.log('categorySelect 当前最后一个选中名：', categorySelect.lastName);
        console.log('categorySelect 当前最后一个是否已选：', categorySelect.isSelected);
    })
})
~~~


## select2
> 基本使用方法参考：[select2.md](select2.md)
> 
> 更多进阶使用方法参考文章：[前往查阅](https://www.cnblogs.com/makalochen/p/13229472.html)

## 后台开发使用技巧

### 列表批量删除

+ 一键删除按钮

~~~
<!--  
    data-param：不带前缀的表名（加密）
    class：all-delete-btn
-->
<button type="button" class="btn btn-primary btn-lg all-delete-btn" data-param="">一键删除</button>
~~~

+ checkbox class 设置：全选：check_all；单选：check-single

### KindEditor使用方法：

+ 详细开发文档参考 [KindEditor 4.x开发文档](http://kindeditor.net/docs/index.html)
+ 模板代码：
  ~~~
  <textarea id="editor_id"></textarea>
  <textarea name="content" data-editor="kindEditor" style="display: none"></textarea>
  ~~~
  <br />1、第一行代码中的id参数必填参数，且需要和调用initKindEditor传入的ID参数保持一致
  <br />2、第二行代码中的name参数为必填参数，data-editor="kindEditor"代码请勿删除或修改
+ js代码：
  <br />1、引入js文件代码：
  ~~~
  <script type="text/javascript" src="__PLUG__/kindeditor/kindeditor-all.js"></script>
  ~~~
  <br />2、调用富文本初始化方法：initKindEditor(editor_id, [width], [height], [items]);
  <br />  调用示例：initKindEditor('editor_id');

### 图片上传

+ 无论是单图上传还是多图上传，首先先引入封装模块放在最外层

~~~
{include file="public/cropper-img-mask" cropper_uploaded_img_ids="cropper_uploaded_img_ids" cropper_uploaded_img_paths="cropper_uploaded_img_paths" crop_preview_box="crop-preview-box" /}
{include file="public/preview-img-mask" swiper-id="cropper-preview" /}
~~~

+ #### 单图上传

~~~
<div class="box-item">
    <div class="form-group row"><label class="col-sm-1 col-form-label">封面图</label>
        <div class="col-sm-6">
            <input type="file" id="img_file" accept="image/*" style="display: none">
            <input type="hidden" class="hidden_value" name="img" id="img" value="{$info['img']|default=''}"/>
            <div class="btn btn-w-m btn-primary" onclick="uploadImage('img_file', 'img', 'form-uploaded-box-single', false, 1)">原图上传</div>
            <div class="btn btn-w-m btn-primary" onclick="openCrop('form-uploaded-box-single', 1)">裁剪上传</div>

            <div class="form-uploaded-box" id="form-uploaded-box-single" style="width: 140px">
                {if $info.img}
                <div class="form-uploaded-img-box">
                    <img class="form-uploaded-box-img" src="{:getPicture($info.img)}" data-id="{$info.img}">
                    <i class="form-uploaded-img-preview iconfont icon-yulan" onclick="previewImg(this, 'form-uploaded-img-preview')"></i>
                    <i class="form-uploaded-img-del iconfont icon-close" onclick="delImage(this, 'cropper_uploaded_img_ids', 'cropper_uploaded_img_paths', 'form-')"></i>
                </div>
                {/if}
            </div>
        </div>

    </div>
    <div class="hr-line-dashed"></div>
</div>
~~~

+ #### 多图上传

~~~
<div class="box-item">
    <div class="form-group row"><label class="col-sm-1 col-form-label">轮播图</label>
        <div class="col-sm-6">
            <input type="file" id="imgs_file" multiple style="display: none">
            <input type="hidden" class="hidden_value" name="imgs" id="imgs" value="{$info['imgs']|default=''}"/>
            <div class="btn btn-w-m btn-primary" onclick="uploadImage('imgs_file', 'imgs', 'form-uploaded-box', false, 5)">原图上传</div>
            <div class="btn btn-w-m btn-primary" onclick="openCrop('form-uploaded-box', 5)">裁剪上传</div>

            <div class="form-uploaded-box" id="form-uploaded-box">
                {volist name="info.imgs_arr" id="vo"}
                <div class="form-uploaded-img-box">
                    <img class="form-uploaded-box-img" src="{$vo.path}" data-id="{$vo.id}">
                    <i class="form-uploaded-img-preview iconfont icon-yulan" onclick="previewImg(this, 'form-uploaded-img-preview')"></i>
                    <i class="form-uploaded-img-del iconfont icon-close" onclick="delImage(this, 'cropper_uploaded_img_ids', 'cropper_uploaded_img_paths', 'form-')"></i>
                </div>
                {/volist}
            </div>
        </div>
    </div>
    <div class="hr-line-dashed"></div>
</div>
~~~

### 大视频文件分片上传

+ 使用webuploader  [查看文档](https://fex.baidu.com/webuploader/doc/index.html#WebUploader_Uploader)
+ 代码示例：详见 [form_demo.html](./app/admin/view/manage/upload_video.html)

### 后台后端控制器

+ 参数判断：GET ==> Request()->isGet() | POST ==> Request()->isPost()
+ 接收参数：POST ==> Request()->post(); | GET && POST ==> Request()->param();
+ 页面标题参数分配：$this->assign('title', '网站设置');
+ 页面返回：return $this->fetch();
+ 获取系统配置函数：C(配置标识);
+ 框架自带URL拼接函数：url(跳转地址, [参数|可使用数组], [生成的URL后缀], [域名]); 使用示例：url('demoList', ['id' => 1])  ==>
  域名/默认当前模块/默认当前控制器/demoList/id/1.html
+ 表单提交：class加上ajax-post为异步请求，例：class="btn btn-w-m btn-primary ajax-post"； 后台需使用指定的数据返回封装方法：adminReturn(状态值, 提示信息, 跳转URL,
  等待跳转时间); 成功示例：adminReturn(1, '保存成功', url('demoList')); 失败示例：adminReturn(2, '保存失败');
+ 表单返回：class加上back-page，例：class="btn btn-w-m btn-default back-page"
+ 删除数据：class加上ajax-del为异步请求，例：class="btn btn-white btn-sm ajax-del"； 后台需使用指定的数据返回封装方法：adminReturn(状态值, 提示信息, 跳转URL,
  等待跳转时间); 成功示例：adminReturn(1, '删除成功'); 失败示例：adminReturn(2, '删除失败');
+ 批量新增 && 批量修改 数据：saveAll($data); 特别说明：假设主键字段是id，$data这个数组中，【没有id】 或者 【id的值该数据表中不存在】，则会新增数据，否则会修改对应id的数据；
  具体使用说明请查阅文档：[saveAll](https://www.kancloud.cn/manual/thinkphp5/135189)
+ 新增：insert();
+ 修改：update();

### 后台前端模板

+ 前端使用后端封装函数：以url()方法为例：{:url('demoList', ['id' => 1])}
+ CSS文件引入和样式编写需使用 {block name='css'}{/block} 申明
+ JS文件引入和js代码编写需使用 {block name='js'}{/block} 申明

### 后台分页

+ 分页配置：[config.php](app/config.php) 的 【paginate】配置
+ 控制器：paginate([每页条数，不填则读取config中的配置]); $list = Db::name('user')->paginate();
+ 模板：{$list->render()}

### 列表导出Excel

+ 注意：导出excel的过程中，如果$data数据中包含有emoji表情，则导出的数据中会出现内容缺失，可调用方法removeEmoji来进行emoji表情过滤
+ 控制器命名规则：【export + 当前列表的方法名】；如下面的命名：exportSalesBonusList
+ 后台数据

 ~~~
    public function exportSalesBonusList()
    {
        $title = '文件名';
        $th = ['标题一', '标题二', '标题三'];
        $td = ['key1', 'key2', 'key3'];
        $data = [
            [
                'key1' => 'value1',
                'key2' => 'value2',
                'key3' => 'value3',
            ], [
                'key1' => 'value1',
                'key2' => 'value2',
                'key3' => 'value3',
            ]
        ];
    
        exportExcel($title, $th, $td, $data);
    }
 ~~~

+ 前端使用

 ~~~
 <!-- 关键在于class属性excel-btn -->
 <button type="button" class="btn btn-primary btn-lg excel-btn">导出</button>
 ~~~

### 时间日期插件

+ 引入css

 ~~~
<link href="/static/laydate/theme/default/laydate.css">
 ~~~

+ 控件代码

 ~~~
 <input placeholder="请选择日期" type="text" class="form-control form-control-lg screen-date" readonly>
 ~~~

+ 引入js && js代码

 ~~~
 <script src="/static/laydate/laydate.js"></script>
 <script>
    laydate.render({
        elem: '.screen-date' //指定元素
    });
 </script>
 ~~~

### 微信支付

+ JSAPI支付
  ~~~
   Loader::import('wxsdk\wxPay', EXTEND_PATH);
   $obj = new \wxPay();
   //调用示例（最后两个参数为可选参数）
   $obj->jsApi('ostuA4vgewJwo1WpDFx7itoAd0Mo', '0.01', 'SN202108204328', '商品支付', 'https://www.baidu.com/index/index/notice', '附加数据，原样返回', 1);
  ~~~

### 支付宝支付

+ 电脑网站支付
  ~~~
   Loader::import('alipaysdk\aliPay', EXTEND_PATH);
   $obj = new \aliPay();
   $obj->pcPay('SN202108204328', '0.01', '商品支付');
  ~~~
+ 手机网站支付
  ~~~
   Loader::import('alipaysdk\aliPay', EXTEND_PATH);
   $obj = new \aliPay();
   $obj->mobilePay('SN202108204328', '0.01', '商品支付');
  ~~~

### 便捷工具 - MYSQL

+ 1、后台正常新增 数据表-设计表
+ 2、正常新增一个数据表（tp_test）完成之后，在app/command/database文件夹下面会存在一个sql文件：tp_test.sql
+ 3、以上述新增的tp_test数据库为例，运行下面命令行导入到数据库：

> php think importSql tp_test