README

典型的Publisher表单

安装

composer, 小宝贝。

$ php composer.phar require --prefer-dist pers1307/form "dev-master"

这里有什么？

只是一个典型的表单构建示例。下载并复制。

安装模态框的说明

• 添加样式

    .js-noDisplay {
      display: none;
    }

• 复制模态框，通常格式如下

    <div class="js-noDisplay">
        <div class="modal-window-close"></div>

        <div class="modalTitle">
            Сделать заказ на звонок
        </div>

        <div class="modal">
            <div class="modalContent">
                <form
                    class="js-form-order"
                    action="/api/order.order/"
                    method="post"
                    data-file="/api/order.file/"
                    data-deleteFile="/api/order.deleteFile/"
                    >
                    <label class="labelBlock">
                        <span>Имя <i>*</i></span>
                        <input type="text" name="name" autocomplete="off">
                    </label>

                    <label class="labelBlock">
                        <span>Телефон <i>*</i></span>
                        <input type="text" name="phone" autocomplete="off">
                    </label>

                    <label class="labelBlock">
                        <span>E-mail <i>*</i></span>
                        <input type="text" name="email">
                    </label>

                    <label class="labelBlock">
                        <span>Комментарий <i>*</i></span>
                        <textarea name="comment" style="resize: none"></textarea>
                    </label>

                    <div class="fileUpload js-fileUploadArea">
                        <label class="fileUploadButton">
                            <input name="files">
                            Прикрепить файл
                        </label>

                        <div class="fileUploadList js-fileUploadList">
                        </div>
                    </div>

                    <input type="text" class="address" name="address">

                    <button class="button">Заказать</button>
                </form>
            </div>
        </div>

    </div>

• 将文件连接到配置文件。文件位于：js-src

  • jQuery.js
  • jquery.maskedinput.js
  • plupload.full.min.js
  • modalWindow.js
  • modalWindowConfig.js

• 根据需要配置modalWindowConfig.js

• 添加loader类和预加载图片。

    .loading {
      position: relative;
      &:after {
        content: "";
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        right: 0;
        background: rgb(255, 255, 255) url(../images/preload.gif) 50% 50% no-repeat;
        background: rgba(255, 255, 255, 0.8) url(../images/preload.gif) 50% 50% no-repeat;
        width: 100%;
        height: 100%;
        z-index: 10;
      }
    }

• 将www/UPLOAD/tmp_files/*添加到.gitignore中。

• 设置api阶段（示例在src中）

• 在数据库中展开表格以存储邮件

    DROP TABLE IF EXISTS `mp_mails`;
    CREATE TABLE `mp_mails` (
      `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
      `subject` varchar(255) NOT NULL,
      `from` varchar(255) NOT NULL,
      `text` text NOT NULL,
      `files` text NOT NULL,
      PRIMARY KEY (`id`)
    ) ENGINE=MyISAM AUTO_INCREMENT=31 DEFAULT CHARSET=utf8;

• 设置邮件格式阶段，示例文件在email-src中

• 设置cron队列（自定义）

• 设置管理员界面中显示邮件的模块

  连接添加申请到数据库的模块

  • 复制标准模块并重命名为：list。

  • 将代码插入模块

        return pers1307\form\OrderList::getConfig(ROOT_PLACE);

  • 安装模块。

  • 将sql文件导入数据库

      DROP TABLE IF EXISTS `mp_list`;
      CREATE TABLE `mp_list` (
        `id` int(10) unsigned NOT NULL AUTO_INCREMENT,
        `path_id` int(11) NOT NULL,
        `order` int(11) NOT NULL,
        `date` timestamp NULL DEFAULT CURRENT_TIMESTAMP,
        `title` varchar(255) NOT NULL DEFAULT '',
        `text` text NOT NULL,
        PRIMARY KEY (`id`)
      ) ENGINE=MyISAM DEFAULT CHARSET=utf8;

• 如有必要，对过程进行额外自定义。

• 测试邮件

• 在将网站迁移到主机时，为管理员添加备注。

作者

• 佩列斯科科夫尤里（pers1307）

许可证

MIT许可证（MIT）。请参阅许可证文件以获取更多信息。