{"version":3,"sources":["webpack:///./src/detaikhoahoc/index.js"],"names":["HomeIndex","props","state","error","isLoaded","items","tenDeTai","tenTacGia","idTacGia","itemTacGias","totalCount","pageSize","activePage","totalDeTais","handleChangeDeTai","bind","handleClick","getPageUrl","handlePageChange","pageNumber","url","undefined","this","value","data","site","siteMetadata","callApi","fetch","then","res","json","result","setState","event","target","prevState","componentDidMount","location","search","parseInt","queryString","parse","page","privatelKey","generalKey","tenDeTai_loc","idTacGia_loc","find","o","render","detaikhoahocs","length","className","map","item","style","lineHeight","key","Id","backgroundColor","borderBottomStyle","to","modal","TenDeTai","CapQuanLy","marginTop","DonViCongTac","LoaiHinhNghienCuu","GiangVienThamGia","itemsCountPerPage","totalItemsCount","pageRangeDisplayed","onChange","activeDeTai","title","minHeight","backgroundImage","imageQnu","backgroundPosition","backgroundRepeat","backgroundSize","fontSize","color","onKeyDown","ev","type","placeholder","borderRadius","options","e","onKeyPress","onClick","React","Component"],"mappings":"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","file":"component---src-detaikhoahoc-index-js-7dbaff182b2f1b65bc25.js","sourcesContent":["import React, { Fragment } from \"react\";\r\nimport Layout from \"../common/layouts\";\r\nimport { graphql, Link } from \"gatsby\";\r\nimport Seo from \"../common/seo\";\r\nimport { BsSearch, BsHouse, BsListCheck, BsPeople } from \"react-icons/bs\";\r\nimport { SiOpslevel } from \"react-icons/si\";\r\nimport Pagination from \"react-js-pagination\";\r\nimport \"tachyons\";\r\nimport Select from \"react-select\";\r\nimport queryString from \"query-string\";\r\n\r\nexport default class HomeIndex extends React.Component {\r\n  constructor(props) {\r\n    super(props);\r\n    this.state = {\r\n      error: null,\r\n      isLoaded: false,\r\n      items: [],\r\n      tenDeTai: \"\",\r\n      tenTacGia: \"\",\r\n      idTacGia: \"\",\r\n      itemTacGias: [],\r\n      totalCount: 0,\r\n      pageSize: 10,\r\n      activePage: 1,\r\n      totalDeTais: 0,\r\n    };\r\n\r\n    this.handleChangeDeTai = this.handleChangeDeTai.bind(this);\r\n    this.handleClick = this.handleClick.bind(this);\r\n    this.getPageUrl = this.getPageUrl.bind(this);\r\n    this.handlePageChange = this.handlePageChange.bind(this);\r\n  }\r\n\r\n  getPageUrl(pageNumber) {\r\n    return `/detaikhoahoc/?page=${pageNumber}`;\r\n  }\r\n\r\n  handlePageChange(pageNumber) {\r\n    let url = \"\";\r\n    if (this.state.tenTacGia.value === undefined) {\r\n      url =\r\n        this.props.data.site.siteMetadata.callApi +\r\n        `/GetDeTaiGiangViens/?idTacGia=00000000-0000-0000-0000-000000000000&tenDetai=${this.state.tenDeTai}&pageSize=${this.state.pageSize}&pageIndex=${pageNumber}`;\r\n    } else {\r\n      url =\r\n        this.props.data.site.siteMetadata.callApi +\r\n        `/GetDeTaiGiangViens/?idTacGia=${this.state.tenTacGia.value}&tenDeTai=${this.state.tenDeTai}&pageSize=${this.state.pageSize}&pageIndex=${pageNumber}`;\r\n    }\r\n\r\n    fetch(url)\r\n      .then((res) => res.json())\r\n      .then(\r\n        (result) => {\r\n          this.setState({\r\n            isLoaded: true,\r\n            items: result.data,\r\n            pageSize: result.pageSize,\r\n            totalCount: result.totalCount,\r\n            activePage: pageNumber,\r\n          });\r\n        },\r\n        (error) => {\r\n          this.setState({\r\n            isLoaded: true,\r\n            error,\r\n          });\r\n        }\r\n      );\r\n  }\r\n\r\n  handleChangeDeTai(event) {\r\n    this.setState({\r\n      tenDeTai: event.target.value,\r\n    });\r\n  }\r\n\r\n  handleClick() {\r\n    let url = \"\";\r\n    if (this.state.tenTacGia.value === undefined) {\r\n      url =\r\n        this.props.data.site.siteMetadata.callApi +\r\n        `/GetDeTaiGiangViens/?idTacGia=00000000-0000-0000-0000-000000000000&tenDetai=${this.state.tenDeTai}`;\r\n    } else {\r\n      url =\r\n        this.props.data.site.siteMetadata.callApi +\r\n        `/GetDeTaiGiangViens/?idTacGia=${this.state.tenTacGia.value}&tenDeTai=${this.state.tenDeTai}`;\r\n    }\r\n    this.setState((prevState) =>\r\n      fetch(url)\r\n        .then((res) => res.json())\r\n        .then(\r\n          (result) => {\r\n            this.setState({\r\n              isLoaded: true,\r\n              items: result.data,\r\n              pageSize: result.pageSize,\r\n              totalCount: result.totalCount,\r\n              activePage: 1,\r\n            });\r\n          },\r\n          (error) => {\r\n            this.setState({\r\n              isLoaded: true,\r\n              error,\r\n            });\r\n          }\r\n        )\r\n    );\r\n  }\r\n\r\n  componentDidMount() {\r\n    const { state } = this.props.location;\r\n\r\n    if (this.props.location.search) {\r\n      this.handlePageChange(parseInt(queryString.parse(this.props.location.search).page));\r\n    } else {\r\n      let idTacGia = \"00000000-0000-0000-0000-000000000000\";\r\n      let tenDeTai = \"\";\r\n\r\n      if (state?.privatelKey !== undefined) {\r\n        idTacGia = state.privatelKey;\r\n      } else if (state?.generalKey !== undefined) {\r\n        tenDeTai = state?.generalKey;\r\n        this.setState({\r\n          tenDeTai: state.generalKey,\r\n        });\r\n      } else if (\r\n        state?.tenDeTai_loc !== undefined &&\r\n        state?.idTacGia_loc !== undefined\r\n      ) {\r\n        tenDeTai = state?.tenDeTai_loc;\r\n        idTacGia = state?.idTacGia_loc;\r\n\r\n        this.setState({\r\n          tenDeTai: state?.tenDeTai_loc,\r\n        });\r\n      } else if (state?.tenDeTai_loc !== undefined) {\r\n        tenDeTai = state?.tenDeTai_loc;\r\n        this.setState({\r\n          tenDeTai: state?.tenDeTai_loc,\r\n        });\r\n      } else if (state?.idTacGia_loc !== undefined) {\r\n        idTacGia = state?.idTacGia_loc;\r\n      }\r\n\r\n      let url =\r\n        this.props.data.site.siteMetadata.callApi +\r\n        `/GetDeTaiGiangViens/?idTacGia=${idTacGia}&tenDeTai=${tenDeTai}`;\r\n\r\n      fetch(url)\r\n        .then((res) => res.json())\r\n        .then(\r\n          (result) => {\r\n            this.setState({\r\n              isLoaded: true,\r\n              items: result.data,\r\n              pageSize: result.pageSize,\r\n              totalCount: result.totalCount,\r\n              activePage: 1,\r\n            });\r\n          },\r\n          (error) => {\r\n            this.setState({\r\n              isLoaded: true,\r\n              error,\r\n            });\r\n          }\r\n        );\r\n    }\r\n\r\n    fetch(this.props.data.site.siteMetadata.callApi + `/GetTotalDeTais`)\r\n      .then((res) => res.json())\r\n      .then(\r\n        (result) => {\r\n          this.setState({\r\n            isLoaded: true,\r\n            totalDeTais: result,\r\n          });\r\n        },\r\n        (error) => {\r\n          this.setState({\r\n            isLoaded: true,\r\n            error,\r\n          });\r\n        }\r\n      );\r\n\r\n    fetch(this.props.data.site.siteMetadata.callApi + `/GetNhanSuForDanhMucs`)\r\n      .then((res) => res.json())\r\n      .then(\r\n        (result) => {\r\n          if (state?.privatelKey !== undefined) {\r\n            this.setState({\r\n              tenTacGia: result.find((o) => o.value === state.privatelKey),\r\n            });\r\n          }\r\n          if (state?.idTacGia_loc !== undefined) {\r\n            this.setState({\r\n              tenTacGia: result.find((o) => o.value === state?.idTacGia_loc),\r\n            });\r\n          }\r\n          this.setState({\r\n            isLoaded: true,\r\n            itemTacGias: result,\r\n          });\r\n        },\r\n        (error) => {\r\n          this.setState({\r\n            isLoaded: true,\r\n            error,\r\n          });\r\n        }\r\n      );\r\n  }\r\n\r\n  render() {\r\n    const {\r\n      items,\r\n      itemTacGias,\r\n      pageSize,\r\n      totalCount,\r\n      activePage,\r\n      isLoaded,\r\n      totalDeTais,\r\n    } = this.state;\r\n\r\n    var detaikhoahocs;\r\n\r\n    if (items && items.length > 0) {\r\n      detaikhoahocs = (\r\n        <Fragment>\r\n          <section className=\"flex flex-wrap center justify-center mb2 sans-serif\">\r\n            <div className=\"bb\">\r\n              {pageSize * (activePage - 1) + 1} -{\" \"}\r\n              {items.length + pageSize * (activePage - 1)} / {totalCount} KẾT\r\n              QUẢ\r\n            </div>\r\n          </section>\r\n\r\n          <section className=\"flex flex-wrap center justify-center sans-serif\">\r\n            {this.state.items.map((item) => (\r\n              <div\r\n                className=\"pb2 pt2 w-100 mw9 f6\"\r\n                style={{ lineHeight: \"normal\" }}\r\n                key={item.Id}\r\n              >\r\n                <div\r\n                  className=\"pa2 display dark-gray overflow-x-auto b--red\"\r\n                  style={{\r\n                    backgroundColor: \"#e6eaf0\",\r\n                    borderBottomStyle: \"solid\",\r\n                  }}\r\n                >\r\n                  <div className=\"flex flex-wrap justify-around w-100 mw9\">\r\n                    <div className=\"w-100\">\r\n                      <p className=\"ml2\">\r\n                        <Link\r\n                          to={\"/detaikhoahoc/detail/?Id=\" + item.Id}\r\n                          state={{\r\n                            modal: true,\r\n                            Id: item.Id,\r\n                          }}\r\n                          className=\"mt0 dark-red f5 link\"\r\n                        >\r\n                          {item.TenDeTai}\r\n                        </Link>\r\n                      </p>\r\n                      <p className=\"mt0 ml2\">\r\n                        <SiOpslevel className=\"fl mr2\" /> <b>Cấp quản lý:</b>{\" \"}\r\n                        {item.CapQuanLy === null || item.CapQuanLy === \"\" ? (\r\n                          <strong className=\"light-blue normal\">\r\n                            Chưa có thông tin\r\n                          </strong>\r\n                        ) : (\r\n                          item.CapQuanLy\r\n                        )}\r\n                      </p>\r\n                      <p className=\"mt0 ml2\">\r\n                        <BsHouse\r\n                          className=\"fl mr2\"\r\n                          style={{ marginTop: \"-0.1em\" }}\r\n                        />{\" \"}\r\n                        <b>Đơn vị công tác:</b>{\" \"}\r\n                        {item.DonViCongTac === null ||\r\n                        item.DonViCongTac === \"\" ? (\r\n                          <strong className=\"light-blue normal\">\r\n                            Chưa có thông tin\r\n                          </strong>\r\n                        ) : (\r\n                          item.DonViCongTac\r\n                        )}\r\n                      </p>\r\n                      <p className=\"mt0 ml2\">\r\n                        <BsListCheck className=\"fl mr2\" />{\" \"}\r\n                        <b>Loại hình nghiên cứu:</b>{\" \"}\r\n                        {item.LoaiHinhNghienCuu === null ||\r\n                        item.LoaiHinhNghienCuu === \"\" ? (\r\n                          <strong className=\"light-blue normal\">\r\n                            Chưa có thông tin\r\n                          </strong>\r\n                        ) : (\r\n                          item.LoaiHinhNghienCuu\r\n                        )}\r\n                      </p>\r\n                      <p className=\"mt0 ml2\">\r\n                        <BsPeople\r\n                          className=\"fl mr2\"\r\n                          style={{ marginTop: \"-0.1em\" }}\r\n                        />{\" \"}\r\n                        <b>Người tham gia:</b>{\" \"}\r\n                        {item.GiangVienThamGia === null ||\r\n                        item.GiangVienThamGia === \"\" ? (\r\n                          <strong className=\"light-blue normal\">\r\n                            Chưa có thông tin\r\n                          </strong>\r\n                        ) : (\r\n                          item.GiangVienThamGia\r\n                        )}\r\n                      </p>\r\n                    </div>\r\n                  </div>\r\n                </div>\r\n              </div>\r\n            ))}\r\n          </section>\r\n\r\n          <section className=\"flex flex-wrap center tc justify-center sans-serif\">\r\n            <Pagination\r\n              activePage={this.state.activePage}\r\n              itemsCountPerPage={pageSize}\r\n              totalItemsCount={totalCount}\r\n              pageRangeDisplayed={5}\r\n              onChange={this.handlePageChange.bind(this)}\r\n              getPageUrl={this.getPageUrl.bind(this)}\r\n            />\r\n          </section>\r\n        </Fragment>\r\n      );\r\n    } else if (isLoaded === false) {\r\n      detaikhoahocs = <h2 className=\"tc\">Đang tải...</h2>;\r\n    } else {\r\n      detaikhoahocs = <h2 className=\"tc\">Không tìm thấy thông tin đề tài - dự án - sáng kiến!</h2>;\r\n    }\r\n\r\n    return (\r\n      <Layout activeDeTai=\"#f2184f\">\r\n        <Seo title={\"ĐỀ TÀI - DỰ ÁN - SÁNG KIẾN\"} />\r\n        <div\r\n          style={{\r\n            minHeight: \"44rem\",\r\n          }}\r\n          className=\"sans-serif\"\r\n        >\r\n          <section\r\n            style={{\r\n              backgroundImage: `url(${this.props.data.site.siteMetadata.imageQnu})`,\r\n              // backgroundColor: \"rgb(63 82 111)\",\r\n              backgroundPosition: \"bottom\",\r\n              backgroundRepeat: \"no-repeat\",\r\n              backgroundSize: \"cover\",\r\n              marginTop: \"-9px\",\r\n            }}\r\n          >\r\n            <div className=\"flex flex-wrap justify-between-ns justify-center w-100 mw9 center-l\">\r\n              <div className=\"flex flex-column mt4\">\r\n                <h2\r\n                  className=\"near-white tracked mb0 db tc\"\r\n                  style={{\r\n                    fontSize: \"25px\",\r\n                  }}\r\n                >\r\n                  DỮ LIỆU ĐỀ TÀI - DỰ ÁN - SÁNG KIẾN\r\n                </h2>\r\n                <h4\r\n                  style={{ color: \"#f2184f\" }}\r\n                  className=\"f4 mt2 tc mr-auto-l\"\r\n                >\r\n                  {totalDeTais} KẾT QUẢ\r\n                </h4>\r\n              </div>\r\n              <div className=\"flex flex-column mb4 mt4\">\r\n                <div className=\"pa3 bg-white\">\r\n                  <fieldset className=\"bn\">\r\n                    <legend className=\"fw9 mb2 f5 near-black tc\">\r\n                      Tìm kiếm dữ liệu\r\n                    </legend>\r\n                    <div className=\"mt1\">\r\n                      <input\r\n                        onKeyDown={(ev) => {\r\n                          if (ev.key === \"Enter\") {\r\n                            this.handleClick();\r\n                          }\r\n                        }}\r\n                        type=\"text\"\r\n                        value={this.state.tenDeTai}\r\n                        onChange={this.handleChangeDeTai}\r\n                        className=\"pa2 input-reset ba w-100 bg-transparent pointer\"\r\n                        placeholder=\"Tên đề tài...\"\r\n                        style={{ borderRadius: \"4px\" }}\r\n                      />\r\n                    </div>\r\n                    <div className=\"mt3\">\r\n                      <Select\r\n                        options={itemTacGias}\r\n                        value={this.state.tenTacGia}\r\n                        onChange={(e) => {\r\n                          this.setState({\r\n                            tenTacGia: e,\r\n                          });\r\n                        }}\r\n                        onKeyDown={(ev) => {\r\n                          if (ev.key === \"Enter\") {\r\n                            this.handleClick();\r\n                          }\r\n                        }}\r\n                        placeholder=\"Chọn tác giả...\"\r\n                      />\r\n                    </div>\r\n                    <div className=\"mt3\">\r\n                      <button\r\n                        onKeyPress={(ev) => {\r\n                          if (ev.key === \"Enter\") {\r\n                            this.handleClick();\r\n                          }\r\n                        }}\r\n                        type=\"button\"\r\n                        onClick={this.handleClick}\r\n                        className=\"pa2 ba bg-transparent w-100 pointer\"\r\n                        style={{ backgroundColor: \"#f2184f\", color: \"white\" }}\r\n                      >\r\n                        <BsSearch /> Tìm kiếm\r\n                      </button>\r\n                    </div>\r\n                  </fieldset>\r\n                </div>\r\n              </div>\r\n            </div>\r\n          </section>\r\n\r\n          <div className=\"flex flex-column tc\">\r\n            <h3 className=\"near-black f4 tracked db\">\r\n              DỮ LIỆU ĐỀ TÀI - DỰ ÁN - SÁNG KIẾN\r\n            </h3>\r\n          </div>\r\n          {detaikhoahocs}\r\n        </div>\r\n      </Layout>\r\n    );\r\n  }\r\n}\r\n\r\nexport const query = graphql`\r\n  query {\r\n    site {\r\n      siteMetadata {\r\n        siteTitle: title\r\n        description\r\n        imageQnu\r\n        imageQnu2\r\n        siteUrl\r\n        callApi\r\n        hostApi\r\n        avatar\r\n      }\r\n    }\r\n  }\r\n`;\r\n"],"sourceRoot":""}