feat: add new route matching param position

[lookbrook]

Please answer these questions before submitting a pull request, or your PR will get closed.

Why submit this pull request?

• Bugfix
• New feature provided
• Improve performance
• Backport patches

What changes will this PR take into?

add a new route matching param position, so that we can use the build-in parameter such as var.server_port

Related issues

fix/resolve #1961

Checklist:

• Did you explain what problem does this PR solve? Or what new features have been added?
• Have you added corresponding test cases?
• Have you modified the corresponding document?
• Is this PR backward compatible? If it is not backward compatible, please discuss on the mailing list first

[netlify]

✔️ Deploy Preview for apisix-dashboard ready!

🔨 Explore the source changes: d289af4

🔍 Inspect the deploy log: https://app.netlify.com/sites/apisix-dashboard/deploys/612da1ce2ad55c0008b0be5e

😎 Browse the preview: https://deploy-preview-1984--apisix-dashboard.netlify.app/

[codecov-commenter]

Codecov Report

Merging #1984 (d289af4) into master (709d815) will increase coverage by 0.61%.
The diff coverage is 85.71%.

@@            Coverage Diff             @@
##           master    #1984      +/-   ##
==========================================
+ Coverage   66.63%   67.25%   +0.61%     
==========================================
  Files         121      121              
  Lines        3231     3243      +12     
  Branches      787      790       +3     
==========================================
+ Hits         2153     2181      +28     
+ Misses       1078     1062      -16     

Flag	Coverage Δ
frontend-e2e-test	67.25% <85.71%> (+0.61%)	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files	Coverage Δ
web/src/pages/Route/transform.ts	80.87% <81.81%> (+0.98%)	⬆️
...pages/Route/components/Step1/MatchingRulesView.tsx	83.51% <100.00%> (+18.74%)	⬆️

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update bcdd3b6...d289af4. Read the comment docs.

[juzhiyuan]

see here, need your help to update codes :)

[liuxiran]

Hi @lookbrook , the code looks good to me, would you please add the related test case for this nice feature?

you can refer to

apisix-dashboard/web/cypress/integration/route/create-edit-duplicate-delete-route.spec.js

Line 105 in 9b18c35

cy.contains('Advanced Routing Matching Conditions')

to create a route with buildin vars and configure it, check if this rule seted successfully, and then change it to another param, check if it can configure successfully.

[lookbrook]

Hi @lookbrook , the code looks good to me, would you please add the related test case for this nice feature?

you can refer to

apisix-dashboard/web/cypress/integration/route/create-edit-duplicate-delete-route.spec.js

Line 105 in 9b18c35

cy.contains('Advanced Routing Matching Conditions')

to create a route with buildin vars and configure it, check if this rule seted successfully, and then change it to another param, check if it can configure successfully.

ok, I will try it

[lookbrook]

I am studying, please contact me if something need to modify

[liuxiran]

also cc @Baoyuantop @iamayushdas @guoqqqi for review, thanks a lot

[guoqqqi]

LGTM!