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 'value' => $mediaFiledId
], $bastHtmlArgs)); ], $bastHtmlArgs));
$mediaFieldContentHtml .= $presenter->div([ $mediaFieldContentHtml .= $presenter->div([
'class' => 'preview', 'class' => 'form-group row',
'html' => $previewImgHtml 'html' => $presenter->div([
'class' => 'col-6',
'html' => $presenter->div([
'class' => 'preview',
'html' => $previewImgHtml
])
])
]); ]);
$mediaFieldContentHtml .= $presenter->button([ $mediaFieldContentHtml .= $presenter->div([
'class' => ['btn', 'btn-success', 'select-media'], 'class' => 'form-group row',
'html' => '選擇' 'html' => [
]); $presenter->div([
$mediaFieldContentHtml .= $presenter->button([ 'class' => 'col-3',
'class' => ['btn', 'btn-danger', 'clear-media'], 'html' => $presenter->button([
'style' => !$mediaFile ? 'display:none;' : '', 'class' => ['btn', 'btn-success', 'select-media'],
'html' => '清除' '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([ $html .= $presenter->div([
'class' => 'option-media-field', 'class' => 'option-media-field',

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

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

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

@ -1,6 +1,8 @@
<?php <?php
return [ return [
'buttons' => [ '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 { .option-media-field {
.preview { .preview {
img { img {
max-width: 50%; max-width: 100%;
} }
} }
} }