suwako
/
kikikan
アーカイブ
1
0
フォーク 0
コード イシュー プルリクエスト プロジェクト リリース Wiki アクティビティ

画像が何もない場合は正方形です。画像はbackground-size:contain;と同じ挙動になります。

このコミットが含まれているのは:
dragon1211 2021-11-01 23:24:42 +09:00
親 fa5609f9dd
コミット 1863990c4c
2個のファイルの変更、52行の追加、19行の削除
統計情報を表示 Patchファイルをダウンロード Diffファイルをダウンロード すべてのファイルを展開 すべてのファイルを折り畳む

55
backend/public/js/app.js vendored
ファイルの表示

@ -37337,6 +37337,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
var Transition = /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1__.forwardRef(function Transition(props, ref) {
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)(_mui_material_Slide__WEBPACK_IMPORTED_MODULE_8__.default, _objectSpread({
direction: "up",
@ -37371,23 +37372,28 @@ var MeetingDetail = function MeetingDetail(props) {
var _useState9 = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''),
_useState10 = _slicedToArray(_useState9, 2),
_400error = _useState10[0],
set400Error = _useState10[1];
thumbnail = _useState10[0],
setThumbnail = _useState10[1];
var _useState11 = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''),
_useState12 = _slicedToArray(_useState11, 2),
_success = _useState12[0],
setSuccess = _useState12[1];
_400error = _useState12[0],
set400Error = _useState12[1];
var _useState13 = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false),
var _useState13 = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(''),
_useState14 = _slicedToArray(_useState13, 2),
showPdf = _useState14[0],
setShowPdf = _useState14[1];
_success = _useState14[0],
setSuccess = _useState14[1];
var _useState15 = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false),
_useState16 = _slicedToArray(_useState15, 2),
showMemo = _useState16[0],
setShowMemo = _useState16[1];
showPdf = _useState16[0],
setShowPdf = _useState16[1];
var _useState17 = (0,react__WEBPACK_IMPORTED_MODULE_1__.useState)(false),
_useState18 = _slicedToArray(_useState17, 2),
showMemo = _useState18[0],
setShowMemo = _useState18[1];
(0,react__WEBPACK_IMPORTED_MODULE_1__.useEffect)(function () {
var _props$match$params;
@ -37413,6 +37419,7 @@ var MeetingDetail = function MeetingDetail(props) {
denominator: total,
numerator: num
}));
if (list.meeting_image.length > 0) setThumbnail(list.meeting_image[0].image);
} else if (response.data.status_code == 400) {//TODO
}
});
@ -37615,23 +37622,41 @@ var MeetingDetail = function MeetingDetail(props) {
className: "p-file-list",
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("div", {
className: "p-file-for",
children: meeting.meeting_image[0] && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("figure", {
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("img", {
src: meeting.meeting_image[0].image,
alt: meeting.meeting_image[0].image
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("figure", {
style: {
height: '300px'
},
children: thumbnail && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("img", {
src: thumbnail,
alt: "thumbnail",
style: {
width: '100%',
height: '100%',
objectFit: 'contain'
}
})
})
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {
className: "p-file-nav",
children: [(_meeting$meeting_imag = meeting.meeting_image) === null || _meeting$meeting_imag === void 0 ? void 0 : _meeting$meeting_imag.map(function (x, k) {
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("figure", {
style: {
minWidth: '100px'
},
children: /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("img", {
src: x.image,
alt: x.image
alt: x.image,
onClick: function onClick(e) {
return setThumbnail(x.image);
}
})
}, k);
}), _toConsumableArray(Array(10 - meeting.meeting_image.length)).map(function (x, k) {
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("figure", {}, k);
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsx)("figure", {
style: {
minWidth: '100px'
}
}, k);
})]
})]
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_7__.jsxs)("div", {

16
backend/resources/js/admin/meeting/detail.jsx
ファイルの表示

@ -17,6 +17,7 @@ import Slide from '@mui/material/Slide';
import Alert from '../../component/alert';
import ModalPdf from '../../component/admin/pdf_modal_admin';
import ModalMemo from '../../component/admin/modal_memo';
import { minWidth } from '@material-ui/system';
const Transition = React.forwardRef(function Transition(props, ref) {
@ -32,6 +33,7 @@ const MeetingDetail = (props) => {
const [loaded, setLoaded] = useState(false);
const [submit, setSubmit] = useState(false);
const [meeting, setMeeting] = useState(null);
const [thumbnail, setThumbnail] = useState('');
const [_400error, set400Error] = useState('');
const [_success, setSuccess] = useState('');
@ -57,6 +59,7 @@ const MeetingDetail = (props) => {
}
}
setMeeting({...list, denominator:total, numerator:num});
if(list.meeting_image.length > 0) setThumbnail(list.meeting_image[0].image);
} else if(response.data.status_code==400){
//TODO
}
@ -161,20 +164,25 @@ const MeetingDetail = (props) => {
<div className="p-file-list">
<div className="p-file-for">
<figure style={{height:'300px'}}>
{
meeting.meeting_image[0] &&
<figure><img src={meeting.meeting_image[0].image} alt={meeting.meeting_image[0].image} /></figure>
thumbnail &&
<img src={thumbnail} alt="thumbnail"
style={{width: '100%', height:'100%', objectFit:'contain'}}/>
}
</figure>
</div>
<div className="p-file-nav">
{
meeting.meeting_image?.map((x, k)=>
<figure key={k}><img src={x.image} alt={x.image} /></figure>
<figure key={k} style={{minWidth:'100px'}}>
<img src={x.image} alt={x.image} onClick={e=>setThumbnail(x.image)}/>
</figure>
)
}
{
[...Array(10-meeting.meeting_image.length)].map((x, k)=>
<figure key={k}></figure>
<figure key={k} style={{minWidth:'100px'}}></figure>
)
}
</div>