add modal_yesno.jsx
このコミットが含まれているのは:
dragon1211
コミット
50e1ecaed8
|
|
@ -11744,11 +11744,12 @@ input[type=date].hide-calender::-webkit-inner-spin-button, input[type=date].hide
|
|||
right: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 30px 16px;
|
||||
padding: 25px 16px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
border-radius: 0;
|
||||
z-index: 10;
|
||||
-webkit-animation: 1s ease-out 3s 1 normal forwards running fadeOut;
|
||||
animation: 1s ease-out 3s 1 normal forwards running fadeOut;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16294,6 +16294,8 @@ __webpack_require__(/*! ./child/profile/withdrawal */ "./resources/js/child/prof
|
|||
|
||||
__webpack_require__(/*! ./component/notification */ "./resources/js/component/notification.jsx");
|
||||
|
||||
__webpack_require__(/*! ./component/modal_yesno */ "./resources/js/component/modal_yesno.jsx");
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./resources/js/bootstrap.js":
|
||||
|
|
@ -17361,6 +17363,18 @@ __webpack_require__.r(__webpack_exports__);
|
|||
/* harmony import */ var axios__WEBPACK_IMPORTED_MODULE_2___default = /*#__PURE__*/__webpack_require__.n(axios__WEBPACK_IMPORTED_MODULE_2__);
|
||||
/* harmony import */ var _component_notification__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../component/notification */ "./resources/js/component/notification.jsx");
|
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js");
|
||||
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(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
||||
|
||||
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -17369,6 +17383,11 @@ __webpack_require__.r(__webpack_exports__);
|
|||
|
||||
|
||||
var DetailOfMeeting = function DetailOfMeeting() {
|
||||
var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(''),
|
||||
_useState2 = _slicedToArray(_useState, 2),
|
||||
alertStatus = _useState2[0],
|
||||
setAlertStatus = _useState2[1];
|
||||
|
||||
(0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {
|
||||
var formdata = new FormData();
|
||||
var child_id = 1; // axios.get('/api/meetings/listOfNonApprovalOfChild', {child_id: child_id})
|
||||
|
|
@ -17385,6 +17404,15 @@ var DetailOfMeeting = function DetailOfMeeting() {
|
|||
// })
|
||||
// .catch(err=>console.log(err))
|
||||
}, []);
|
||||
|
||||
var showAlert = function showAlert() {
|
||||
setAlertStatus(true);
|
||||
var timer = setTimeout(function () {
|
||||
clearTimeout(timer);
|
||||
setAlertStatus(false);
|
||||
}, 4000);
|
||||
};
|
||||
|
||||
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
|
||||
className: "l-content-w560",
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsxs)("div", {
|
||||
|
|
@ -17395,9 +17423,9 @@ var DetailOfMeeting = function DetailOfMeeting() {
|
|||
children: "\u30DF\u30FC\u30C6\u30A3\u30F3\u30B0\u8A73\u7D30"
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
|
||||
className: "p-consent-btn",
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
|
||||
"data-v-ade1d018": "",
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("button", {
|
||||
className: "btn-default btn-yellow btn-consent btn-shadow btn-r8 btn-h42 btn-fz14",
|
||||
onClick: showAlert,
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
|
||||
children: "\u627F\u8A8D"
|
||||
})
|
||||
|
|
@ -17522,7 +17550,7 @@ var DetailOfMeeting = function DetailOfMeeting() {
|
|||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
|
||||
className: "p-article__pdf__btn mr-0",
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("a", {
|
||||
href: "assets/img/dummy/sample.pdf",
|
||||
href: "/assets/img/dummy/sample.pdf",
|
||||
className: "btn-default btn-yellow btn-pdf btn-r8 btn-h60 h-xs-45-px",
|
||||
target: "_blank",
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("span", {
|
||||
|
|
@ -17542,6 +17570,12 @@ var DetailOfMeeting = function DetailOfMeeting() {
|
|||
})
|
||||
})
|
||||
})
|
||||
}), alertStatus == 'success' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
|
||||
className: "alert-success ft-17 ft-md-15",
|
||||
children: "\u627F\u8A8D\u3057\u307E\u3057\u305F\u3002"
|
||||
}), alertStatus == 'failed' && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_4__.jsx)("div", {
|
||||
className: "alert-danger ft-17 ft-md-15",
|
||||
children: "\u5931\u6557\u3057\u307E\u3057\u305F\u3002"
|
||||
})]
|
||||
});
|
||||
};
|
||||
|
|
@ -19152,6 +19186,52 @@ function Alert(props) {
|
|||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./resources/js/component/modal_yesno.jsx":
|
||||
/*!************************************************!*\
|
||||
!*** ./resources/js/component/modal_yesno.jsx ***!
|
||||
\************************************************/
|
||||
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
|
||||
|
||||
"use strict";
|
||||
__webpack_require__.r(__webpack_exports__);
|
||||
/* harmony export */ __webpack_require__.d(__webpack_exports__, {
|
||||
/* harmony export */ "default": () => (/* binding */ ModalYesNo)
|
||||
/* harmony export */ });
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "./node_modules/react/index.js");
|
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react/jsx-runtime */ "./node_modules/react/jsx-runtime.js");
|
||||
|
||||
|
||||
|
||||
function ModalYesNo(props) {
|
||||
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("section", {
|
||||
"class": "modal-area",
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("div", {
|
||||
"class": "modal-bg"
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("div", {
|
||||
"class": "modal-wrap",
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("p", {
|
||||
"class": "modal-ttl",
|
||||
children: ["\u672A\u627F\u77E5\u306E\u65B9\u306B\u518D\u901A\u77E5\u3057\u307E\u3059\u304C", /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("br", {}), "\u3088\u308D\u3057\u3044\u3067\u3057\u3087\u3046\u304B\u3002"]
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsxs)("ul", {
|
||||
"class": "modal-answer",
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("li", {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("p", {
|
||||
"class": "close-modal",
|
||||
children: "\u3044\u3044\u3048"
|
||||
})
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("li", {
|
||||
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_1__.jsx)("a", {
|
||||
href: "",
|
||||
children: "\u306F\u3044"
|
||||
})
|
||||
})]
|
||||
})]
|
||||
})]
|
||||
});
|
||||
}
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ "./resources/js/component/notification.jsx":
|
||||
/*!*************************************************!*\
|
||||
!*** ./resources/js/component/notification.jsx ***!
|
||||
|
|
|
|||
|
|
@ -28,4 +28,5 @@ require('./child/profile/withdrawal');
|
|||
|
||||
|
||||
require('./component/notification')
|
||||
require('./component/modal_yesno')
|
||||
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@ import Notification from '../../component/notification';
|
|||
|
||||
const DetailOfMeeting = () => {
|
||||
|
||||
const [alertStatus, setAlertStatus] = useState('');
|
||||
|
||||
useEffect(
|
||||
() => {
|
||||
|
|
@ -28,6 +29,15 @@ const DetailOfMeeting = () => {
|
|||
// .catch(err=>console.log(err))
|
||||
},[]
|
||||
);
|
||||
|
||||
const showAlert = () => {
|
||||
|
||||
setAlertStatus(true);
|
||||
let timer = setTimeout(()=>{
|
||||
clearTimeout(timer);
|
||||
setAlertStatus(false);
|
||||
}, 4000)
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="l-content-w560">
|
||||
|
|
@ -35,9 +45,9 @@ const DetailOfMeeting = () => {
|
|||
<div className="l-content__ttl__left">
|
||||
<h2>ミーティング詳細</h2>
|
||||
<div className="p-consent-btn">
|
||||
<a data-v-ade1d018="" className="btn-default btn-yellow btn-consent btn-shadow btn-r8 btn-h42 btn-fz14">
|
||||
<button className="btn-default btn-yellow btn-consent btn-shadow btn-r8 btn-h42 btn-fz14" onClick={showAlert}>
|
||||
<span>承認</span>
|
||||
</a>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<Notification/>
|
||||
|
|
@ -88,7 +98,7 @@ const DetailOfMeeting = () => {
|
|||
|
||||
<div className="p-article__pdf">
|
||||
<div className="p-article__pdf__btn mr-0">
|
||||
<a href="assets/img/dummy/sample.pdf" className="btn-default btn-yellow btn-pdf btn-r8 btn-h60 h-xs-45-px" target="_blank">
|
||||
<a href="/assets/img/dummy/sample.pdf" className="btn-default btn-yellow btn-pdf btn-r8 btn-h60 h-xs-45-px" target="_blank">
|
||||
<span>PDFを確認する</span>
|
||||
</a>
|
||||
</div>
|
||||
|
|
@ -102,6 +112,10 @@ const DetailOfMeeting = () => {
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{ alertStatus == 'success' && <div className="alert-success ft-17 ft-md-15">承認しました。</div> }
|
||||
{ alertStatus == 'failed' && <div className="alert-danger ft-17 ft-md-15">失敗しました。</div> }
|
||||
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,19 @@
|
|||
import React, { useEffect, useState } from 'react';
|
||||
|
||||
export default function ModalYesNo(props){
|
||||
|
||||
|
||||
return (
|
||||
<section class="modal-area">
|
||||
<div class="modal-bg"></div>
|
||||
<div class="modal-wrap">
|
||||
<p class="modal-ttl">未承知の方に再通知しますが<br/>よろしいでしょうか。</p>
|
||||
<ul class="modal-answer">
|
||||
<li><p class="close-modal">いいえ</p></li>
|
||||
<li><a href="">はい</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
|
|
@ -7,11 +7,12 @@
|
|||
right: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 30px 16px;
|
||||
padding: 25px 16px;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-weight: 700;
|
||||
border-radius: 0;
|
||||
z-index: 10;
|
||||
// duration | timing-function | delay | iteration-count | direction | fill-mode | play-state | name
|
||||
animation: 1s ease-out 3s 1 normal forwards running fadeOut;
|
||||
|
||||
|
|
|
|||
新しいイシューから参照