text: import React from "react";
  //Bootstrap and jQuery libraries
  import "bootstrap/dist/css/bootstrap.min.css";
  import { Link } from "react-router-dom";
  import "jquery/dist/jquery.min.js";
  import $ from "jquery";
  import "./Style.css";
  import baseurl from "../../services/apiconfig";
  import { ToastContainer, toast } from "react-toastify";
  import "react-toastify/dist/ReactToastify.css";
  const axios = require("axios");
  class EditCoachVblog extends React.Component {
    componentDidMount() {
      $(document).on("input", ".number", function () {
        this.value = this.value.replace(/\D/g, "");
      });
      //Getting ID From URL
      var url = window.location.pathname;
      var id = url.substring(url.lastIndexOf("/") + 1);
      var Id = id.split("&");
      var rId = Id[0];
      var coachId = url.substring(url.lastIndexOf("=") + 1);
      window.coachId = coachId;
      //For User By ID
      //For User By ID
      axios
        .get(baseurl.baseurl + `/vblog/backend/vBlogById?id=${rId}`)
        .then((res) => {
          
          this.setState({
            id: res.data.data.id,
            heading: res.data.data.heading,
            sub_heading: res.data.data.sub_heading,
            video_url: res.data.data.video_url,
            details: res.data.data.details,
            short_details: res.data.data.short_details,
          });
        })
        .catch((err) => {
          //console.log("err",err)
          toast.error("Error occurred at API end (" + err.message + ")");
        });
    }
  
    constructor() {
      super();
      this.state = {};
    }
    handleChange(evt) {
      this.setState({
        [evt.target.name]: evt.target.value,
      });
    }
  
    updateVblog(evt, id) {
      evt.preventDefault();
      const postData = {
        Heading: this.state.heading,
        Slug: this.state.heading
          .toLowerCase()
          .replace(/\s+/g, "-")
          .replace(/[^\w-]+/g, "")
          .replace(/-+/g, "-"),
        SubHeading: this.state.sub_heading,
        ShortDetails: this.state.short_details,
        Details: this.state.details,
        VideoUrl: this.state.video_url,
      };
  
      axios
        .put(baseurl.baseurl + `/vblog/update/${id}`, postData)
        .then((res) => {
          toast.success(res.data.message);
          window.location.href = "/edit-coach/" + window.coachId;
        })
        .catch((err) => {
          //console.log("err",err)
          toast.error("Error occurred at API end (" + err.message + ")");
        });
    }
    render() {
      return (
        <div>
          <section className="breadcrumbs">
            <span>
              <Link className="crumbs" to={"/dashboard"}>
                Home
              </Link>
            </span>{" "}
            <span>
              <span className="fa fa-circle dot"></span>
            </span>{" "}
            <Link className="crumbs" to={"/counsellor"}>
              Coach
            </Link>{" "}
            <span>
              <span className="fa fa-circle dot"></span>
            </span>{" "}
            <Link className="crumbs" to={"/edit-coach/" + window.coachId}>
              Edit Coach
            </Link>{" "}
            <span>
              <span className="fa fa-circle dot"></span>
            </span>{" "}
            <span>Edit Coach V-Blog</span>
          </section>
          <section className="content">
            <ToastContainer />
            <div className="row">
              <div className="col-md-12">
                <div className="box box-primary">
                  <div className="box-header">
                    <h3 className="box-title">Edit V-Blog</h3>
                  </div>
                  <hr />
                  <form>
                    <div className="box-body row">
                      <div className="col-lg-12 col-sm-12 col-xs-12">
                        <div className="form-group">
                          <label>Title</label>
                          <input
                            type="text"
                            name="heading"
                            className="form-control"
                            placeholder="Enter title"
                            onChange={(evt) => this.handleChange(evt)}
                            defaultValue={this.state.heading}
                            required
                          />
                        </div>
                      </div>
                      <div className="col-lg-12 col-sm-12 col-xs-12">
                        <div className="form-group">
                          <label>Sub Title</label>
                          <input
                            type="text"
                            name="sub_heading"
                            className="form-control"
                            placeholder="Enter sub title"
                            onChange={(evt) => this.handleChange(evt)}
                            defaultValue={this.state.sub_heading}
                          />
                        </div>
                      </div>
                      <div className="col-lg-12 col-sm-12 col-xs-12">
                        <div className="form-group">
                          <label>Video Url</label>
                          <input
                            type="text"
                            name="video_url"
                            className="form-control"
                            placeholder="Enter video url"
                            onChange={(evt) => this.handleChange(evt)}
                            defaultValue={this.state.video_url}
                          />
                        </div>
                      </div>
                      <div className="col-lg-12 col-sm-12 col-xs-12">
                        <div className="form-group">
                          <label>V-Blog Short Description</label>
                          <textarea
                            id="addressTextarea"
                            className="form-control"
                            rows="3"
                            name="short_details"
                            placeholder="Enter v-blog short description"
                            onChange={(evt) => this.handleChange(evt)}
                            defaultValue={this.state.short_details}
                          ></textarea>
                        </div>
                      </div>
                      <div className="col-lg-12 col-sm-12 col-xs-12">
                        <div className="form-group">
                          <label>V-Blog Description</label>
                          <textarea
                            id="addressTextarea"
                            className="form-control"
                            rows="5"
                            name="details"
                            placeholder="Enter v-blog description"
                            onChange={(evt) => this.handleChange(evt)}
                            defaultValue={this.state.details}
                          ></textarea>
                        </div>
                      </div>
                      <div className="col-lg-12 col-sm-12 col-xs-12">
                        <div className="form-group">
                          <center>
                            <input
                              className="btn btn-warning"
                              type="submit"
                              value="Update"
                              onClick={(evt) =>
                                this.updateVblog(evt, this.state.id)
                              }
                            />
                          </center>
                        </div>
                      </div>
                    </div>
                  </form>
                </div>
              </div>
            </div>
          </section>
        </div>
      );
    }
  }
  export default EditCoachVblog;
  