public-projects-laravel/cms
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

調整media設定選項欄位的樣式

Browse Source
This commit is contained in:
kroutony 2020-02-23 01:04:19 +08:00
parent be87044080
commit c68e25de0a
4 changed files with 38 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

37
app/Presenters/Admin/OptionFormFieldsPresenter.php
View File

@ -61,17 +61,34 @@ class OptionFormFieldsPresenter
'value' => $mediaFiledId
], $bastHtmlArgs));
$mediaFieldContentHtml .= $presenter->div([
'class' => 'preview',
'html' => $previewImgHtml
'class' => 'form-group row',
'html' => $presenter->div([
'class' => 'col-6',
'html' => $presenter->div([
'class' => 'preview',
'html' => $previewImgHtml
])
])
]);
$mediaFieldContentHtml .= $presenter->button([
'class' => ['btn', 'btn-success', 'select-media'],
'html' => '選擇'
]);
$mediaFieldContentHtml .= $presenter->button([
'class' => ['btn', 'btn-danger', 'clear-media'],
'style' => !$mediaFile ? 'display:none;' : '',
'html' => '清除'
$mediaFieldContentHtml .= $presenter->div([
'class' => 'form-group row',
'html' => [
$presenter->div([
'class' => 'col-3',
'html' => $presenter->button([
'class' => ['btn', 'btn-success', 'select-media'],
'html' => trans('form.buttons.select')
])
]),
$presenter->div([
'class' => 'col-3',
'html' => $presenter->button([
'class' => ['btn', 'btn-danger', 'clear-media'],
'style' => !$mediaFile ? 'display:none;' : '',
'html' => trans('form.buttons.remove')
])
])
]
]);
$html .= $presenter->div([
'class' => 'option-media-field',

12
resources/js/admin/page/options.js vendored
View File

@ -1,9 +1,10 @@
$('.select-media').on('click', e => {
e.preventDefault()
let $this = $(e.currentTarget),
$input = $this.siblings('input'),
$preview = $this.siblings('.preview'),
$clearButton = $this.siblings('.clear-media')
$wrapper = $this.closest('.option-media-field'),
$input = $wrapper.find('input'),
$preview = $wrapper.find('.preview'),
$clearButton = $wrapper.find('.clear-media')
app.methods.media(true, $input.get(0), true, (data) => {
let media = data.medias[0]
@ -17,8 +18,9 @@ $('.select-media').on('click', e => {
$('.clear-media').on('click', e => {
e.preventDefault()
let $this = $(e.currentTarget),
$input = $this.siblings('input'),
$preview = $this.siblings('.preview')
$wrapper = $this.closest('.option-media-field'),
$input = $wrapper.find('input'),
$preview = $wrapper.find('.preview')
$input.val(null)
$preview.empty()

4
resources/lang/en/form.php
View File

@ -1,6 +1,8 @@
<?php
return [
'buttons' => [
'update' => 'Update'
'update' => 'Update',
'select' => 'Select',
'remove' => 'Remove'
]
];

2
resources/sass/admin/page/options.scss vendored
View File

@ -1,7 +1,7 @@
.option-media-field {
.preview {
img {
max-width: 50%;
max-width: 100%;
}
}
}