AntOA: использование

1. Использование перед подготовкой

О облачном хранилище

В настоящее время поддерживается только загрузка в облако Qiniu, функция загрузки на сервер находится в процессе реализации.

О пользовательских страницах

Функция пользовательской страницы завершена, подробности см. в разделе 4 «Пользовательские страницы и плагины».

О расширяемости плагина

Функция настраиваемого плагина завершена, подробности см. в разделе 4 «Настраиваемые страницы и плагины».

О функциях, связанных со значениями по умолчанию

В процессе написания.

2. Использование фреймворка

1. Установка и развёртывание

Laravel-modules

Поскольку проект разрабатывается на основе laravel-modules, вам необходимо установить laravel-modules для поддержки этой структуры. Способ установки laravel-modules: https://nwidart.com/laravel-modules/v6/installation-and-setup

Nodejs

Поскольку страница бэкэнда требует использования npm или yarn для упаковки, вам потребуется установить nodejs при разработке или развёртывании и убедиться, что npm работает нормально.

Создание модуля AntOA и клонирование покрытия

После установки laravel-modules вы можете напрямую использовать командную строку для создания регистрации и покрытия этого модуля:

Windows:

$ php artisan module:make AntOA 
$ cd Modules
$ rmdir AntOA /S /Q
$ git clone https://github.com/similing4/AntOA.git

Linux:

$ php artisan module:make AntOA 
$ cd Modules
$ rm AntOA -rf
$ git clone https://github.com/similing4/AntOA.git

После завершения установки вам нужно использовать npm или yarn, чтобы установить и упаковать страницу в public, иначе вы не сможете получить доступ к странице:

Использование npm:

$ cd Modules/AntOA/frontend
$ npm install
$ npm run build

Использование yarn:

$ cd Modules/AntOA/frontend
$ yarn
$ yarn build

Примечание: каждый раз, когда добавляется новый плагин, связанный с модулем AntOA (и связанные с расширением функции страницы), вам необходимо переупаковывать, то есть повторно выполнять вышеуказанный скрипт.

2. Изменение конфигурации

config.php

Измените файл /config/antoa.php, чтобы реализовать конфигурацию меню и страниц бэкэнда. Подробности см. в файле примера Config/config.php.example этого проекта. Если вы используете функцию, связанную с загрузкой файлов, такую как загрузка файлов, загрузка изображений, загрузка изображений Wangeditor и т. д., вам необходимо настроить информацию об облаке Qiniu в файле конфигурации.

Seeder

Авторизация модуля зависит от таблицы администратора базы данных, поэтому необходимо создать таблицу суперпользователя:

$ php artisan module:seed AntOA

О независимой разработке внешнего интерфейса

