import _Drawer from "antd/es/drawer";
import _Row from "antd/es/row";
import _Popover from "antd/es/popover";
import _Tag from "antd/es/tag";
import _Col from "antd/es/col";
import _Form from "antd/es/form";
import _Select from "antd/es/select";
import _Space from "antd/es/space";
import _Spin from "antd/es/spin";
import _Button from "antd/es/button";
import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import _regeneratorRuntime from "@babel/runtime/regenerator";
/*
 * @Author: wangrongrong wangrongrong@bigo.sg
 * @Date: 2023-03-16 15:22:42
 * @LastEditors: wangrongrong wangrongrong@bigo.sg
 * @LastEditTime: 2023-04-18 17:04:32
 * @FilePath: /xuanwu.cloud.netplan/src/pages/APIManage/components/CreateOrEditVersion/index.tsx
 * @Description: 关联变更单
 */
import { useRef, useState, useEffect } from "react";
//新建编辑页面
var ChangeProjectComponent = function ChangeProjectComponent(props) {
  var url = props.url,
    _props$showHide = props.showHide,
    showHide = _props$showHide === void 0 ? true : _props$showHide,
    _props$type = props.type,
    type = _props$type === void 0 ? '玄武云' : _props$type,
    onSelMenu = props.onSelMenu;
  var formRef = useRef(null);
  var _useState = useState(false),
    loading = _useState[0],
    setLoading = _useState[1];
  var _useState2 = useState(false),
    spinning = _useState2[0],
    setSpinning = _useState2[1];
  var _useState3 = useState(""),
    pageId = _useState3[0],
    setPageId = _useState3[1];
  var _useState4 = useState(showHide),
    visible = _useState4[0],
    setVisibile = _useState4[1];
  var _useState5 = useState([]),
    changeList = _useState5[0],
    setChangeList = _useState5[1];
  var getInitChangeList = /*#__PURE__*/function () {
    var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee2() {
      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
        while (1) switch (_context2.prev = _context2.next) {
          case 0:
            try {
              fetch(url || '/devops-mircoapp-service/api/v1/change-system/list').then( /*#__PURE__*/function () {
                var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee(response) {
                  var res;
                  return _regeneratorRuntime.wrap(function _callee$(_context) {
                    while (1) switch (_context.prev = _context.next) {
                      case 0:
                        if (!(response.status === 200)) {
                          _context.next = 5;
                          break;
                        }
                        _context.next = 3;
                        return response.json();
                      case 3:
                        res = _context.sent;
                        setChangeList(res === null || res === void 0 ? void 0 : res.data);
                      case 5:
                      case "end":
                        return _context.stop();
                    }
                  }, _callee);
                }));
                return function (_x) {
                  return _ref2.apply(this, arguments);
                };
              }());
            } catch (err) {
              console.log(err);
            }
          case 1:
          case "end":
            return _context2.stop();
        }
      }, _callee2);
    }));
    return function getInitChangeList() {
      return _ref.apply(this, arguments);
    };
  }();
  useEffect(function () {
    getInitChangeList();
    setVisibile(props.showHide);
    console.log('props.visible===', props);
  }, [props.showHide]);
  return /*#__PURE__*/React.createElement(_Drawer, {
    visible: visible,
    width: "60%",
    className: "model_sticky",
    title: "\u53D8\u66F4\u5355\u9009\u62E9",
    onClose: function onClose() {
      setVisibile(false);
      // props?.onCancel?.();
    },

    destroyOnClose: true,
    footer: /*#__PURE__*/React.createElement(_Space, {
      style: {
        width: "100%",
        display: "flex",
        justifyContent: "center"
      }
    }, /*#__PURE__*/React.createElement(_Button, {
      onClick: function onClick() {
        setVisibile(false);
        // props?.onCancel?.();
      }
    }, "\u53D6\u6D88"), /*#__PURE__*/React.createElement(_Spin, {
      spinning: loading
    }, /*#__PURE__*/React.createElement(_Button, {
      type: "primary",
      onClick: function onClick() {
        var data = formRef === null || formRef === void 0 ? void 0 : formRef.current.getFieldsValue();
        onSelMenu(data);
      }
    }, "\u786E\u5B9A")))
  }, /*#__PURE__*/React.createElement(_Spin, {
    spinning: spinning
  }, /*#__PURE__*/React.createElement(_Form, {
    autoComplete: "off",
    ref: formRef,
    layout: "horizontal",
    labelCol: {
      style: {
        width: "90px"
      }
    },
    initialValues: {
      apiId: location.href.split("-")[2]
    }
  }, /*#__PURE__*/React.createElement(_Row, {
    gutter: 8
  }, /*#__PURE__*/React.createElement(_Col, {
    span: 19
  }, /*#__PURE__*/React.createElement(_Form.Item, {
    label: "\u53D8\u66F4\u5355",
    name: "changeId"
  }, /*#__PURE__*/React.createElement(_Select, {
    showSearch: true,
    onChange: function onChange() {
      getInitChangeList();
    },
    filterOption: function filterOption(input, option) {
      var _option$children;
      return option === null || option === void 0 ? void 0 : (_option$children = option.children) === null || _option$children === void 0 ? void 0 : _option$children.includes(input);
    }
  }, Array.isArray(changeList) && changeList.map(function (item) {
    return /*#__PURE__*/React.createElement(_Select.Option, {
      value: item.id
    }, item.title);
  })))), /*#__PURE__*/React.createElement(_Col, {
    span: 5
  }, /*#__PURE__*/React.createElement(_Popover, {
    content: /*#__PURE__*/React.createElement("div", null, "\u53D8\u66F4\u64CD\u4F5C\u5E73\u53F0\u8BF7\u9009\u62E9\uFF1A", /*#__PURE__*/React.createElement(_Tag, {
      color: "green"
    }, type)),
    title: "\u8BF4\u660E"
  }, /*#__PURE__*/React.createElement(_Button, {
    type: "primary",
    onClick: function onClick() {
      var env = location.search.includes('env=test') ? 'test' : '';
      if (env == 'test') {
        window.open("http://10.190.48.132:9091/v2/?env=test#/newAdd/add/:param", '_blank');
      } else {
        window.open("http://change-sysop.bigo.sg/v2/#/newAdd/add/:param", '_blank');
      }
    }
  }, "\u53BB\u521B\u5EFA")))))));
};
export default ChangeProjectComponent;