[FLINK-28589][runtime-web] enhance web UI for speculative execution

[yangjunhan]

What is the purpose of the change

As a follow-up step of FLIP-168 and FLIP-224, the Flink Web UI now needs to be enhanced to display the related information if the speculative execution mechanism is enabled. This PR enhances the web UI for the newly adopted API changes.

Brief change log

• show blocked free slots and blocked TM in overview
• show blocked badge in TM list and detail pages
• enable expanded rows of other concurrent attempts for subtasks
• others: replace loading icon with text to avoid spin animation bottleneck

Verifying this change

This change is a trivial rework / code cleanup without any test coverage.

Does this pull request potentially affect one of the following parts:

• Dependencies (does it add or upgrade a dependency): no
• The public API, i.e., is any changed class annotated with @Public(Evolving): no
• The serializers: no
• The runtime per-record code paths (performance sensitive): no
• Anything that affects deployment or recovery: JobManager (and its components), Checkpointing, Kubernetes/Yarn, ZooKeeper: no
• The S3 file system connector: no

Documentation

• Does this pull request introduce a new feature? no
• If yes, how is the feature documented? not applicable

[yangjunhan]

Hi, @simplejason. Could you help me review this PR which only concerns web UI changes?

[flinkbot]

CI report:

• 77ceb1e Azure: SUCCESS

Bot commands

The @flinkbot bot supports the following commands:

• @flinkbot run azure re-run the last Azure build

[simplejason]

LGTM. I just left some comments about code style, it's not a block to this PR :) Thanks for your efforts for this 👍

[yangjunhan]

@simplejason Thanks for the advice. All mentioned above have been taken care of.

[yangjunhan]

@flinkbot run azure

[zhuzhurk]

@flinkbot run azure

[zhuzhurk]

Thanks for opening this PR! @yangjunhan
We have verified the change locally along with speculative execution and it looks good.

[zhuzhurk]

Merging.