Documentation

Introduction

Thank you for purchasing our Drug Store theme. If you have any questions that are beyond the scope of this help file, please feel free to contact us here Pepdev or mail us at support@pepdev.com.

Drug Store is a pharmacy management system developed with PHP. Drug Store theme is an affordable solution to help grow your business and track your store data like stock, purchases, billings and report, purchase report and so many things. It store all of your pharmacy data for easy retrieval and tracking including your Medicines, Employees, Customers, POS/Bill, Invoice, Purchase, Stock Adujstment, Accounting, Expenses, Attendence, Payroll, Attendance, Reports and Users. You can create multiple admin role. Manage all from one simple yet powerful application.

Support does include:

  • Availability of the author to answer questions
  • Answering technical questions about item’s features
  • Assistance with reported bugs and issues

Support does not include:

  • Custmaization Work
  • Any Installation Work
  • Support for any Third Party Plugins / Software
  • Solve bug in your customized version
General Information

Software requirements

  • Sublime Text 3 used to edit the .HTML, .JS, .CSS, .SCSS, .php files
  • Koala used as precompiler for SCSS to CSS convert.

Drug Store comes with a flexible file structure that can be easily used.

The following scheme displays the template files structure.

  • Documentation - contains documentation of template cusotmisation and support
  • License - contains License file of template
  • Theme - contains the main files of the theme. which will be uploaded on server.
    • App - Contains Controller, Model and Views Files
    • Builder - contains sytem files like router, session, Mailer and more.
    • Config - contains configuration files.
    • Install - contains installation files(Please delete this folder after installation).
    • Public - contains CSS, JS, Images files.
  • Screenshot - Contains screenshot of theme.
  • Sources - Contains screenshot of theme.
    • sass - contains .css SCSS files used in the theme.
    • DB File - contains .css Database .mysql file used in the theme.
  • readme.txt - contains the information about theme.
File Strucutre

HTML file Structure

This template has a responsive layout. below is smaple code of HTML

									
										<!DOCTYPE html>
										<!DOCTYPE html>
										<html lang="en">

										<head>
										<meta charset="UTF-8">
										<meta http-equiv="X-UA-Compatible" content="IE=edge">
										<meta name="viewport" content="width=device-width, initial-scale=1">
										<title>Drug Store | Admin Panel
										<link rel="icon" type="image/x-icon" href="public/images/favicon.png">
										
										<link href="https://fonts.googleapis.com/css?family=Dosis:500,600" rel="stylesheet">
										<link href="https://fonts.googleapis.com/css?family=Poppins:300,400,500" rel="stylesheet">
										
										<link rel="stylesheet" href="public/css/jquery-ui.min.css" />
										<link rel="stylesheet" href="public/css/datatables.min.css">
										<link rel="stylesheet" href="public/css/bootstrap-select.min.css" />
										<link rel="stylesheet" href="public/css/morris.css" />
										<link rel="stylesheet" href="public/css/dropzone.min.css">
										<link rel="stylesheet" href="public/css/perfect-scrollbar.css">
										<link rel="stylesheet" href="public/css/style.css" />
									
								

CSS file Structure

any styles need to be changed just replace it with the wanted styles in the respective block in your style.scss.

									

										.h-200 
										{
											max-height: 200px;
											position: relative;
											overflow-y: auto;
										}
										.h-250 
										{
											max-height: 250px;
											position: relative;
											overflow-y: auto;
										}
										.h-300 
										{
											max-height: 300px;
											position: relative;
											overflow-y: auto;
										}
										.h-350 
										{
											max-height: 350px;
											position: relative;
											overflow-y: auto;
										}
										.h-400 
										{
											max-height: 400px;
											position: relative;
											overflow-y: auto;
										}
										.h-500 
										{
											max-height: 500px;
											position: relative;
											overflow-y: auto;
										}
										.h-600 
										{
											max-height: 600px;
											position: relative;
											overflow-y: auto;
										}
									
								

JS file Structure

