← All changes
|
src/Addons/GlobalTieredPricing/CPT/Form/Form.php
+180
-100
6.1.0
→
8.0.2
View file →
| @@ -27,15 +27,18 @@ | ||
| 27 | 27 | |
| 28 | 28 | public function __construct() { |
| 29 | 29 | |
| 30 | 30 | add_action( 'init', function () { |
| 31 | - $this->tabs = apply_filters( 'tiered_pricing_table/global_pricing/form_tabs', array( | |
| 31 | + $tabs = array( | |
| 32 | 32 | new Pricing( $this ), |
| 33 | 33 | new ProductAndCategories( $this ), |
| 34 | 34 | new UsersAndRoles( $this ), |
| 35 | 35 | new Quantity( $this ), |
| 36 | - new Settings( $this ), | |
| 37 | - ) ); | |
| 36 | + ); | |
| 37 | + | |
| 38 | + $tabs[] = new Settings( $this ); | |
| 39 | + | |
| 40 | + $this->tabs = apply_filters( 'tiered_pricing_table/global_pricing/form_tabs', $tabs, $this ); | |
| 38 | 41 | } ); |
| 39 | 42 | |
| 40 | 43 | add_action( 'edit_form_after_title', function ( WP_Post $post ) { |
| 41 | 44 | if ( GlobalTieredPricingCPT::SLUG !== $post->post_type ) { |
| @@ -62,16 +65,15 @@ | ||
| 62 | 65 | .tpt-global-pricing-rule-form .woocommerce-help-tip { |
| 63 | 66 | margin-left: 5px; |
| 64 | 67 | } |
| 65 | 68 | |
| 66 | - /* tab hint */ | |
| 67 | 69 | .tpt-global-pricing-rule-hint { |
| 68 | 70 | display: flex; |
| 69 | 71 | align-items: center; |
| 70 | - padding: 10px 10px; | |
| 71 | - border: 1px solid #eee5ed; | |
| 72 | - background: #faf6f9; | |
| 73 | - color: #814c77 !important; | |
| 72 | + padding: 10px; | |
| 73 | + border-left: 3px solid var(--wp-admin-theme-color, #2271b1); | |
| 74 | + background: #f6f7f7; | |
| 75 | + color: var(--wp-admin-theme-color, #2271b1) !important; | |
| 74 | 76 | margin-bottom: 20px; |
| 75 | 77 | } |
| 76 | 78 | |
| 77 | 79 | .tpt-global-pricing-rule-hint--top-level { |
| @@ -117,9 +119,9 @@ | ||
| 117 | 119 | } |
| 118 | 120 | |
| 119 | 121 | .tpt-global-pricing-rule-form-tab--active { |
| 120 | 122 | cursor: default; |
| 121 | - background: #faf6f9; | |
| 123 | + background: #f6f7f7; | |
| 122 | 124 | } |
| 123 | 125 | |
| 124 | 126 | .tpt-global-pricing-rule-form-tab__icon { |
| 125 | 127 | transition: all .1s; |
| @@ -126,11 +128,11 @@ | ||
| 126 | 128 | margin-right: 10px; |
| 127 | 129 | height: 40px; |
| 128 | 130 | aspect-ratio: 1/1; |
| 129 | 131 | border-radius: 50%; |
| 130 | - background: #faf6f9; | |
| 132 | + background: #f6f7f7; | |
| 131 | 133 | text-align: center; |
| 132 | - color: #814c77; | |
| 134 | + color: var(--wp-admin-theme-color, #2271b1); | |
| 133 | 135 | font-size: 20px; |
| 134 | 136 | font-weight: bold; |
| 135 | 137 | display: flex; |
| 136 | 138 | justify-content: center; |
| @@ -138,9 +140,9 @@ | ||
| 138 | 140 | } |
| 139 | 141 | |
| 140 | 142 | .tpt-global-pricing-rule-form-tab--active h3, |
| 141 | 143 | .tpt-global-pricing-rule-form-tab--active div { |
| 142 | - color: #814c77 !important; | |
| 144 | + color: var(--wp-admin-theme-color, #2271b1) !important; | |
| 143 | 145 | } |
| 144 | 146 | |
| 145 | 147 | .tpt-global-pricing-rule-form-tab--active .tpt-global-pricing-rule-form-tab__icon { |
| 146 | 148 | background: #fff; |
| @@ -212,9 +214,9 @@ | ||
| 212 | 214 | display: none; |
| 213 | 215 | } |
| 214 | 216 | |
| 215 | 217 | .tpt-global-pricing-rule-form-tab--active { |
| 216 | - border-bottom: 3px solid #814c77; | |
| 218 | + border-bottom: 3px solid var(--wp-admin-theme-color, #2271b1); | |
| 217 | 219 | } |
| 218 | 220 | } |
| 219 | 221 | |
| 220 | 222 | @media screen and (max-width: 500px) { |
| @@ -221,8 +223,59 @@ | ||
| 221 | 223 | .tiered-pricing-form-block { |
| 222 | 224 | padding: 5px 20px !important; |
| 223 | 225 | } |
| 224 | 226 | } |
| 227 | + | |
| 228 | + /* Accordion styles */ | |
| 229 | + .tpt-exclusions-accordion { | |
| 230 | + margin-top: 20px; | |
| 231 | + background: #fff; | |
| 232 | + } | |
| 233 | + | |
| 234 | + .tpt-exclusions-accordion summary { | |
| 235 | + cursor: pointer; | |
| 236 | + list-style: none; | |
| 237 | + display: flex; | |
| 238 | + align-items: center; | |
| 239 | + justify-content: space-between; | |
| 240 | + padding: 12px 15px; | |
| 241 | + background: #f6f7f7; | |
| 242 | + border: 1px solid #e8e8e8; | |
| 243 | + font-size: 14px; | |
| 244 | + font-weight: 600; | |
| 245 | + color: #1d2327; | |
| 246 | + transition: background-color 0.2s ease; | |
| 247 | + } | |
| 248 | + | |
| 249 | + .tpt-exclusions-accordion summary::-webkit-details-marker { | |
| 250 | + display: none; | |
| 251 | + } | |
| 252 | + | |
| 253 | + .tpt-exclusions-accordion summary:hover { | |
| 254 | + background: #f0f0f1; | |
| 255 | + } | |
| 256 | + | |
| 257 | + .tpt-exclusions-accordion[open] summary { | |
| 258 | + border-bottom-left-radius: 0; | |
| 259 | + border-bottom-right-radius: 0; | |
| 260 | + border-bottom: 1px solid #e8e8e8; | |
| 261 | + } | |
| 262 | + | |
| 263 | + .tpt-exclusions-accordion[open] summary .tpt-accordion-icon { | |
| 264 | + transform: rotate(180deg); | |
| 265 | + } | |
| 266 | + | |
| 267 | + .tpt-accordion-icon { | |
| 268 | + transition: transform 0.3s ease; | |
| 269 | + color: #787c82; | |
| 270 | + } | |
| 271 | + | |
| 272 | + .tpt-exclusions-accordion-content { | |
| 273 | + padding: 15px 0; | |
| 274 | + border: 1px solid #e8e8e8; | |
| 275 | + border-top: none; | |
| 276 | + border-radius: 0 0 4px 4px; | |
| 277 | + } | |
| 225 | 278 | </style> |
| 226 | 279 | <script> |
| 227 | 280 | jQuery(document).ready(function () { |
| 228 | 281 | let tabs = jQuery('.tpt-global-pricing-rule-form-tab'); |
| @@ -265,15 +318,15 @@ | ||
| 265 | 318 | |
| 266 | 319 | <nav class="tpt-global-pricing-rule-form__tabs"> |
| 267 | 320 | <?php foreach ( $this->tabs as $tab ) : ?> |
| 268 | 321 | <div class="tpt-global-pricing-rule-form-tab <?php echo esc_attr( $tab->getId() === $this->defaultTab ? 'tpt-global-pricing-rule-form-tab--active' : '' ); ?>" |
| 269 | - data-target="tpt-global-pricing-rule-form-tab-<?php echo esc_attr( $tab->getId() ); ?>"> | |
| 322 | + data-target="tpt-global-pricing-rule-form-tab-<?php echo esc_attr( $tab->getId() ); ?>"> | |
| 270 | 323 | |
| 271 | 324 | <div class="tpt-global-pricing-rule-form-tab__icon" style=""> |
| 272 | - <?php if ( $tab->getIcon() === '$' ) : ?> | |
| 273 | - <span>$</span> | |
| 325 | + <?php if ( strpos( $tab->getIcon(), 'dashicons-' ) === 0 ) : ?> | |
| 326 | + <span class="dashicons <?php echo esc_attr( $tab->getIcon() ); ?>"></span> | |
| 274 | 327 | <?php else : ?> |
| 275 | - <span class="dashicons <?php echo esc_attr( $tab->getIcon() ); ?>"></span> | |
| 328 | + <span><?php echo esc_html( $tab->getIcon() ); ?></span> | |
| 276 | 329 | <?php endif; ?> |
| 277 | 330 | </div> |
| 278 | 331 | |
| 279 | 332 | <div class="tpt-global-pricing-rule-form-tab__title"> |
| @@ -288,9 +341,9 @@ | ||
| 288 | 341 | |
| 289 | 342 | <section class="tpt-global-pricing-rule-form__content woocommerce_options_panel"> |
| 290 | 343 | <?php foreach ( $this->tabs as $tab ) : ?> |
| 291 | 344 | <div class="tpt-global-pricing-rule-form-tab-content <?php echo esc_attr( $tab->getId() === $this->defaultTab ? 'tpt-global-pricing-rule-form-tab-content--active' : '' ); ?>" |
| 292 | - id="tpt-global-pricing-rule-form-tab-<?php echo esc_attr( $tab->getId() ); ?>"> | |
| 345 | + id="tpt-global-pricing-rule-form-tab-<?php echo esc_attr( $tab->getId() ); ?>"> | |
| 293 | 346 | <?php |
| 294 | 347 | $tab->render( $this->getPricingRuleInstance( $post ) ); |
| 295 | 348 | |
| 296 | 349 | do_action( 'tiered_pricing_table/global_pricing/form/tab_end', $tab, |
| @@ -321,83 +374,113 @@ | ||
| 321 | 374 | public function renderHelpingSteps() { |
| 322 | 375 | ?> |
| 323 | 376 | <style> |
| 324 | 377 | .tpt-global-pricing-rule-helping { |
| 325 | - background: #fff; | |
| 326 | - border: 1px solid #e8e8e8; | |
| 327 | - padding: 20px; | |
| 378 | + background: #ffffff; | |
| 379 | + border: 1px solid #e2e4e7; | |
| 380 | + border-radius: 8px; | |
| 381 | + padding: 30px; | |
| 328 | 382 | position: relative; |
| 329 | - text-align: center; | |
| 330 | 383 | margin: 20px 0; |
| 384 | + box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05); | |
| 385 | + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif; | |
| 331 | 386 | } |
| 332 | 387 | |
| 333 | 388 | .tpt-global-pricing-rule-helping__close { |
| 334 | 389 | position: absolute; |
| 335 | - top: 10px; | |
| 336 | - width: 26px; | |
| 337 | - height: 26px; | |
| 338 | - background: #faf6f9; | |
| 339 | - color: #814c77; | |
| 390 | + top: 15px; | |
| 391 | + width: 32px; | |
| 392 | + height: 32px; | |
| 393 | + background: #f0f0f1; | |
| 394 | + color: #3c434a; | |
| 340 | 395 | text-align: center; |
| 341 | - line-height: 24px; | |
| 342 | - right: 10px; | |
| 343 | - font-weight: bold; | |
| 396 | + line-height: 32px; | |
| 397 | + right: 15px; | |
| 398 | + font-weight: 600; | |
| 344 | 399 | border-radius: 50%; |
| 400 | + transition: all 0.2s ease; | |
| 345 | 401 | } |
| 346 | 402 | |
| 347 | 403 | .tpt-global-pricing-rule-helping__close:hover { |
| 348 | - background: #f3ddee; | |
| 404 | + background: #dcdcdd; | |
| 349 | 405 | cursor: pointer; |
| 406 | + transform: scale(1.05); | |
| 350 | 407 | } |
| 351 | 408 | |
| 409 | + .tpt-global-pricing-rule-helping__header { | |
| 410 | + text-align: center; | |
| 411 | + margin-bottom: 30px; | |
| 412 | + } | |
| 413 | + | |
| 352 | 414 | .tpt-global-pricing-rule-helping__title { |
| 353 | - font-size: 1.5em; | |
| 354 | - font-weight: bold; | |
| 355 | - margin-bottom: 15px; | |
| 415 | + font-size: 22px; | |
| 416 | + font-weight: 600; | |
| 417 | + color: #1d2327; | |
| 418 | + margin-bottom: 20px; | |
| 356 | 419 | } |
| 357 | 420 | |
| 421 | + .tpt-global-pricing-rule-helping__subtitle { | |
| 422 | + font-size: 14px; | |
| 423 | + color: #646970; | |
| 424 | + max-width: 650px; | |
| 425 | + margin: 0 auto; | |
| 426 | + line-height: 1.5; | |
| 427 | + } | |
| 428 | + | |
| 358 | 429 | .tpt-global-pricing-rule-helping__steps { |
| 359 | - justify-content: center; | |
| 430 | + display: grid; | |
| 431 | + grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); | |
| 360 | 432 | gap: 20px; |
| 361 | - display: flex; | |
| 362 | - align-items: center; | |
| 363 | - margin-top: 30px | |
| 364 | 433 | } |
| 365 | 434 | |
| 366 | - .tpt-global-pricing-rule-helping-step--arrow { | |
| 367 | - padding: 5px; | |
| 435 | + .tpt-global-pricing-rule-helping-step { | |
| 436 | + background: #ffffff; | |
| 437 | + border: 1px solid #e0e0e0; | |
| 438 | + border-radius: 8px; | |
| 439 | + padding: 24px 20px; | |
| 440 | + text-align: center; | |
| 441 | + transition: transform 0.2s ease, box-shadow 0.2s ease; | |
| 442 | + position: relative; | |
| 443 | + } | |
| 444 | + | |
| 445 | + .tpt-global-pricing-rule-helping-step:hover { | |
| 446 | + transform: translateY(-2px); | |
| 447 | + box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06); | |
| 448 | + border-color: #c3c4c7; | |
| 449 | + } | |
| 450 | + | |
| 451 | + .tpt-global-pricing-rule-helping-step__icon { | |
| 452 | + width: 52px; | |
| 453 | + height: 52px; | |
| 368 | 454 | border-radius: 50%; |
| 369 | - background: #faf6f9; | |
| 370 | - color: #814c77; | |
| 455 | + background: #e0f0fa; | |
| 456 | + color: #0070bc; | |
| 457 | + margin: 0 auto 16px; | |
| 458 | + display: flex; | |
| 459 | + align-items: center; | |
| 460 | + justify-content: center; | |
| 461 | + font-size: 24px; | |
| 462 | + font-weight: bold; | |
| 371 | 463 | } |
| 372 | 464 | |
| 373 | 465 | .tpt-global-pricing-rule-helping-step__title { |
| 374 | - font-size: 1.4em; | |
| 466 | + font-size: 15px; | |
| 375 | 467 | font-weight: 600; |
| 468 | + color: #1d2327; | |
| 469 | + margin-bottom: 8px; | |
| 376 | 470 | } |
| 377 | 471 | |
| 378 | 472 | .tpt-global-pricing-rule-helping-step__description { |
| 379 | - margin-top: 10px; | |
| 473 | + font-size: 13px; | |
| 474 | + color: #50575e; | |
| 475 | + line-height: 1.5; | |
| 380 | 476 | } |
| 381 | 477 | |
| 382 | - .tpt-global-pricing-rule-helping-step__icon, | |
| 383 | - .tpt-global-pricing-rule-helping-step__icon span { | |
| 384 | - width: 50px; | |
| 385 | - height: 50px; | |
| 386 | - border-radius: 50%; | |
| 387 | - background: #faf6f9; | |
| 388 | - margin: 0 auto 15px; | |
| 389 | - text-align: center; | |
| 390 | - color: #814c77; | |
| 391 | - font-size: 25px; | |
| 392 | - font-weight: bold; | |
| 393 | - line-height: 50px; | |
| 394 | - } | |
| 395 | 478 | </style> |
| 396 | 479 | <script> |
| 397 | 480 | jQuery(document).ready(function () { |
| 398 | 481 | jQuery('.tpt-global-pricing-rule-helping__close').click(function () { |
| 399 | - jQuery(this).parent().hide(); | |
| 482 | + jQuery(this).closest('.tpt-global-pricing-rule-helping').slideUp(200); | |
| 400 | 483 | }) |
| 401 | 484 | }) |
| 402 | 485 | </script> |
| 403 | 486 | <?php |
| @@ -402,55 +485,61 @@ | ||
| 402 | 485 | </script> |
| 403 | 486 | <?php |
| 404 | 487 | $steps = array( |
| 405 | 488 | array( |
| 406 | - 'title' => 'Add pricing', | |
| 407 | - 'description' => 'Set up custom regular and/or tiered pricing.', | |
| 408 | - 'icon' => '$', | |
| 409 | - 'has_next_step' => true, | |
| 489 | + 'title' => __( 'Set Custom Pricing', 'tier-pricing-table' ), | |
| 490 | + 'description' => __( 'Set custom regular and tiered pricing for matching products.', | |
| 491 | + 'tier-pricing-table' ), | |
| 492 | + 'icon' => '$', | |
| 410 | 493 | ), |
| 411 | 494 | array( |
| 412 | - 'title' => 'Select products', | |
| 413 | - 'description' => 'Select products or product categories that the rule will apply to.', | |
| 414 | - 'icon' => '<span class="dashicons dashicons-archive"></span>', | |
| 415 | - 'has_next_step' => true, | |
| 495 | + 'title' => __( 'Select Products', 'tier-pricing-table' ), | |
| 496 | + 'description' => __( 'Target specific products, categories, tags, or brands. Leave empty to apply store-wide.', | |
| 497 | + 'tier-pricing-table' ), | |
| 498 | + 'icon' => '<span class="dashicons dashicons-archive"></span>', | |
| 416 | 499 | ), |
| 417 | 500 | array( |
| 418 | - 'title' => 'Select users', | |
| 419 | - 'description' => 'Select users or user roles that the rule will apply to.', | |
| 420 | - 'icon' => '<span class="dashicons dashicons-admin-users"></span>', | |
| 421 | - 'has_next_step' => true, | |
| 501 | + 'title' => __( 'Filter Users', 'tier-pricing-table' ), | |
| 502 | + 'description' => 'Restrict this pricing to specific customers or user roles.', | |
| 503 | + 'icon' => '<span class="dashicons dashicons-admin-users"></span>', | |
| 422 | 504 | ), |
| 423 | 505 | array( |
| 424 | - 'title' => 'Specify quantity', | |
| 425 | - 'description' => 'Specify the minimum, maximum, and quantity step for products.', | |
| 426 | - 'icon' => '<span class="dashicons dashicons-database"></span>', | |
| 427 | - 'has_next_step' => false, | |
| 506 | + 'title' => __( 'Quantity Limits', 'tier-pricing-table' ), | |
| 507 | + 'description' => __( 'Enforce minimum, maximum, and step increments for purchasing.', | |
| 508 | + 'tier-pricing-table' ), | |
| 509 | + 'icon' => '<span class="dashicons dashicons-database"></span>', | |
| 428 | 510 | ), |
| 429 | 511 | ) |
| 430 | 512 | ?> |
| 431 | 513 | <div class="tpt-global-pricing-rule-helping"> |
| 432 | - <div class="tpt-global-pricing-rule-helping__title"> | |
| 433 | - <?php esc_html_e( 'How global pricing rules work', 'tier-pricing-table' ); ?> | |
| 514 | + <div class="tpt-global-pricing-rule-helping__close" | |
| 515 | + title="<?php esc_attr_e( 'Dismiss', 'tier-pricing-table' ); ?>"> | |
| 516 | + × | |
| 434 | 517 | </div> |
| 435 | - <p> | |
| 436 | - <?php | |
| 437 | - esc_html_e( 'Global rules are useful when you need to set custom pricing for multiple products and apply it to a specific group of users.', | |
| 438 | - 'tier-pricing-table' ); | |
| 439 | - ?> | |
| 440 | - </p> | |
| 441 | 518 | |
| 442 | - <p> | |
| 443 | - <?php | |
| 444 | - esc_html_e( 'Please note that depending on the priority settings, the global pricing rule may override product-level tiered pricing or quantity limits.', | |
| 445 | - 'tier-pricing-table' ); | |
| 446 | - ?> | |
| 447 | - </p> | |
| 519 | + <div class="tpt-global-pricing-rule-helping__header"> | |
| 520 | + <div class="tpt-global-pricing-rule-helping__title"> | |
| 521 | + <?php esc_html_e( 'How global pricing rules work', 'tier-pricing-table' ); ?> | |
| 522 | + </div> | |
| 523 | + <div class="tpt-global-pricing-rule-helping__subtitle"> | |
| 524 | + <p style="margin: 0 0 6px;"> | |
| 525 | + <?php | |
| 526 | + esc_html_e( 'Global rules enable you to bulk-apply dynamic pricing and quantity limits to selected groups of products and users simultaneously.', | |
| 527 | + 'tier-pricing-table' ); | |
| 528 | + ?> | |
| 529 | + </p> | |
| 530 | + <p style="margin: 0;"> | |
| 531 | + <?php | |
| 532 | + echo sprintf( '<strong>%s</strong> %s', esc_html__( 'Note:', 'tier-pricing-table' ), | |
| 533 | + esc_html__( 'Depending on your priority settings, global rules may override product-level pricing configurations.', | |
| 534 | + 'tier-pricing-table' ) ); | |
| 535 | + ?> | |
| 536 | + </p> | |
| 537 | + </div> | |
| 538 | + </div> | |
| 448 | 539 | |
| 449 | 540 | <div class="tpt-global-pricing-rule-helping__steps"> |
| 450 | - | |
| 451 | - <?php foreach ( $steps as $step ) : ?> | |
| 452 | - | |
| 541 | + <?php foreach ( $steps as $index => $step ) : ?> | |
| 453 | 542 | <div class="tpt-global-pricing-rule-helping-step"> |
| 454 | 543 | <div class="tpt-global-pricing-rule-helping-step__icon"> |
| 455 | 544 | <?php echo wp_kses_post( $step['icon'] ); ?> |
| 456 | 545 | </div> |
| @@ -462,18 +551,9 @@ | ||
| 462 | 551 | <div class="tpt-global-pricing-rule-helping-step__description"> |
| 463 | 552 | <?php echo esc_html( $step['description'] ); ?> |
| 464 | 553 | </div> |
| 465 | 554 | </div> |
| 466 | - | |
| 467 | - <?php if ( $step['has_next_step'] ) : ?> | |
| 468 | - <div class="tpt-global-pricing-rule-helping-step tpt-global-pricing-rule-helping-step--arrow"> | |
| 469 | - <span class="dashicons dashicons-arrow-right-alt"></span> | |
| 470 | - </div> | |
| 471 | - <?php endif; ?> | |
| 472 | 555 | <?php endforeach; ?> |
| 473 | - </div> | |
| 474 | - <div class="tpt-global-pricing-rule-helping__close"> | |
| 475 | - × | |
| 476 | 556 | </div> |
| 477 | 557 | </div> |
| 478 | 558 | <?php |
| 479 | 559 | } |