WP_PLUGIN/POST_ORDER_BY_ARCHIVE
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

並べ替えのレイアウト修正

Browse Source 
JSの変数宣言を最適化
This commit is contained in:
nobu
2021-12-12 18:07:35 +09:00
parent bc37f8ac26
commit f96800dc9e
5 changed files with 83 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/apop-style.css
+27 -21
View File
@@ -52,16 +52,18 @@ h3 {
.list-orders-outer { .list-orders-outer {
width: 100%; width: 100%;
display: flex;
margin-bottom: 1em; margin-bottom: 1em;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between; justify-content: space-between;
} }
.list-orders-inner { .list-orders-inner {
width: calc((100% / 2) - 20px); width: calc(100% - 60px);
padding: .5em; margin: 1em auto;
padding: .5em 1em;
position: relative; position: relative;
background: #eee;
border-radius: 12px;
} }
.sort-menu-list { .sort-menu-list {
@@ -146,15 +148,19 @@ dl.apop-setting-list-dd .sort-custom-field-input {
.drag-sort .product-list { .drag-sort .product-list {
border: 1px solid #ccc; border: 1px solid #ccc;
border-radius: 6px;
} }
.enable-box .product-list { .enable-box .product-list {
padding: 1em .3em; width: calc((50%) - 30px);
background: #eee; padding: 1em;
background: #fff;
border: 1px solid #bbb;
border-radius: 6px;
} }
.enable-box .product-list:hover { .enable-box .product-list:hover {
border: 1px solid #bbb; border: 1px solid #999;
} }
.custom_field_key_select, .custom_field_key_select,
@@ -172,10 +178,6 @@ dl.apop-setting-list-dd .sort-custom-field-input {
width: calc((100%) - 60px); width: calc((100%) - 60px);
} }
.enable-box .product-list-type-label {
width: calc(100% / 2);
}
.search-normal-sort .product-list-sort-type { .search-normal-sort .product-list-sort-type {
width: 100%; width: 100%;
display: flex; display: flex;
@@ -196,6 +198,7 @@ dl.apop-setting-list-dd .sort-custom-field-input {
.product-list.no-order { .product-list.no-order {
background: #ababab; background: #ababab;
border-radius: 6px;
} }
.list-order { .list-order {
@@ -256,7 +259,6 @@ dl.apop-setting-list-dd .sort-custom-field-input {
.disable-normal-list { .disable-normal-list {
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
justify-content: space-between;
margin: .5em 1em 1em 0; margin: .5em 1em 1em 0;
} }
@@ -267,7 +269,7 @@ dl.apop-setting-list-dd .sort-custom-field-input {
} }
.disable-box .product-list { .disable-box .product-list {
width: calc((100% / 2) - 15px); width: calc((25%) - 15px);
display: flex; display: flex;
cursor: default; cursor: default;
} }
@@ -291,7 +293,7 @@ dl.apop-setting-list-dd .sort-custom-field-input {
.enable-box, .enable-box,
.disable-box { .disable-box {
padding: .5em; padding: .5em;
border: 1px solid #ccc; /*border-bottom: 1px solid #ccc;*/
} }
.enable-box h4 { .enable-box h4 {
@@ -311,9 +313,9 @@ dl.apop-setting-list-dd .sort-custom-field-input {
@media only screen and (max-width: 1264px) { @media only screen and (max-width: 1264px) {
.enable-box .product-list,
.disable-box .product-list { .enable-box .product-list {
display: block; width: calc((100%) - 15px);
} }
.search-normal-sort .product-list { .search-normal-sort .product-list {
@@ -351,13 +353,9 @@ dl.apop-setting-list-dd .sort-custom-field-input {
width: 98%; width: 98%;
} }
.list-orders-outer {
display: block;;
}
.list-orders-inner { .list-orders-inner {
width: auto; width: auto;
margin: 1.5em 0 0 0; margin: 1.5em 1em 0;
} }
dl.apop-setting-list dt { dl.apop-setting-list dt {
@@ -379,4 +377,12 @@ dl.apop-setting-list-dd .sort-custom-field-input {
width: auto; width: auto;
white-space: normal; white-space: normal;
} }
.disable-normal-list {
display: block;
}
.disable-box .product-list {
width: 100%;
}
} }
js/apop-style.js
+50 -50
View File
@@ -21,15 +21,15 @@ jQuery(function ($) {
custom_field_select(); custom_field_select();
function change_tab_menu() { function change_tab_menu() {
let apop_submit_type = $('#apop_submit_type'); const apop_submit_type = $('#apop_submit_type');
let order_nav_list = $('.post-order-nav li'); const order_nav_list = $('.post-order-nav li');
let order_box = $('.post-order-box'); const order_box = $('.post-order-box');
init(); init();
click_menu(); click_menu();
function init() { function init() {
let submit_type = apop_submit_type.val(); const submit_type = apop_submit_type.val();
order_nav_list.removeClass('en'); order_nav_list.removeClass('en');
order_box.hide(); order_box.hide();
$('.post-order-nav li:eq(' + submit_type + ')').addClass('en'); $('.post-order-nav li:eq(' + submit_type + ')').addClass('en');
@@ -39,7 +39,7 @@ jQuery(function ($) {
function click_menu() { function click_menu() {
order_nav_list.on('click', function () { order_nav_list.on('click', function () {
if (!$(this).hasClass('en')) { if (!$(this).hasClass('en')) {
let target_index = $(this).index(); const target_index = $(this).index();
order_nav_list.removeClass('en'); order_nav_list.removeClass('en');
$(this).addClass('en'); $(this).addClass('en');
order_box.hide(); order_box.hide();
@@ -51,13 +51,13 @@ jQuery(function ($) {
} }
function order_list() { function order_list() {
let cat_ul_count = $('.post-order-list').length; //カテゴリ総数 const cat_ul_count = $('.post-order-list').length; //カテゴリ総数
for (let i = 0; i < cat_ul_count; i++) { for (let i = 0; i < cat_ul_count; i++) {
let my_list = $('.post-order-list:eq(' + i + ')'); const my_list = $('.post-order-list:eq(' + i + ')');
my_list.sortable( my_list.sortable(
{ {
update: function () { update: function () {
let list_count = $('.product-list', my_list).length; const list_count = $('.product-list', my_list).length;
for (let j = 0; j < list_count; j++) { for (let j = 0; j < list_count; j++) {
let list_order_num = j + 1; let list_order_num = j + 1;
$('.list-order:eq(' + j + ')', my_list).val(list_order_num); $('.list-order:eq(' + j + ')', my_list).val(list_order_num);
@@ -71,38 +71,38 @@ jQuery(function ($) {
} }
function change_sort_box() { function change_sort_box() {
let s_radio = $('.sort_menu'); const s_radio = $('.sort_menu');
let sort_menu_size = $('.sort-menu-list').length; const sort_menu_size = $('.sort-menu-list').length;
$('.sort_box').hide(); $('.sort_box').hide();
for (let i = 0; i < sort_menu_size; i++) { for (let i = 0; i < sort_menu_size; i++) {
let type_index = $('.sort-menu-list:eq(' + i + ')').data('order_target') - 1; const elm = $('.sort-menu-list:eq(' + i + ')');
$('.sort-menu-list:eq(' + i + ')').siblings('.sort_box:eq(' + type_index + ')').show(); const type_index = elm.data('order_target') - 1;
elm.siblings('.sort_box:eq(' + type_index + ')').show();
} }
s_radio.on('click', function () { s_radio.on('click', function () {
let target_index = $(this).val() - 1; const target_index = $(this).val() - 1;
$(this).parents('.list-orders-inner').find('.sort_box').hide(); $(this).parents('.list-orders-inner').find('.sort_box').hide();
$(this).parents('.list-orders-inner').find('.sort_box:eq(' + target_index + ')').show(); $(this).parents('.list-orders-inner').find('.sort_box:eq(' + target_index + ')').show();
}) })
} }
function select_tax() { function select_tax() {
let select_cat_checkbox = $('.select_cat_checkbox'); const select_cat_checkbox = $('.select_cat_checkbox');
let input_chk_size = select_cat_checkbox.length; const input_chk_size = select_cat_checkbox.length;
let i = 0; for (let i = 0; i < input_chk_size; i++) {
const chk = $('.select_cat_checkbox:eq(' + i + '):checked').length;
for (i; i < input_chk_size; i++) { const elm = $('.select_cat:eq(' + i + ')');
let chk = $('.select_cat_checkbox:eq(' + i + '):checked').length; if (chk === 1) {
if (chk == 1) { elm.siblings('.select-per-page').show();
$('.select_cat:eq(' + i + ')').siblings('.select-per-page').show();
} else { } else {
$('.select_cat:eq(' + i + ')').siblings('.select-per-page').hide(); elm.siblings('.select-per-page').hide();
} }
} }
select_cat_checkbox.on('click', function () { select_cat_checkbox.on('click', function () {
let checked = $(this).prop('checked'); const checked = $(this).prop('checked');
if (checked) { if (checked) {
$(this).parent().parent().siblings('.select-per-page').show(200); $(this).parent().parent().siblings('.select-per-page').show(200);
} else { } else {
@@ -113,17 +113,17 @@ jQuery(function ($) {
} }
function change_search_per_page() { function change_search_per_page() {
let per_page_cat = $('.per_page_search'); const per_page_cat = $('.per_page_search');
let per_page_input = $('.per_page_search_input'); const per_page_input = $('.per_page_search_input');
if (per_page_input.val() == '') { if (per_page_input.val() === '') {
per_page_input.prop('disabled', true); per_page_input.prop('disabled', true);
} else { } else {
per_page_input.prop('disabled', false); per_page_input.prop('disabled', false);
} }
per_page_cat.on('click', function () { per_page_cat.on('click', function () {
if ($(this).val() != 'default' && $(this).val() != '-1' && $(this).val() != 'all') { if ($(this).val() !== 'default' && $(this).val() !== '-1' && $(this).val() !== 'all') {
per_page_input.prop('disabled', false); per_page_input.prop('disabled', false);
} else { } else {
per_page_input.val(''); per_page_input.val('');
@@ -133,11 +133,11 @@ jQuery(function ($) {
} }
function change_tax_per_page() { function change_tax_per_page() {
let set_number = $('.set_number'); const set_number = $('.set_number');
let input_chk_size = set_number.length; const input_chk_size = set_number.length;
for (let i = 0; i < input_chk_size; i++) { for (let i = 0; i < input_chk_size; i++) {
let input_num_box = $('.set_number:eq(' + i + ')').siblings('.per_page_cat_input'); const input_num_box = $('.set_number:eq(' + i + ')').siblings('.per_page_cat_input');
if (input_num_box.val() == '') { if (input_num_box.val() === '') {
input_num_box.prop('disabled', true); input_num_box.prop('disabled', true);
} else { } else {
input_num_box.prop('disabled', false); input_num_box.prop('disabled', false);
@@ -154,57 +154,57 @@ jQuery(function ($) {
} }
function change_normal_field_sort() { function change_normal_field_sort() {
let s_box = $('.sort_box'); const s_box = $('.sort_box');
let targets = '.sort_date_check, .sort_title_check, .sort_ID_check, .sort_modified_check'; const targets = '.sort_date_check, .sort_title_check, .sort_ID_check, .sort_modified_check';
s_box.find(targets).each(function () { s_box.find(targets).each(function () {
if ($(this).prop('checked') == false) { if ($(this).prop('checked') === false) {
$(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', true); $(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', true);
let disable_list = $(this).parents('.sort_box').find('.disable-normal-list'); const disable_list = $(this).parents('.sort_box').find('.disable-normal-list');
$(this).parents('li').appendTo(disable_list); $(this).parents('li').appendTo(disable_list);
} }
}); });
$(targets).on('click', function () { $(targets).on('click', function () {
if ($(this).prop('checked') == true) { if ($(this).prop('checked') === true) {
$(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', false); $(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', false);
let enable_list = $(this).parents('.sort_box').find('.post-order-list'); const enable_list = $(this).parents('.sort_box').find('.post-order-list');
$(this).parents('li').appendTo(enable_list).removeClass('no-order').hide().fadeIn(200); $(this).parents('li').appendTo(enable_list).removeClass('no-order').hide().fadeIn(200);
} else { } else {
$(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', true); $(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', true);
let disable_list = $(this).parents('.sort_box').find('.disable-normal-list'); const disable_list = $(this).parents('.sort_box').find('.disable-normal-list');
$(this).parents('li').appendTo(disable_list).addClass('no-order').hide().fadeIn(200); $(this).parents('li').appendTo(disable_list).addClass('no-order').hide().fadeIn(200);
} }
}); });
} }
function custom_field_select() { function custom_field_select() {
let s_box = $('.sort_box'); const s_box = $('.sort_box');
let targets = $('.custom-field-type'); const targets = $('.custom-field-type');
let en_dis_check = $('.custom_field_check'); const en_dis_check = $('.custom_field_check');
// カスタムフィールドソートの有効・無効を判定する。 // カスタムフィールドソートの有効・無効を判定する。
// 有効の場合はカスタムフィールド選択or追加のステータスに応じてテキストエリアとセレクトタグenableに変更し表示を切り替える。 // 有効の場合はカスタムフィールド選択or追加のステータスに応じてテキストエリアとセレクトタグenableに変更し表示を切り替える。
// 無効の場合はカスタムフィールドのテキストエリアとセレクトタグをDisableにし無効ボックスに移動する。 // 無効の場合はカスタムフィールドのテキストエリアとセレクトタグをDisableにし無効ボックスに移動する。
s_box.find('.custom_field_check').each(function () { s_box.find('.custom_field_check').each(function () {
if ($(this).prop('checked') == false) { if ($(this).prop('checked') === false) {
let disable_list = $(this).parents('.sort_box').find('.disable-normal-list'); const disable_list = $(this).parents('.sort_box').find('.disable-normal-list');
$(this).parents('li').appendTo(disable_list); $(this).parents('li').appendTo(disable_list);
dis_list($(this)); dis_list($(this));
} else { } else {
let target_type = $(this).parents('.product-list-sort-type').find('.custom-field-type').filter(':checked').val(); const target_type = $(this).parents('.product-list-sort-type').find('.custom-field-type').filter(':checked').val();
en_dis_list($(this), target_type); en_dis_list($(this), target_type);
} }
}); });
//有効・無効チェックボックスクリック時 //有効・無効チェックボックスクリック時
en_dis_check.on('click', function () { en_dis_check.on('click', function () {
if ($(this).prop('checked') == true) { if ($(this).prop('checked') === true) {
let enable_list = $(this).parents('.sort_box').find('.post-order-list'); const enable_list = $(this).parents('.sort_box').find('.post-order-list');
let target_type = $(this).parents('.product-list-sort-type').find('.custom-field-type').filter(':checked').val(); const target_type = $(this).parents('.product-list-sort-type').find('.custom-field-type').filter(':checked').val();
$(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', false); $(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', false);
$(this).parents('li').appendTo(enable_list).removeClass('no-order').hide().fadeIn(200); $(this).parents('li').appendTo(enable_list).removeClass('no-order').hide().fadeIn(200);
en_dis_list($(this), target_type); en_dis_list($(this), target_type);
} else { } else {
let disable_list = $(this).parents('.sort_box').find('.disable-normal-list'); const disable_list = $(this).parents('.sort_box').find('.disable-normal-list');
$(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', true); $(this).parents('.product-list-sort-type').find('.order_param').prop('disabled', true);
$(this).parents('li').appendTo(disable_list).addClass('no-order').hide().fadeIn(200); $(this).parents('li').appendTo(disable_list).addClass('no-order').hide().fadeIn(200);
dis_list($(this)); dis_list($(this));
@@ -228,11 +228,11 @@ jQuery(function ($) {
select_msg = '既存のカスタムフィールドから選択'; select_msg = '既存のカスタムフィールドから選択';
add_msg = 'APOP専用カスタムフィールドを追加'; add_msg = 'APOP専用カスタムフィールドを追加';
} }
if (type == 1) { if (type === 1) {
obj.parents('.product-list-sort-type').find('.custom_field_key_select').prop('disabled', false).show(); obj.parents('.product-list-sort-type').find('.custom_field_key_select').prop('disabled', false).show();
obj.parents('.product-list-sort-type').find('.custom_field_key').prop('disabled', true).hide(); obj.parents('.product-list-sort-type').find('.custom_field_key').prop('disabled', true).hide();
obj.parents('.product-list-sort-type').find('.custom-field-select-alert').text(select_msg); obj.parents('.product-list-sort-type').find('.custom-field-select-alert').text(select_msg);
} else if (type == 2) { } else if (type === 2) {
obj.parents('.product-list-sort-type').find('.custom_field_key').prop('disabled', false).show(); obj.parents('.product-list-sort-type').find('.custom_field_key').prop('disabled', false).show();
obj.parents('.product-list-sort-type').find('.custom_field_key_select').prop('disabled', true).hide(); obj.parents('.product-list-sort-type').find('.custom_field_key_select').prop('disabled', true).hide();
obj.parents('.product-list-sort-type').find('.custom-field-select-alert').text(add_msg); obj.parents('.product-list-sort-type').find('.custom-field-select-alert').text(add_msg);
template/order.php
+6 -2
View File
@@ -18,6 +18,7 @@ $submit_type = APOP_UI::input_post_filter( 'apop_submit_type', 'str' );
<?php wp_nonce_field( 'sh_options' ); ?> <?php wp_nonce_field( 'sh_options' ); ?>
<input id="apop_submit_type" type="hidden" name="apop_submit_type" <input id="apop_submit_type" type="hidden" name="apop_submit_type"
value="<?php echo esc_attr( $submit_type ); ?>"> value="<?php echo esc_attr( $submit_type ); ?>">
<!-- 最新の投稿の設定 -->
<div class="post-order-box"> <div class="post-order-box">
<div class="list-orders-outer"> <div class="list-orders-outer">
<div class="list-orders-inner"> <div class="list-orders-inner">
@@ -27,7 +28,6 @@ $submit_type = APOP_UI::input_post_filter( 'apop_submit_type', 'str' );
$order_target = APOP_UI::get_order_type( $order_target_type ); $order_target = APOP_UI::get_order_type( $order_target_type );
?> ?>
<?php include APOP_PLUGIN_PATH . 'template/order_parts_menu.php'; ?> <?php include APOP_PLUGIN_PATH . 'template/order_parts_menu.php'; ?>
<hr>
<p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p> <p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p>
<div class="sort_box"> <div class="sort_box">
<div class="enable-box"> <div class="enable-box">
@@ -49,6 +49,7 @@ $submit_type = APOP_UI::input_post_filter( 'apop_submit_type', 'str' );
</div> </div>
</div> </div>
</div> </div>
<!-- 検索の設定　-->
<div class="post-order-box"> <div class="post-order-box">
<div class="list-orders-outer"> <div class="list-orders-outer">
<div class="list-orders-inner"> <div class="list-orders-inner">
@@ -58,7 +59,6 @@ $submit_type = APOP_UI::input_post_filter( 'apop_submit_type', 'str' );
$order_target = APOP_UI::get_order_type( $order_target_type ); $order_target = APOP_UI::get_order_type( $order_target_type );
?> ?>
<?php include APOP_PLUGIN_PATH . 'template/order_parts_menu.php'; ?> <?php include APOP_PLUGIN_PATH . 'template/order_parts_menu.php'; ?>
<hr>
<p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p> <p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p>
<div class="sort_box"> <div class="sort_box">
<div class="enable-box"> <div class="enable-box">
@@ -80,6 +80,7 @@ $submit_type = APOP_UI::input_post_filter( 'apop_submit_type', 'str' );
</div> </div>
</div> </div>
</div> </div>
<!-- カテゴリーの設定　-->
<div class="post-order-box"> <div class="post-order-box">
<div class="tax_sort_box"> <div class="tax_sort_box">
<?php <?php
@@ -89,6 +90,7 @@ $submit_type = APOP_UI::input_post_filter( 'apop_submit_type', 'str' );
?> ?>
</div> </div>
</div> </div>
<!-- タグの設定　-->
<div class="post-order-box"> <div class="post-order-box">
<div class="tax_sort_box"> <div class="tax_sort_box">
<?php <?php
@@ -98,6 +100,7 @@ $submit_type = APOP_UI::input_post_filter( 'apop_submit_type', 'str' );
?> ?>
</div> </div>
</div> </div>
<!-- カスタム分類の設定　-->
<div class="post-order-box"> <div class="post-order-box">
<div class="tax_sort_box"> <div class="tax_sort_box">
<?php <?php
@@ -106,6 +109,7 @@ $submit_type = APOP_UI::input_post_filter( 'apop_submit_type', 'str' );
include APOP_PLUGIN_PATH . 'template/order_parts_taxonomy.php'; ?> include APOP_PLUGIN_PATH . 'template/order_parts_taxonomy.php'; ?>
</div> </div>
</div> </div>
<!-- カスタム投稿アーカイブの設定　-->
<div class="post-order-box"> <div class="post-order-box">
<div class="tax_sort_box"> <div class="tax_sort_box">
<?php <?php
template/order_parts_custom_posts.php
-2
View File
@@ -32,7 +32,6 @@
</ul> </ul>
<div class="sort_box"> <div class="sort_box">
<hr>
<p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p> <p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p>
<ul class="post-order-list drag-sort"> <ul class="post-order-list drag-sort">
<?php echo APOP_UI::create_custompost_archive_order_list( $custom_post['slug'] ); ?> <?php echo APOP_UI::create_custompost_archive_order_list( $custom_post['slug'] ); ?>
@@ -40,7 +39,6 @@
</div> </div>
<div class="sort_box"> <div class="sort_box">
<hr>
<p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p> <p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p>
<div class="enable-box"> <div class="enable-box">
<h4><?php _e( 'Enabled', APOP_DOMAIN ); ?></h4> <h4><?php _e( 'Enabled', APOP_DOMAIN ); ?></h4>
template/order_parts_taxonomy.php
-2
View File
@@ -32,7 +32,6 @@
</ul> </ul>
<div class="sort_box"> <div class="sort_box">
<hr>
<p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p> <p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p>
<ul class="post-order-list drag-sort"> <ul class="post-order-list drag-sort">
<?php echo APOP_UI::create_order_list( $tax_data, $tax_key ); ?> <?php echo APOP_UI::create_order_list( $tax_data, $tax_key ); ?>
@@ -40,7 +39,6 @@
</div> </div>
<div class="sort_box"> <div class="sort_box">
<hr>
<p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p> <p><?php _e( 'Click "Save Changes" to register the sort.', APOP_DOMAIN ); ?></p>
<div class="enable-box"> <div class="enable-box">
<h4><?php _e( 'Enabled', APOP_DOMAIN ); ?></h4> <h4><?php _e( 'Enabled', APOP_DOMAIN ); ?></h4>