This template has dynamic animations, which have been implemented in JavaScript. The JS file is custom.js.

									
										//*************************************************
										//Sidebar menu  ***********************************
										//*************************************************
										$('body').on('click', '.open-sidebar-right', function () 
										{
											var ele = $(this);
											$('body').css('overflow', 'hidden');
											$('body').append('
'); setTimeout(function(){ $('.sidebar-right').css('right', '0'); }, 50); }); $('body').on('click', '.sidebar-close, .overlay', function () { $('body').css('overflow', 'visible'); $('.sidebar-right').css('right', '-450px'); setTimeout(function(){ $('.overlay').remove(); }, 200); }) //************************************************* //Left Side menu ********************************* //************************************************* $('body').on('click', '.menu-close', function () { var ele = $(this); $('#main-wrapper').addClass('page-menu-small'); ele.find('i').removeClass('fa-hand-point-left'); ele.find('i').addClass('fa-hand-point-right'); ele.removeClass('menu-close'); ele.addClass('menu-open'); }); $('body').on('click', '.menu-open', function () { var ele = $(this); $('#main-wrapper').removeClass('page-menu-small'); ele.find('i').removeClass('fa-hand-point-right'); ele.find('i').addClass('fa-hand-point-left'); ele.removeClass('menu-open'); ele.addClass('menu-close'); });
Font Family

We have used google fonts for the template you can change whatever font you wish

									
										@import url('https://fonts.googleapis.com/css?family=Poppins:300,400,500');
										@import url('https://fonts.googleapis.com/css?family=Dosis:500,700');

										$font: 'Poppins', sans-serif;
										$fontHeading: "Dosis", 'Poppins', sans-serif;
									
								
SCSS

Apez Admin Template is based on scss and we import all the file into style.css you can simply edit any scss and compile it. We have used koala compiler for compile.

									
										/************************************************
										[ ICON CSS START ] ******************************
										*************************************************/
										@import '../fonts/line-awesome/css/line-awesome.min.css';

										/************************************************
										[ BOOTSTRAP START ] *****************************
										*************************************************/
										@import "bootstrap/bootstrap.scss";

										/************************************************
										[ BASIC CSS START ] *****************************
										*************************************************/
										@import "_variable.scss";

										/************************************************
										[ SHORTCODES CSS START ] ************************
										*************************************************/
										@import "_shortcodes.scss";

										/************************************************
										[ TYPOGRAPHY CSS START ] ************************
										*************************************************/
										@import "_typography.scss";

										/************************************************
										[ TYPOGRAPHY CSS START ] ************************
										*************************************************/
										@import "_calendar.scss";

										//Menu Css
										.menu-dropdown {
										    top: 100%;
										    text-align: left;
										    position: absolute;
										    z-index: 999;
										    padding-top: 10px;
										    width: 280px;
										    line-height: 1.6;
										    border-radius: 6px;
										    visibility: hidden;
										    opacity: 0;
										    -webkit-transform: translateY(20px);
										    -moz-transform: translateY(20px);
										    -ms-transform: translateY(20px);
										    -o-transform: translateY(20px);
										    transform: translateY(20px);
										    -webkit-transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
										    -moz-transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
										    -ms-transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
										    -o-transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);
										    transition: all 0.6s cubic-bezier(0.18, 0.89, 0.32, 1.28);

										    .arrow {
										        display: none;
										        top: -10px;
										        left: 50%;
										        position: absolute;
										        width: 0;
										        height: 0;
										        border-color: transparent transparent $color-primary transparent;
										        border-style: solid;
										        border-width: 10px 10px 10px 10px;

										        &::after {
										            content: " ";
										            position: absolute;
										            display: block;
										            width: 0;
										            height: 0;
										            border-color: transparent transparent $color-primary transparent;
										            border-style: solid;
										            border-width: 10px 10px 10px 10px;
										            left: -10px;
										            bottom: -10px;
										        }
										    }

										    .arrow-left {
										        left: 20px;
										    }

										    .arrow-right {
										        left: unset;
										        right: 20px;
										    }
										}

										.menu-dropdown-inner {
										    background-color: $colorF;
										    border-radius: 4px;
										    box-shadow: 0px 0px 15px 1px rgba(69, 65, 78, 0.2);
										}

										.menu-dropdown-head {
										    font-size: 24px;
										    color: $colorF;
										    text-align: center;
										    padding: 16px 12px;
										    font-family: $fontHeading;
										    background: $color-primary;
										    border-top-left-radius: 4px;
										    border-top-right-radius: 4px;
										}

										.menu-dropdown-body {
										    font-family: $fontHeading;
										    padding: 10px 20px 10px 20px;
										}
									
								
Reference File

In this template jQuery libraries and plugins have been used for dynamic animation and other features.

  • Moment
  • jQuery (3.3.1)
  • jQuery UI (1.12.1)
  • Popper
  • Bootstrap (4.0.0)
  • Chartjs
  • Perfect Scrollbar (v1.4.0)
  • Scrolltofixed
  • Datatable (1.10.18)
  • Dropzone (5.5.0)
  • Summernote (v0.8.12)
  • Toastr
  • blockUI (2.70.0)
  • Daterangepicker
  • jquery fancybox (v3.1.28)
Icons

We have used multiple icons. Below is list of all icons

Line awesome las la-tag Official Page
Installation

First time you have to configure and then you are good to go. We have created automatic installer to install Drug Store theme. Automatic installer is similar to wordpress and opencart.

1 .First method for installing theme Using Installer (Recommended)

  • Create Database and Database User in your Database and remeber credential of it.
  • Unzip the downloaded package in an empty directory and upload everything from upload folder to your server directory.
  • Open browser (like - chrome) and run your server directory URL (like - yourdomain.com) in browser. It will take you to automatic installer
  • Installer will ask database credentials and other info like mail, mobile number etc.
  • Once you enter these information. Installation will be done.
Install
Install
Install

Installtion is similar to wordpress installtion. If you need more help on installation. Please send us mail on pepdevofficial@gmail.com

Note - This is automatic process. You do not have to open any code file.

2 .Second method for installing theme or Manual Process

If you are not comfortable with installer than you can go for manual process. Do not worry installer just fill database information in config.php file and load dummy data in database.

  • Create Database and Database User in your Database and remeber credential of it.
  • After that import drugstore.sql file(which is available in Source/DB file folder) in your Database which you have created.
  • Unzip the downloaded package in an empty directory and upload everything from upload folder to your server directory.
  • After that you need to put that credentials in file(config.php).
    This file located in config folder which is in main code folder.
    Please update Database information, Directory path and Web URL in these config files. See the below structure of config file.
  • Run your URL and it will open DrugStore theme.
Config File
									
										/*This name will represent title in auto generated mail*/
										define('NAME', 'Drug Store');
										/*Domain name like www.yourdomain.com*/
										define('URL', '');


										/*Application Address*/
										define('DIR_ROUTE', 'index.php?route=');
										define('DIR', '');
										define('DIR_APP', DIR.'app/');
										define('DIR_BUILDER', DIR.'builder/');
										define('DIR_VIEW', DIR_APP.'views/');
										define('DIR_IMAGE', DIR.'public/images/');
										define('DIR_UPLOADS', DIR.'public/uploads/');
										define('DIR_STORAGE', DIR_BUILDER.'storage/');
										define('DIR_LIBRARY', DIR_BUILDER.'library/');
										define('DIR_VENDOR', DIR_BUILDER.'vendor/');
										define('DIR_LANGUAGE', DIR_APP.'language/');


										/** MySQL settings - You can get this info from your web host **/
										/*MySQL database host*/
										define('DB_HOSTNAME', 'localhost');
										/*MySQL database username*/
										define('DB_USERNAME', '');
										/*MySQL database password*/
										define('DB_PASSWORD', '');
										/*MySQL database Name*/
										define('DB_DATABASE', '');
										/*Table Prefix*/
										define('DB_PREFIX', 'kk_');


										define('AUTH_KEY', '');
										define('LOGGED_IN_SALT', '');
										define('TOKEN', '');
										define('TOKEN_SALT', '');
									
								
C . Open Admin panel

To open admin panel type url. For example www.your-domain.com

Your admin panel credentials if you are going through manual process

Username - admin

password - Test@123

For security reasons Please change password after first login in admin panel.

Features
Dashboard
Customers
Invoices
POS/Bill
Purchase
Stock Adjustment
Inventory/Medicines
Expenses
Attendance
Payroll Management
Noticeboard
Doctors
Admin User & Role
Send Email
System Info
Admin Customization
Charts
Taxes
Payment Methods
Invoice Items
Expense Items
Suppliers
User Role Permission

Login as admin in admin portal. In Left side menu, Go to user role.

You can create and update user role permission. Only admin can make changes in user role.

Help & Support

24/7 Support, Just mail us any issue we will be happpy to help.

For any issue create ticket by clicking here support

Or you can email us.

Email - support@pepdev.com

Thank you for purchasing drug store theme . If you have any question that is beyond the scope of this documentation, Please feel free to create a support ticket using Our Support Site or send an email to support@pepdev.com.

Thank you