Мы не рекомендуем вам разрабатывать таким образом, потому что это может привести к потере атомарности AntOA и может вызвать проблемы, которые не могут быть применены к другим расширениям. Мы рекомендуем вам использовать метод разработки расширений AntOA в разделе 4 «Пользовательские страницы и плагины», чтобы реализовать пользовательские функции. Если вы настаиваете на независимой разработке, вы можете изменить конфигурацию домена проекта переднего плана: Modules/AntOA/frontend/.env, измените значение VUE_APP_API_BASE_URL на ваш домен (например, http://www.baidu.com, обратите внимание, что в конце нет косой черты) и разверните его. задний конец проекта должен быть междоменным.

Настройка кросс-домена: найдите /public/index.php, добавьте следующий код в начало:

if($_SERVER['REQUEST_METHOD'] == 'OPTIONS'){
    header('Access-Control-Allow-Origin:*');
    header("Access-Control-Allow-Headers:Origin, X-Requested-With, Authorization, Content-Type, Accept, x-access-token, X-CSRF-TOKEN, token");
    header('Access-Control-Allow-Credentials:true');
    header('Access-Control-Allow-Methods:GET,POST,OPTIONS');
    header('Access-Control-Max-Age:1728000');
    header('Content-Type:text/plain charset=UTF-8');
    header('Content-Length: 0', true);
    header('status: 200');
    header('HTTP/1.0 204 No Content');
    exit;
}else{
    header('Access-Control-Allow-Origin:*');
    header('Access-Control-Allow-Methods: GET,POST,PUT,DELETE,OPTIONS,PATCH');
    header('Access-Control-Allow-Credentials:true');
    header("Access-Control-Allow-Headers:Origin, X-Requested-With, Authorization, Content-Type, Accept, x-access-token, X-CSRF-TOKEN, token");
}

3. Начало разработки

Здесь мы рекомендуем разрабатывать в новом модуле, чтобы облегчить обработку пакетов проекта.

$ php artisan module:make SoftwareManager

Среди них SoftwareManager — это имя модуля, которое можно назвать произвольно, здесь в качестве примера используется SoftwareManager.

Контроллер

Вам необходимо создать класс, который наследуется от класса AntOAController и реализует его методы, например:

namespace Modules\SoftwareManager\Http\Controllers;

use Illuminate\Http\Request;
use Modules\AntOA\Http\Controllers\AntOAController;
use Modules\AntOA\Http\Utils\AuthInterface;
use Modules\AntOA\Http\Utils\Grid;

class SoftwareManagerController extends AntOAController {
    public function __construct(AuthInterface $auth) {
        parent::__construct($auth);
    }
    /**
     * Инициализация объекта Grid
     * @param Grid $grid
     */
    public function grid(Grid $grid) {
        ;//Реализовать самостоятельно
    }
    /**
    * Обработка статистических данных
    * @param Request $req клиентский запрос параметров
    * @return string результат статистики
    */
    public function statistic(Request $req) {
        return "";
    }
    //Другие пользовательские методы, страницы и т.д.
}

Где метод Grid — это содержимое списка страниц, страниц редактирования и создания, которые мы хотим написать. Конкретный метод написания см.: Использование Grid.

Маршрут

Только создание контроллера не соответствует соответствующему маршруту бэкэнда, и соответствующий интерфейс не может быть доступен. Поэтому вам необходимо настроить требуемый маршрут в соответствующем модуле: Например, измените /Modules/SoftwareManager/Routes/api.php (web.php не нужно изменять):

use Illuminate\Support\Facades\Route;
use Modules\AntOA\Http\Utils\RouteRegister;

Route::prefix('software')->group(function() { //Здесь software должно совпадать с настройкой в web
    RouteRegister::registerApi('/home', 'SoftwareManagerController');
});
//Этот пример регистрирует /api/software/home/list, /api/software/home/create, /api/software/home/detail, /api/software/home/edit и другие маршруты, то есть необходимые интерфейсы переднего плана для контроллера SoftwareManagerController.

Затем откройте свой домен /antoa/webpack/index.html, чтобы увидеть эффект. Управление маршрутами используется для управления маршрутами, пользовательскими страницами, маршрутами-охранниками и т. д.

Если вам нужно настроить собственные маршруты, то необходимо создать файл antoa_plugin.js в корневом каталоге вашего модуля со следующим содержимым:

const install = (Vue) => {
    
};

const routes = [{
    path: '/software/test/diy_list',
    name: 'Тестовая страница списка',
    component: () => import('./test.vue')
}];

const dealRouter = (router)=>{
    
};
export default {
  install,
  routes,
  dealRouter
};

Здесь функция install будет вызываться через Vue.use в main.js. Конфигурацию маршрутов можно посмотреть в моём примере. Функция dealRouter будет вызываться в main.js, параметр — это объект VueRouter проекта, вы можете использовать этот объект для настройки некоторых функций охраны маршрутов.

Пользовательские плагины

Пользовательские плагины используются для расширения методов list, filter, create, edit и других для удовлетворения различных потребностей.

Если вы хотите определить новый метод расширения:

На стороне сервера вам необходимо наследовать соответствующий класс сущности в PHP. Например, для фильтрации страницы списка необходимо наследовать класс ListFilterBase и так далее. Для получения подробной информации обратитесь к папке Modules\AntOA\Http\Utils\AbstractModel, чтобы просмотреть определение родительского класса соответствующей сущности, и к папке Modules\AntOA\Http\Utils\Model, чтобы увидеть реализацию. Примечание: поле type в методе jsonSerialize соответствующей сущности должно совпадать с именем Vue на стороне клиента. Рекомендуется, чтобы имена файлов, поля type и имена файлов Vue были одинаковыми.

На стороне клиента вам необходимо создать папку antoa_components в корневом каталоге вашего модуля. Папка может содержать следующие подпапки: PluginListFilter — эта папка используется для пользовательских компонентов фильтрации страниц списка. Файлы Vue, соответствующие PluginListFilter в этой папке, будут внедрены в list.vue. Пример кода см. в любом файле папки frontend/src/pages/common/components/list/filter. PluginListTableColumn — эта папка используется для отображения пользовательских компонентов столбцов страниц списка. Файлы Vue, соответствующие PluginListTableColumn в этой папке, будут внедрены в list.vue. Пример кода см. в любом файле папки frontend/src/pages/common/components/list/table_column. PluginCreateColumn — эта папка используется для создания пользовательских компонентов столбцов. Файлы Vue, соответствующие PluginCreateColumn в этой папке, будут внедрены в create.vue. Пример кода см. в любом файле папки frontend/src/pages/common/components/create/column_column. PluginEditColumn — эта папка используется для редактирования пользовательских компонентов столбцов. Файлы Vue, соответствующие PluginEditColumn в этой папке, будут внедрены в edit.vue. Пример кода см. в любом файле папки frontend/src/pages/common/components/edit/column_column.