Advertisement
Guest User

Untitled

a guest
Feb 18th, 2020
145
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 25.56 KB | None | 0 0
  1. @extends('Backend.app')
  2. @section('extra-css')
  3. <!-- Include SmartWizard CSS -->
  4. <link href="{{URL::to('public/assets/smartwizard/dist/css/smart_wizard.css')}}" rel="stylesheet" type="text/css" />
  5. <!-- Optional SmartWizard theme -->
  6. <link href="{{URL::to('public/assets/smartwizard/dist/css/smart_wizard_theme_circles.css')}}" rel="stylesheet" type="text/css" />
  7. <link href="{{URL::to('public/assets/smartwizard/dist/css/smart_wizard_theme_arrows.css')}}" rel="stylesheet" type="text/css" />
  8. <link href="{{URL::to('public/assets/smartwizard/dist/css/smart_wizard_theme_dots.css')}}" rel="stylesheet" type="text/css" />
  9.  
  10. <link rel="stylesheet" href="{{URL::to('public/assets/node_modules/html5-editor/bootstrap-wysihtml5.css')}}" />
  11. <style type="text/css">
  12. .btn-success {
  13. margin-top: -31px;
  14. }
  15. </style>
  16. @endsection
  17. @section('content-header')
  18. <!-- Content Header (Page header) -->
  19. <div class="page-wrapper">
  20. <div class="container-fluid">
  21. <div class="row page-titles">
  22. <div class="col-md-5 align-self-center">
  23. <h4 class="text-themecolor">Add Product</h4>
  24. </div>
  25. <div class="col-md-7 align-self-center text-right">
  26. <div class="d-flex justify-content-end align-items-center">
  27. <ol class="breadcrumb">
  28. <li class="breadcrumb-item"><a href="javascript:void(0)">Home</a></li>
  29. <li class="breadcrumb-item active">Add Product</li>
  30. </ol>
  31. <!-- <button type="button" class="btn btn-info d-none d-lg-block m-l-15"><i class="fa fa-plus-circle"></i> Create New</button> -->
  32. </div>
  33. </div>
  34. </div>
  35. @endsection
  36. @section('main-content')
  37. <section class="content">
  38. <!-- Custom Tabs -->
  39. <div class="box box-default">
  40. <div class="box-header with-border">
  41. <h4 class="box-title">
  42. <!-- <a href="" class="btn btn-success btn-md">
  43. <i class="fa fa-hand-o-left"></i>&nbsp;
  44. View Product
  45. </a> -->
  46. </h4>
  47. </div>
  48. <div class="box-body">
  49. <div class="row">
  50. <div class="col-md-12">
  51. <form action="{{route('product.save-product.post')}}" id="myForm" role="form" data-toggle="validator" method="post" accept-charset="utf-8" novalidate="true" enctype="multipart/form-data" class="userForm">
  52. {{csrf_field()}}
  53. <!-- SmartWizard html -->
  54. <div id="smartwizard">
  55. <ul>
  56. <li><a href="#step-1">Step 1<br /><small>Product Information</small></a></li>
  57. <li><a href="#step-2">Step 2<br /><small>Product Image</small></a></li>
  58. <li><a href="#step-3">Step 3<br /><small>Product Item</small></a></li>
  59. </ul>
  60. <div>
  61. <div id="step-1" class="">
  62. <div class="card"></div>
  63. <section>
  64. <div class="row">
  65. <div class="col-md-6">
  66. <div class="form-group">
  67. <label for="name">Category : <span class="danger">*</span> </label>
  68. {{ Form::select('category_id',$categories,null, ['class' => 'form-control', 'id' => 'category_id','required' => '']) }}
  69. </div>
  70. </div>
  71.  
  72. <div class="col-md-6">
  73. <div class="form-group">
  74. <label for="name">Brand : <span class="danger">*</span> </label>
  75. {{ Form::select('brand_id',$brands,null, ['class' => 'form-control', 'id' => 'brand_id','required' => '']) }}
  76. </div>
  77. </div>
  78.  
  79. </div>
  80.  
  81. <!--<div class="row">-->
  82.  
  83. <!-- </div>-->
  84.  
  85. <div class="row">
  86. <div class="col-md-6">
  87. <div class="form-group">
  88. <label for="title"> Product Title : <span class="danger">*</span> </label>
  89. <input type="text" class="form-control" id="title" name="title" value="" required=""/> </div>
  90. </div>
  91. <div class="col-md-6">
  92. <div class="form-group">
  93. <label for="weight">Weight : <span class="danger"></span> </label>
  94. <input type="number" class="form-control" id="weight" name="weight" value=""> </div>
  95. </div>
  96. </div>
  97.  
  98. <div class="row">
  99. <div class="col-md-6">
  100. <div class="form-group">
  101. <label for="wlocation2"> CM : <span class="danger"></span> </label>
  102. <input type="number" class="form-control" id="cm" name="cm" value="">
  103. </div>
  104. </div>
  105. <div class="col-md-6">
  106. <div class="form-group">
  107. <label for="title"> Curier Unit : <span class="danger">*</span> </label>
  108. <select class="form-control" name="curier_unit" id="curier_unit" required="">
  109. <option selected="" disabled="">Please Select a Unit</option>
  110. <option value="1">Small</option>
  111. <option value="2">Medium</option>
  112. <option value="3">Large</option>
  113. </select>
  114. </div>
  115. </div>
  116. <!--<div class="col-md-6">-->
  117. <!-- <div class="form-group">-->
  118. <!-- <label for="wdate2">Cupon Check :</label>-->
  119. <!-- <input type="text" class="form-control" id="cupon_check" name="cupon_check" value="">-->
  120. <!-- </div>-->
  121. <!--</div>-->
  122. </div>
  123.  
  124. <div class="row">
  125. <div class="col-md-6">
  126. <div class="form-group">
  127. <label for="wlocation2"> What In Box : <span class="danger"></span> </label>
  128. <textarea name="what_in_box" class="form-control" rows="20"></textarea>
  129. </div>
  130. </div>
  131. <div class="col-md-6">
  132. <div class="form-group">
  133. <label for="wlocation2"> Description : <span class="danger">*</span> </label>
  134. <textarea name="description" id="mymce" class="form-control" required=""></textarea>
  135. </div>
  136. </div>
  137. </div>
  138. </section>
  139. </div>
  140.  
  141. <div id="step-2" class="">
  142. <div class="card"></div>
  143. <section>
  144. <div class="row">
  145. <div class="col-md-5">
  146. <div class="form-group">
  147. <label for="user_address">Image Title :</label>
  148. <textarea name="name[]" class="form-control" rows="9"></textarea>
  149. </div>
  150. </div>
  151.  
  152. <div class="col-md-5">
  153. <div class="form-group">
  154. <label for="image">Upload Image :<span class="danger">*</span></label>
  155. <input type="file" id="input-file-min-fs" name="image[]" class="dropify" data-max-file-size="2M" required="" />
  156. </div>
  157. </div>
  158.  
  159. <div class="col-md-2">
  160. <a href="javascript:;" class="btn waves-effect waves-light btn-rounded btn-primary btn-add-image" title="Add More Image">Add More</a>
  161. </div>
  162. </div>
  163. <!-- Dynamic load image End-->
  164. <div class="load-dynamic-image-content"> </div>
  165. <!-- Dynamic load image End-->
  166. </section>
  167. </div>
  168. <div id="step-3" class="">
  169. <div class="card"></div>
  170. <section>
  171. <div class="row">
  172.  
  173. <div class="col-md-5">
  174. <div class="form-group">
  175. <label for="unit"> Color : <span class="danger"></span> </label>
  176. <input type="text" class="form-control" id="color" name="color[]" value="">
  177. </div>
  178. </div>
  179.  
  180. <div class="col-md-5">
  181. <div class="form-group">
  182. <label for="wlocation2"> Color Image: <span class="danger">*</span> </label>
  183.  
  184. <input name="files[]" class="form-control" type="file" id="post_image">
  185.  
  186. <!-- <img src="" id="post_img_show" height="50px" width="60px"/> -->
  187.  
  188. </div>
  189. </div>
  190.  
  191. <div class="col-md-2">
  192. <a href="javascript:;" class="btn waves-effect waves-light btn-rounded btn-primary btn-add-product-item" title="Add More Product Item">Add More</a>
  193. </div>
  194. </div>
  195.  
  196. <div class="row">
  197. <div class="col-md-5">
  198. <div class="form-group">
  199. <label for="charge">Size :</label><br>
  200. <!-- <input type="text" class="form-control" id="size" name="size[]" value="" multiple tabindex="4">
  201. <p style="color: red;">Enter multiple size separated by a comma ( , ) </p> -->
  202. <input type="text" data-role="tagsinput" placeholder="Add multiple Size" class="form-control" id="size" name="size[]" value="" />
  203. </div>
  204. </div>
  205. <div class="col-md-5">
  206. <div class="form-group">
  207. <label for="decisions1">Stock:<span class="danger">*</span></label>
  208. <input type="number" name="stock[]" id="stock" class="form-control" value="" required="">
  209. </div>
  210. </div>
  211. </div>
  212.  
  213. <!--<div class="row">-->
  214. <!-- <div class="col-md-5">-->
  215. <!-- <div class="form-group">-->
  216. <!-- <label for="charge">Regular Price :</label>-->
  217. <!-- <input type="text" class="form-control" id="regular_price" name="regular_price[]" value="">-->
  218. <!-- </div>-->
  219. <!-- </div>-->
  220. <!-- <div class="col-md-5">-->
  221. <!-- <div class="form-group">-->
  222. <!-- <label for="discount_price">Discount Price:</label>-->
  223. <!-- <input type="number" name="discount_price[]" id="discount_price" class="form-control" value="">-->
  224. <!-- </div>-->
  225. <!-- </div>-->
  226. <!--</div>-->
  227. <div class="row">
  228. <div class="col-md-5">
  229. <div class="form-group">
  230. <label for="charge">Regular Price :<span class="danger">*</span></label>
  231. <input type="text" class="form-control" id="regular_price" name="regular_price[]" value="" required="">
  232. </div>
  233. </div>
  234.  
  235. <div class="col-md-5">
  236. <div class="form-group">
  237. <label for="discount_price">Commission (%):</label>
  238. <input type="number" name="commission[]" id="commission" class="form-control product_commission" value="">
  239. </div>
  240. </div>
  241. </div>
  242.  
  243. <!-- <div class="row">
  244. <div class="col-md-5">
  245. <div class="form-group">
  246. <label for="discount_price">Discount Price:</label>
  247. <input type="number" name="discount_price[]" id="discount_price" class="form-control product_discount_price" value="">
  248. </div>
  249. </div>
  250. </div> -->
  251. <!-- Dynamic load Product item End-->
  252. <div class="load-dynamic-product-item-content"> </div>
  253. <!-- Dynamic load Product item End-->
  254. </section>
  255. </div>
  256.  
  257.  
  258. </div>
  259. </div>
  260. </form>
  261. </div>
  262. </div>
  263. </div>
  264. </div>
  265. <!-- nav-tabs-custom -->
  266. </section>
  267.  
  268. @endsection
  269. @section('extra-js')
  270. <!-- Include SmartWizard JavaScript source -->
  271. <script type="text/javascript" src="{{URL::to('public/assets/smartwizard/dist/js/jquery.smartWizard.min.js')}}"></script>
  272. <!-- wysuhtml5 Plugin JavaScript -->
  273. <script src="{{URL::to('public/assets/node_modules/tinymce/tinymce.min.js')}}"></script>
  274. @endsection
  275. @section('script')
  276.  
  277.  
  278. <script>
  279. $(document).ready(function() {
  280.  
  281. if ($("#mymce").length > 0) {
  282. tinymce.init({
  283. selector: "textarea#mymce",
  284. theme: "modern",
  285. height: 300,
  286. plugins: [
  287. "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker",
  288. "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
  289. "save table contextmenu directionality emoticons template paste textcolor"
  290. ],
  291. toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | l ink image | print preview media fullpage | forecolor backcolor emoticons",
  292.  
  293. });
  294. }
  295. });
  296. </script>
  297.  
  298. <script type="text/javascript">
  299. $(document).ready(function(){
  300.  
  301. // Step show event
  302. $("#smartwizard").on("showStep", function(e, anchorObject, stepNumber, stepDirection, stepPosition) {
  303. //alert("You are on step "+stepNumber+" now");
  304. if(stepPosition === 'first'){
  305. $("#prev-btn").addClass('disabled');
  306. }else if(stepPosition === 'final'){
  307. $("#next-btn").addClass('disabled');
  308. }else{
  309. $("#prev-btn").removeClass('disabled');
  310. $("#next-btn").removeClass('disabled');
  311. }
  312. });
  313.  
  314. // Toolbar extra buttons
  315. var btnFinish = $('<button></button>').text('Finish')
  316. .addClass('btn btn-info')
  317. .on('click', function(){ alert('Are You Ready to Submit the form??'); });
  318. var btnCancel = $('<button></button>').text('Cancel')
  319. .addClass('btn btn-danger')
  320. .on('click', function(){ $('#smartwizard').smartWizard("reset"); });
  321.  
  322. // Please note enabling option "showStepURLhash" will make navigation conflict for multiple wizard in a page.
  323. // so that option is disabling => showStepURLhash: false
  324.  
  325. // Smart Wizard 1
  326. $('#smartwizard').smartWizard({
  327. selected: 0,
  328. theme: 'arrows',
  329. transitionEffect:'fade',
  330. showStepURLhash: false,
  331. toolbarSettings: {toolbarPosition: 'both',
  332. toolbarExtraButtons: [btnFinish, btnCancel]
  333. }
  334. });
  335.  
  336. // Smart Wizard 2
  337. $('#smartwizard2').smartWizard({
  338. selected: 0,
  339. theme: 'default',
  340. transitionEffect:'fade',
  341. showStepURLhash: false
  342. });
  343.  
  344. });
  345.  
  346. //Add more image
  347. $(".btn-add-image").on('click',function() {
  348. var content = '<div class="row">'+
  349. '<div class="col-md-5">'+
  350. '<div class="form-group">'+
  351. '<label for="user_address">Image Title :</label>'+
  352. '<textarea name="name[]" class="form-control" rows="3"></textarea>'+
  353. '</div>'+
  354. '</div>'+
  355.  
  356. '<div class="col-md-5">'+
  357. '<div class="form-group">'+
  358. '<label for="image">Upload Image :</label>'+
  359. '<input type="file" id="input-file-min-fs" name="image[]" class="dropify form-control" data-max-file-size="2M" />'+
  360. '</div>'+
  361. '</div>'+
  362.  
  363. '<div class="col-md-2">'+
  364. '<a href="javascript:;" class="btn waves-effect waves-light btn-rounded btn-danger btn-remove-image" title="Add More Image">Remove</a>'+
  365. '</div>'+
  366. '</div>';
  367. $(".load-dynamic-image-content").append(content);
  368. $(".btn-remove-image").on('click', function(){
  369. $(this).parent().parent().remove();
  370. });
  371. });
  372.  
  373. function readURL(input) {
  374. if (input.files && input.files[0]) {
  375. var reader = new FileReader();
  376. reader.onload = function (e) {
  377. $('#post_img_show').attr('src', e.target.result);
  378. }
  379. reader.readAsDataURL(input.files[0]);
  380. }
  381. }
  382. $("#post_image").change(function(){
  383. readURL(this);
  384. });
  385.  
  386. $(".btn-add-product-item").on('click',function(){
  387. var content = '<div>'+
  388. '<div class="row">'+
  389. '<div class="col-md-5">'+
  390. '<div class="form-group">'+
  391. '<label for="unit"> Color : <span class="danger"></span> </label>'+
  392. '<input type="text" class="form-control" id="color" name="color[]" value="">'+
  393. '</div>'+
  394. '</div>'+
  395.  
  396. '<div class="col-md-5">'+
  397. '<div class="form-group">'+
  398. '<label for="wlocation2"> Color Image: <span class="danger">*</span> </label>'+
  399.  
  400. '<input name="files[]" class="form-control" type="file" id="post_image">'+
  401. '</div>'+
  402. '</div>'+
  403.  
  404. '<div class="col-md-2">'+
  405. '<a href="javascript:;" class="btn waves-effect waves-light btn-rounded btn-danger btn-remove-product-item" title="Remove Product Item">Remove</a>'+
  406. '</div>'+
  407.  
  408. '</div>'+
  409.  
  410. '<div class="row">'+
  411. '<div class="col-md-5">'+
  412. '<div class="form-group">'+
  413. '<label for="charge">Size :</label>'+
  414. '<input type="text" class="form-control" id="size" name="size[]" value="">'+
  415. '</div>'+
  416. '</div>'+
  417. '<div class="col-md-5">'+
  418. '<div class="form-group">'+
  419. '<label for="decisions1">Stock:</label>'+
  420. '<input type="number" name="stock[]" id="stock" class="form-control" value="">'+
  421. '</div>'+
  422. '</div>'+
  423. '</div>'+
  424. '<div class="row">'+
  425. '<div class="col-md-5">'+
  426. '<div class="form-group">'+
  427. '<label for="charge">Regular Price :</label>'+
  428. '<input type="text" class="form-control" id="regular_price" name="regular_price[]" value="">'+
  429. '</div>'+
  430. '</div>'+
  431.  
  432. '<div class="col-md-5">'+
  433. '<div class="form-group">'+
  434. '<label for="discount_price">Commission (%):</label>'+
  435. '<input type="number" name="commission[]" id="commission" class="form-control product_commission" value="">'+
  436. '</div>'+
  437. '</div>'+
  438. '</div>'+
  439. '</div>'+
  440. '</div>'+
  441. '</div>';
  442. $(".load-dynamic-product-item-content").append(content);
  443. $(".btn-remove-product-item").on('click', function(){
  444. $(this).parent().parent().parent().remove();
  445. });
  446. });
  447.  
  448. // //Commission
  449. // $(".product_commission").on('keyup', function(){
  450. // var productCommission = $("#commission").val();
  451. // var regularPrice = $("#regular_price").val();
  452.  
  453. // if(!regularPrice){
  454. // return false;
  455. // }else {
  456. // var commission = (regularPrice * productCommission)/100;
  457. // var discountPrice = regularPrice - commission;
  458. // $(".product_discount_price").val(discountPrice);
  459. // }
  460. // });
  461. </script>
  462. <script type="text/javascript">
  463. $(document).ready(function(){
  464. //Custom validation Rules
  465. //alphaspace allowed
  466. $('.userForm').validate({
  467. onkeyup: false,
  468. rules: {
  469. Category: {
  470. required: true
  471. },
  472. Brand: {
  473. required: true
  474. },
  475. Product Title: {
  476. required: true
  477. },
  478. Curier Unit: {
  479. required: true
  480. },
  481. Description: {
  482. required: true
  483. },
  484. Upload Image: {
  485. required: true
  486. },
  487. Stock: {
  488. required: true
  489. },
  490. Regular Price: {
  491. required: true
  492. },
  493. },
  494. // submitHandler: function(form) {
  495. // form.submit();
  496. // }
  497. });
  498. });
  499. </script>
  500. @endsection
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement