@light-sheet/react/esm/components/DataVerification/index.js

FortuneSheet is a drop-in javascript spreadsheet library that provides rich features like Excel and Google Sheets

function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : String(i); }
function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import _ from "lodash";
import { getDropdownList, getFlowdata, getRangeByTxt, getRangetxt, getSheetIndex, locale, setCellValue, confirmMessage } from "@light-sheet/core";
import React, { useCallback, useContext, useEffect, useState } from "react";
import WorkbookContext from "../../context";
import { useDialog } from "../../hooks/useDialog";
import SVGIcon from "../SVGIcon";
import "./index.css";
var DataVerification = function DataVerification() {
  var _dataRegulation, _context$dataVerifica, _context$dataVerifica2, _context$dataVerifica3, _context$dataVerifica4, _context$dataVerifica5, _context$dataVerifica6, _context$dataVerifica7, _context$dataVerifica8, _context$dataVerifica9, _context$dataVerifica10, _context$dataVerifica11, _context$dataVerifica12;
  var _useContext = useContext(WorkbookContext),
    context = _useContext.context,
    setContext = _useContext.setContext;
  var _useDialog = useDialog(),
    showDialog = _useDialog.showDialog,
    hideDialog = _useDialog.hideDialog;
  var _locale = locale(context),
    dataVerification = _locale.dataVerification,
    toolbar = _locale.toolbar,
    button = _locale.button,
    generalDialog = _locale.generalDialog;
  var _useState = useState(["between", "notBetween", "equal", "notEqualTo", "moreThanThe", "lessThan", "greaterOrEqualTo", "lessThanOrEqualTo"]),
    _useState2 = _slicedToArray(_useState, 1),
    numberCondition = _useState2[0];
  var _useState3 = useState(["between", "notBetween", "equal", "notEqualTo", "earlierThan", "noEarlierThan", "laterThan", "noLaterThan"]),
    _useState4 = _slicedToArray(_useState3, 1),
    dateCondition = _useState4[0];

  // 开启鼠标选区
  var dataSelectRange = useCallback(function (type, value) {
    hideDialog();
    setContext(function (ctx) {
      ctx.rangeDialog.show = true;
      ctx.rangeDialog.type = type;
      ctx.rangeDialog.rangeTxt = value;
    });
  }, [hideDialog, setContext]);

  // 确定和取消按钮
  var btn = useCallback(function (type) {
    if (type === "confirm") {
      setContext(function (ctx) {
        var isPass = confirmMessage(ctx, generalDialog, dataVerification);
        if (isPass) {
          var _ctx$dataVerification, _ctx$luckysheetfile$d, _range, _range2, _range3, _range4;
          var range = getRangeByTxt(ctx, (_ctx$dataVerification = ctx.dataVerification) === null || _ctx$dataVerification === void 0 || (_ctx$dataVerification = _ctx$dataVerification.dataRegulation) === null || _ctx$dataVerification === void 0 ? void 0 : _ctx$dataVerification.rangeTxt);
          if (range.length === 0) {
            return;
          }
          var regulation = ctx.dataVerification.dataRegulation;
          var verifacationT = regulation === null || regulation === void 0 ? void 0 : regulation.type;
          var value1 = regulation.value1;
          var item = _objectSpread(_objectSpread({}, regulation), {}, {
            checked: false // checkbox默认在单元格中false为未选中，true为选中
          });
          if (verifacationT === "dropdown") {
            var list = getDropdownList(ctx, value1);
            item.value1 = list.join(",");
          }
          var currentDataVerification = (_ctx$luckysheetfile$d = ctx.luckysheetfile[getSheetIndex(ctx, ctx.currentSheetId)].dataVerification) !== null && _ctx$luckysheetfile$d !== void 0 ? _ctx$luckysheetfile$d : {};
          var str = (_range = range[range.length - 1]) === null || _range === void 0 ? void 0 : _range.row[0];
          var edr = (_range2 = range[range.length - 1]) === null || _range2 === void 0 ? void 0 : _range2.row[1];
          var stc = (_range3 = range[range.length - 1]) === null || _range3 === void 0 ? void 0 : _range3.column[0];
          var edc = (_range4 = range[range.length - 1]) === null || _range4 === void 0 ? void 0 : _range4.column[1];
          var d = getFlowdata(ctx);
          if (!d || _.isNil(str) || _.isNil(stc) || _.isNil(edr) || _.isNil(edc)) return;
          for (var r = str; r <= edr; r += 1) {
            for (var c = stc; c <= edc; c += 1) {
              var key = "".concat(r, "_").concat(c);
              currentDataVerification[key] = item;
              if (regulation.type === "checkbox") {
                setCellValue(ctx, r, c, d, item.value2);
              }
            }
          }
          ctx.luckysheetfile[getSheetIndex(ctx, ctx.currentSheetId)].dataVerification = currentDataVerification;
        }
      });
    } else if (type === "delete") {
      setContext(function (ctx) {
        var _ctx$dataVerification2, _ctx$luckysheetfile$d2, _range5, _range6, _range7, _range8;
        var range = getRangeByTxt(ctx, (_ctx$dataVerification2 = ctx.dataVerification) === null || _ctx$dataVerification2 === void 0 || (_ctx$dataVerification2 = _ctx$dataVerification2.dataRegulation) === null || _ctx$dataVerification2 === void 0 ? void 0 : _ctx$dataVerification2.rangeTxt);
        if (range.length === 0) {
          showDialog(generalDialog.noSeletionError, "ok");
          return;
        }
        var currentDataVerification = (_ctx$luckysheetfile$d2 = ctx.luckysheetfile[getSheetIndex(ctx, ctx.currentSheetId)].dataVerification) !== null && _ctx$luckysheetfile$d2 !== void 0 ? _ctx$luckysheetfile$d2 : {};
        var str = (_range5 = range[range.length - 1]) === null || _range5 === void 0 ? void 0 : _range5.row[0];
        var edr = (_range6 = range[range.length - 1]) === null || _range6 === void 0 ? void 0 : _range6.row[1];
        var stc = (_range7 = range[range.length - 1]) === null || _range7 === void 0 ? void 0 : _range7.column[0];
        var edc = (_range8 = range[range.length - 1]) === null || _range8 === void 0 ? void 0 : _range8.column[1];
        if (_.isNil(str) || _.isNil(stc) || _.isNil(edr) || _.isNil(edc)) return;
        for (var r = str; r <= edr; r += 1) {
          for (var c = stc; c <= edc; c += 1) {
            delete currentDataVerification["".concat(r, "_").concat(c)];
          }
        }
      });
    }
    hideDialog();
  }, [dataVerification, generalDialog, hideDialog, setContext, showDialog]);

  // 初始化
  useEffect(function () {
    setContext(function (ctx) {
      var _defaultItem$value, _ctx$rangeDialog, _ctx$rangeDialog2;
      var rangeT = "";

      // 如果有选区得把选区转为字符形式然后进行显示
      if (ctx.luckysheet_select_save) {
        var range = ctx.luckysheet_select_save[ctx.luckysheet_select_save.length - 1];
        rangeT = getRangetxt(context, context.currentSheetId, range, context.currentSheetId);
      }

      // 初始化值
      var index = getSheetIndex(ctx, ctx.currentSheetId);
      var ctxDataVerification = ctx.luckysheetfile[index].dataVerification || {};
      if (!ctx.luckysheet_select_save) return;
      var last = ctx.luckysheet_select_save[ctx.luckysheet_select_save.length - 1];
      var rowIndex = last.row_focus;
      var colIndex = last.column_focus;
      if (rowIndex == null || colIndex == null) return;
      var item = ctxDataVerification["".concat(rowIndex, "_").concat(colIndex)];
      var defaultItem = item !== null && item !== void 0 ? item : {};
      var rangValue = (_defaultItem$value = defaultItem.value1) !== null && _defaultItem$value !== void 0 ? _defaultItem$value : "";
      // 选区赋值相关
      if (((_ctx$rangeDialog = ctx.rangeDialog) === null || _ctx$rangeDialog === void 0 ? void 0 : _ctx$rangeDialog.type) === "dropDown" && ctx.dataVerification && ctx.dataVerification.dataRegulation && ctx.dataVerification.dataRegulation.rangeTxt) {
        // 当是下拉列表选区的时候，则下拉选区赋值，范围保持不变
        rangeT = ctx.dataVerification.dataRegulation.rangeTxt;
        rangValue = ctx.rangeDialog.rangeTxt;
      } else if (((_ctx$rangeDialog2 = ctx.rangeDialog) === null || _ctx$rangeDialog2 === void 0 ? void 0 : _ctx$rangeDialog2.type) === "rangeTxt" && ctx.dataVerification && ctx.dataVerification.dataRegulation && ctx.dataVerification.dataRegulation.value1) {
        // 当是选区范围的时候，则范围赋值，下拉选区不变
        rangValue = ctx.dataVerification.dataRegulation.value1;
        rangeT = ctx.rangeDialog.rangeTxt;
      }
      ctx.rangeDialog.type = "";
      if (item) {
        ctx.dataVerification.dataRegulation = _objectSpread(_objectSpread({}, item), {}, {
          value1: rangValue,
          rangeTxt: rangeT
        });
      } else {
        ctx.dataVerification.dataRegulation = {
          type: "dropdown",
          type2: "",
          rangeTxt: rangeT,
          value1: rangValue,
          value2: "",
          validity: "",
          remote: false,
          prohibitInput: false,
          hintShow: false,
          hintValue: ""
        };
      }
    });
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
  return /*#__PURE__*/React.createElement("div", {
    id: "fortune-data-verification"
  }, /*#__PURE__*/React.createElement("div", {
    className: "title"
  }, toolbar.dataVerification), /*#__PURE__*/React.createElement("div", {
    className: "box"
  }, /*#__PURE__*/React.createElement("div", {
    className: "box-item",
    style: {
      borderTop: "1px solid #E1E4E8"
    }
  }, /*#__PURE__*/React.createElement("div", {
    className: "box-item-title"
  }, dataVerification.cellRange), /*#__PURE__*/React.createElement("div", {
    className: "data-verification-range"
  }, /*#__PURE__*/React.createElement("input", {
    className: "formulaInputFocus",
    spellCheck: "false",
    value: (_dataRegulation = context.dataVerification.dataRegulation) === null || _dataRegulation === void 0 ? void 0 : _dataRegulation.rangeTxt,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.rangeTxt = value;
      });
    }
  }), /*#__PURE__*/React.createElement("i", {
    className: "icon",
    "aria-hidden": "true",
    onClick: function onClick() {
      hideDialog();
      dataSelectRange("rangeTxt", context.dataVerification.dataRegulation.value1);
    },
    tabIndex: 0
  }, /*#__PURE__*/React.createElement(SVGIcon, {
    name: "tab",
    width: 18
  })))), /*#__PURE__*/React.createElement("div", {
    className: "box-item"
  }, /*#__PURE__*/React.createElement("div", {
    className: "box-item-title"
  }, dataVerification.verificationCondition), /*#__PURE__*/React.createElement("select", {
    className: "data-verification-type-select",
    value: context.dataVerification.dataRegulation.type,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.type = value;
        if (value === "dropdown" || value === "checkbox") {
          ctx.dataVerification.dataRegulation.type2 = "";
        } else if (value === "number" || value === "number_integer" || value === "number_decimal" || value === "text_length" || value === "date") {
          ctx.dataVerification.dataRegulation.type2 = "between";
        } else if (value === "text_content") {
          ctx.dataVerification.dataRegulation.type2 = "include";
        } else if (value === "validity") {
          ctx.dataVerification.dataRegulation.type2 = "identificationNumber";
        }
        ctx.dataVerification.dataRegulation.value1 = "";
        ctx.dataVerification.dataRegulation.value2 = "";
      });
    }
  }, ["dropdown", "checkbox", "number", "number_integer", "number_decimal", "text_content", "text_length", "date", "validity"].map(function (v) {
    return /*#__PURE__*/React.createElement("option", {
      value: v,
      key: v
    }, dataVerification[v]);
  })), ((_context$dataVerifica = context.dataVerification) === null || _context$dataVerifica === void 0 || (_context$dataVerifica = _context$dataVerifica.dataRegulation) === null || _context$dataVerifica === void 0 ? void 0 : _context$dataVerifica.type) === "dropdown" && /*#__PURE__*/React.createElement("div", {
    className: "show-box-item"
  }, /*#__PURE__*/React.createElement("div", {
    className: "data-verification-range"
  }, /*#__PURE__*/React.createElement("input", {
    className: "formulaInputFocus",
    spellCheck: "false",
    value: context.dataVerification.dataRegulation.value1,
    placeholder: dataVerification.placeholder1,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value1 = value;
      });
    }
  }), /*#__PURE__*/React.createElement("i", {
    className: "icon",
    "aria-hidden": "true",
    onClick: function onClick() {
      return dataSelectRange("dropDown", context.dataVerification.dataRegulation.value1);
    },
    tabIndex: 0
  }, /*#__PURE__*/React.createElement(SVGIcon, {
    name: "tab",
    width: 18
  }))), /*#__PURE__*/React.createElement("div", {
    className: "check"
  }, /*#__PURE__*/React.createElement("input", {
    type: "checkbox",
    checked: context.dataVerification.dataRegulation.type2 === "true",
    id: "mul",
    onChange: function onChange(e) {
      var checked = e.target.checked;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.type2 = "".concat(checked);
      });
    }
  }), /*#__PURE__*/React.createElement("label", {
    htmlFor: "mul"
  }, dataVerification.allowMultiSelect))), ((_context$dataVerifica2 = context.dataVerification) === null || _context$dataVerifica2 === void 0 || (_context$dataVerifica2 = _context$dataVerifica2.dataRegulation) === null || _context$dataVerifica2 === void 0 ? void 0 : _context$dataVerifica2.type) === "checkbox" && /*#__PURE__*/React.createElement("div", {
    className: "show-box-item"
  }, /*#__PURE__*/React.createElement("div", {
    className: "check-box"
  }, /*#__PURE__*/React.createElement("span", null, dataVerification.selected, " \u2014\u2014 "), /*#__PURE__*/React.createElement("input", {
    type: "text",
    className: "data-verification-value1",
    placeholder: dataVerification.placeholder2,
    value: (_context$dataVerifica3 = context.dataVerification) === null || _context$dataVerifica3 === void 0 || (_context$dataVerifica3 = _context$dataVerifica3.dataRegulation) === null || _context$dataVerifica3 === void 0 ? void 0 : _context$dataVerifica3.value1,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value1 = value;
      });
    }
  })), /*#__PURE__*/React.createElement("div", {
    className: "check-box"
  }, /*#__PURE__*/React.createElement("span", null, dataVerification.notSelected, " \u2014\u2014 "), /*#__PURE__*/React.createElement("input", {
    type: "text",
    className: "data-verification-value2",
    placeholder: dataVerification.placeholder2,
    value: (_context$dataVerifica4 = context.dataVerification) === null || _context$dataVerifica4 === void 0 || (_context$dataVerifica4 = _context$dataVerifica4.dataRegulation) === null || _context$dataVerifica4 === void 0 ? void 0 : _context$dataVerifica4.value2,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value2 = value;
      });
    }
  }))), (((_context$dataVerifica5 = context.dataVerification) === null || _context$dataVerifica5 === void 0 || (_context$dataVerifica5 = _context$dataVerifica5.dataRegulation) === null || _context$dataVerifica5 === void 0 ? void 0 : _context$dataVerifica5.type) === "number" || ((_context$dataVerifica6 = context.dataVerification) === null || _context$dataVerifica6 === void 0 || (_context$dataVerifica6 = _context$dataVerifica6.dataRegulation) === null || _context$dataVerifica6 === void 0 ? void 0 : _context$dataVerifica6.type) === "number_integer" || ((_context$dataVerifica7 = context.dataVerification) === null || _context$dataVerifica7 === void 0 || (_context$dataVerifica7 = _context$dataVerifica7.dataRegulation) === null || _context$dataVerifica7 === void 0 ? void 0 : _context$dataVerifica7.type) === "number_decimal" || ((_context$dataVerifica8 = context.dataVerification) === null || _context$dataVerifica8 === void 0 || (_context$dataVerifica8 = _context$dataVerifica8.dataRegulation) === null || _context$dataVerifica8 === void 0 ? void 0 : _context$dataVerifica8.type) === "text_length") && /*#__PURE__*/React.createElement("div", {
    className: "show-box-item"
  }, /*#__PURE__*/React.createElement("select", {
    className: "data-verification-type-select",
    value: context.dataVerification.dataRegulation.type2,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.type2 = value;
        ctx.dataVerification.dataRegulation.value1 = "";
        ctx.dataVerification.dataRegulation.value2 = "";
      });
    }
  }, numberCondition.map(function (v) {
    return /*#__PURE__*/React.createElement("option", {
      value: v,
      key: v
    }, dataVerification[v]);
  })), context.dataVerification.dataRegulation.type2 === "between" || context.dataVerification.dataRegulation.type2 === "notBetween" ? /*#__PURE__*/React.createElement("div", {
    className: "input-box"
  }, /*#__PURE__*/React.createElement("input", {
    type: "number",
    placeholder: "1",
    value: context.dataVerification.dataRegulation.value1,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value1 = value;
      });
    }
  }), /*#__PURE__*/React.createElement("span", null, "-"), /*#__PURE__*/React.createElement("input", {
    type: "number",
    placeholder: "100",
    value: context.dataVerification.dataRegulation.value2,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value2 = value;
      });
    }
  })) : /*#__PURE__*/React.createElement("div", {
    className: "input-box"
  }, /*#__PURE__*/React.createElement("input", {
    type: "number",
    style: {
      width: "100%"
    },
    placeholder: dataVerification.placeholder3,
    value: context.dataVerification.dataRegulation.value1,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value1 = value;
      });
    }
  }))), ((_context$dataVerifica9 = context.dataVerification) === null || _context$dataVerifica9 === void 0 || (_context$dataVerifica9 = _context$dataVerifica9.dataRegulation) === null || _context$dataVerifica9 === void 0 ? void 0 : _context$dataVerifica9.type) === "text_content" && /*#__PURE__*/React.createElement("div", {
    className: "show-box-item"
  }, /*#__PURE__*/React.createElement("select", {
    className: "data-verification-type-select",
    value: context.dataVerification.dataRegulation.type2,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.type2 = value;
        ctx.dataVerification.dataRegulation.value1 = "";
        ctx.dataVerification.dataRegulation.value2 = "";
      });
    }
  }, ["include", "exclude", "equal"].map(function (v) {
    return /*#__PURE__*/React.createElement("option", {
      value: v,
      key: v
    }, dataVerification[v]);
  })), /*#__PURE__*/React.createElement("div", {
    className: "input-box"
  }, /*#__PURE__*/React.createElement("input", {
    type: "text",
    style: {
      width: "100%"
    },
    placeholder: dataVerification.placeholder4,
    value: context.dataVerification.dataRegulation.value1,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value1 = value;
      });
    }
  }))), ((_context$dataVerifica10 = context.dataVerification) === null || _context$dataVerifica10 === void 0 || (_context$dataVerifica10 = _context$dataVerifica10.dataRegulation) === null || _context$dataVerifica10 === void 0 ? void 0 : _context$dataVerifica10.type) === "date" && /*#__PURE__*/React.createElement("div", {
    className: "show-box-item"
  }, /*#__PURE__*/React.createElement("select", {
    className: "data-verification-type-select",
    value: context.dataVerification.dataRegulation.type2,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.type2 = value;
        ctx.dataVerification.dataRegulation.value1 = "";
        ctx.dataVerification.dataRegulation.value2 = "";
      });
    }
  }, dateCondition.map(function (v) {
    return /*#__PURE__*/React.createElement("option", {
      value: v,
      key: v
    }, dataVerification[v]);
  })), context.dataVerification.dataRegulation.type2 === "between" || context.dataVerification.dataRegulation.type2 === "notBetween" ? /*#__PURE__*/React.createElement("div", {
    className: "input-box"
  }, /*#__PURE__*/React.createElement("input", {
    type: "date",
    placeholder: "1",
    value: context.dataVerification.dataRegulation.value1,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value1 = value;
      });
    }
  }), /*#__PURE__*/React.createElement("span", null, "-"), /*#__PURE__*/React.createElement("input", {
    type: "date",
    placeholder: "100",
    value: context.dataVerification.dataRegulation.value2,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value2 = value;
      });
    }
  })) : /*#__PURE__*/React.createElement("div", {
    className: "input-box"
  }, /*#__PURE__*/React.createElement("input", {
    type: "date",
    style: {
      width: "100%"
    },
    placeholder: dataVerification.placeholder3,
    value: context.dataVerification.dataRegulation.value1,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.value1 = value;
      });
    }
  }))), ((_context$dataVerifica11 = context.dataVerification) === null || _context$dataVerifica11 === void 0 || (_context$dataVerifica11 = _context$dataVerifica11.dataRegulation) === null || _context$dataVerifica11 === void 0 ? void 0 : _context$dataVerifica11.type) === "validity" && /*#__PURE__*/React.createElement("div", {
    className: "show-box-item"
  }, /*#__PURE__*/React.createElement("select", {
    className: "data-verification-type-select",
    value: context.dataVerification.dataRegulation.type2,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.type2 = value;
        ctx.dataVerification.dataRegulation.value1 = "";
        ctx.dataVerification.dataRegulation.value2 = "";
      });
    }
  }, ["identificationNumber", "phoneNumber"].map(function (v) {
    return /*#__PURE__*/React.createElement("option", {
      value: v,
      key: v
    }, dataVerification[v]);
  })))), /*#__PURE__*/React.createElement("div", {
    className: "box-item"
  },
  // (["remote", "prohibitInput", "hintShow"] as const)
  ["prohibitInput", "hintShow"].map(function (v) {
    return /*#__PURE__*/React.createElement("div", {
      className: "check",
      key: "div".concat(v)
    }, /*#__PURE__*/React.createElement("input", {
      type: "checkbox",
      id: v,
      key: "input".concat(v),
      checked: context.dataVerification.dataRegulation[v],
      onChange: function onChange() {
        setContext(function (ctx) {
          var _ctx$dataVerification3;
          var dataRegulation = (_ctx$dataVerification3 = ctx.dataVerification) === null || _ctx$dataVerification3 === void 0 ? void 0 : _ctx$dataVerification3.dataRegulation;
          // if (v === "remote") {
          //   dataRegulation!.remote = !dataRegulation!.remote;
          // } else
          if (v === "prohibitInput") {
            dataRegulation.prohibitInput = !dataRegulation.prohibitInput;
          } else if (v === "hintShow") {
            dataRegulation.hintShow = !dataRegulation.hintShow;
          }
        });
      }
    }), /*#__PURE__*/React.createElement("label", {
      htmlFor: v,
      key: "label".concat(v)
    }, dataVerification[v]));
  }), ((_context$dataVerifica12 = context.dataVerification) === null || _context$dataVerifica12 === void 0 || (_context$dataVerifica12 = _context$dataVerifica12.dataRegulation) === null || _context$dataVerifica12 === void 0 ? void 0 : _context$dataVerifica12.hintShow) && /*#__PURE__*/React.createElement("div", {
    className: "input-box"
  }, /*#__PURE__*/React.createElement("input", {
    type: "text",
    style: {
      width: "100%"
    },
    placeholder: dataVerification.placeholder5,
    value: context.dataVerification.dataRegulation.hintValue,
    onChange: function onChange(e) {
      var value = e.target.value;
      setContext(function (ctx) {
        ctx.dataVerification.dataRegulation.hintValue = value;
      });
    }
  })))), /*#__PURE__*/React.createElement("div", {
    className: "button-basic button-primary",
    onClick: function onClick() {
      // hideDialog();
      btn("confirm");
    },
    tabIndex: 0
  }, button.confirm), /*#__PURE__*/React.createElement("div", {
    className: "button-basic button-close",
    onClick: function onClick() {
      btn("delete");
    },
    tabIndex: 0
  }, dataVerification.deleteVerification), /*#__PURE__*/React.createElement("div", {
    className: "button-basic button-close",
    onClick: function onClick() {
      btn("close");
    },
    tabIndex: 0
  }, button.cancel));
};
export default DataVerification;