diff --git a/src/assets/images/map_bi/bottom_utils/bg7.png b/src/assets/images/map_bi/bottom_utils/bg7.png new file mode 100644 index 0000000..6d6077a Binary files /dev/null and b/src/assets/images/map_bi/bottom_utils/bg7.png differ diff --git a/src/assets/images/map_bi/bottom_utils/bg8.png b/src/assets/images/map_bi/bottom_utils/bg8.png new file mode 100644 index 0000000..e57dfd5 Binary files /dev/null and b/src/assets/images/map_bi/bottom_utils/bg8.png differ diff --git a/src/assets/images/map_bi/bottom_utils/first/img11.png b/src/assets/images/map_bi/bottom_utils/first/img11.png deleted file mode 100644 index 99a0f5a..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/first/img11.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/first/img11_on.png b/src/assets/images/map_bi/bottom_utils/first/img11_on.png deleted file mode 100644 index 8796d80..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/first/img11_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/first/img9.png b/src/assets/images/map_bi/bottom_utils/first/img9.png deleted file mode 100644 index 974138f..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/first/img9.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/first/img9_on.png b/src/assets/images/map_bi/bottom_utils/first/img9_on.png deleted file mode 100644 index 5508e5c..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/first/img9_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/01.png b/src/assets/images/map_bi/bottom_utils/second/01.png deleted file mode 100644 index 9aadfee..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/01.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/01_on.png b/src/assets/images/map_bi/bottom_utils/second/01_on.png deleted file mode 100644 index 3d05f16..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/01_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico18.png b/src/assets/images/map_bi/bottom_utils/second/ico18.png deleted file mode 100644 index 9a0e30f..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico18.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico18_on.png b/src/assets/images/map_bi/bottom_utils/second/ico18_on.png deleted file mode 100644 index a9b403a..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico18_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico20.png b/src/assets/images/map_bi/bottom_utils/second/ico20.png deleted file mode 100644 index eb9405f..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico20.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico20_on.png b/src/assets/images/map_bi/bottom_utils/second/ico20_on.png deleted file mode 100644 index 1472e5e..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico20_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico22.png b/src/assets/images/map_bi/bottom_utils/second/ico22.png deleted file mode 100644 index 1bff8e8..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico22.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico22_on.png b/src/assets/images/map_bi/bottom_utils/second/ico22_on.png deleted file mode 100644 index 3f6fefe..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico22_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico23.png b/src/assets/images/map_bi/bottom_utils/second/ico23.png deleted file mode 100644 index cd042fa..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico23.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico23_on.png b/src/assets/images/map_bi/bottom_utils/second/ico23_on.png deleted file mode 100644 index 98e2e94..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico23_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico24.png b/src/assets/images/map_bi/bottom_utils/second/ico24.png deleted file mode 100644 index 77ad605..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico24.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico24_on.png b/src/assets/images/map_bi/bottom_utils/second/ico24_on.png deleted file mode 100644 index 826a403..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico24_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico25.png b/src/assets/images/map_bi/bottom_utils/second/ico25.png deleted file mode 100644 index 3948917..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico25.png and /dev/null differ diff --git a/src/assets/images/map_bi/bottom_utils/second/ico25_on.png b/src/assets/images/map_bi/bottom_utils/second/ico25_on.png deleted file mode 100644 index 53ecf23..0000000 Binary files a/src/assets/images/map_bi/bottom_utils/second/ico25_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/bg1.png b/src/assets/images/map_bi/content/bg1.png deleted file mode 100644 index 8d39308..0000000 Binary files a/src/assets/images/map_bi/content/bg1.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon10.png b/src/assets/images/map_bi/content/icon10.png deleted file mode 100644 index bcf3e57..0000000 Binary files a/src/assets/images/map_bi/content/icon10.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon11.png b/src/assets/images/map_bi/content/icon11.png deleted file mode 100644 index ed05656..0000000 Binary files a/src/assets/images/map_bi/content/icon11.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon12.png b/src/assets/images/map_bi/content/icon12.png deleted file mode 100644 index 9ed9188..0000000 Binary files a/src/assets/images/map_bi/content/icon12.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon13.png b/src/assets/images/map_bi/content/icon13.png deleted file mode 100644 index bcf3e57..0000000 Binary files a/src/assets/images/map_bi/content/icon13.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon14.png b/src/assets/images/map_bi/content/icon14.png deleted file mode 100644 index ed05656..0000000 Binary files a/src/assets/images/map_bi/content/icon14.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon15.png b/src/assets/images/map_bi/content/icon15.png deleted file mode 100644 index 9ed9188..0000000 Binary files a/src/assets/images/map_bi/content/icon15.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon16.png b/src/assets/images/map_bi/content/icon16.png deleted file mode 100644 index 064f473..0000000 Binary files a/src/assets/images/map_bi/content/icon16.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon17.png b/src/assets/images/map_bi/content/icon17.png deleted file mode 100644 index a0df009..0000000 Binary files a/src/assets/images/map_bi/content/icon17.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon18.png b/src/assets/images/map_bi/content/icon18.png deleted file mode 100644 index f6bbe32..0000000 Binary files a/src/assets/images/map_bi/content/icon18.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon19.png b/src/assets/images/map_bi/content/icon19.png deleted file mode 100644 index c7bef67..0000000 Binary files a/src/assets/images/map_bi/content/icon19.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon20.png b/src/assets/images/map_bi/content/icon20.png deleted file mode 100644 index 432991b..0000000 Binary files a/src/assets/images/map_bi/content/icon20.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon21.png b/src/assets/images/map_bi/content/icon21.png deleted file mode 100644 index 191835e..0000000 Binary files a/src/assets/images/map_bi/content/icon21.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon22.png b/src/assets/images/map_bi/content/icon22.png deleted file mode 100644 index 9370a0e..0000000 Binary files a/src/assets/images/map_bi/content/icon22.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon23.png b/src/assets/images/map_bi/content/icon23.png deleted file mode 100644 index 42475ba..0000000 Binary files a/src/assets/images/map_bi/content/icon23.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon24.png b/src/assets/images/map_bi/content/icon24.png deleted file mode 100644 index ffe9c41..0000000 Binary files a/src/assets/images/map_bi/content/icon24.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon7.png b/src/assets/images/map_bi/content/icon7.png deleted file mode 100644 index 5b0d1fb..0000000 Binary files a/src/assets/images/map_bi/content/icon7.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon8.png b/src/assets/images/map_bi/content/icon8.png deleted file mode 100644 index 167f075..0000000 Binary files a/src/assets/images/map_bi/content/icon8.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/icon9.png b/src/assets/images/map_bi/content/icon9.png deleted file mode 100644 index 90010ec..0000000 Binary files a/src/assets/images/map_bi/content/icon9.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/img1_on.png b/src/assets/images/map_bi/content/img1_on.png deleted file mode 100644 index 532ca4c..0000000 Binary files a/src/assets/images/map_bi/content/img1_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/img1ico6.png b/src/assets/images/map_bi/content/img1ico6.png deleted file mode 100644 index ccffe80..0000000 Binary files a/src/assets/images/map_bi/content/img1ico6.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/img2_on.png b/src/assets/images/map_bi/content/img2_on.png deleted file mode 100644 index c22ef80..0000000 Binary files a/src/assets/images/map_bi/content/img2_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/img3_on.png b/src/assets/images/map_bi/content/img3_on.png deleted file mode 100644 index 0bfbb0e..0000000 Binary files a/src/assets/images/map_bi/content/img3_on.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/img6.png b/src/assets/images/map_bi/content/img6.png deleted file mode 100644 index f2cb191..0000000 Binary files a/src/assets/images/map_bi/content/img6.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/img9.png b/src/assets/images/map_bi/content/img9.png deleted file mode 100644 index f89febf..0000000 Binary files a/src/assets/images/map_bi/content/img9.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/qixiang_imgbg.png b/src/assets/images/map_bi/content/qixiang_imgbg.png deleted file mode 100644 index d37afee..0000000 Binary files a/src/assets/images/map_bi/content/qixiang_imgbg.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/qixiang_label.png b/src/assets/images/map_bi/content/qixiang_label.png deleted file mode 100644 index 119aa30..0000000 Binary files a/src/assets/images/map_bi/content/qixiang_label.png and /dev/null differ diff --git a/src/assets/images/map_bi/content/titbg.png b/src/assets/images/map_bi/content/titbg.png deleted file mode 100644 index ecddd40..0000000 Binary files a/src/assets/images/map_bi/content/titbg.png and /dev/null differ diff --git a/src/assets/images/map_bi/point/ico22.png b/src/assets/images/map_bi/point/ico22.png deleted file mode 100644 index 0789655..0000000 Binary files a/src/assets/images/map_bi/point/ico22.png and /dev/null differ diff --git a/src/assets/images/map_bi/point/ico23.png b/src/assets/images/map_bi/point/ico23.png deleted file mode 100644 index cab7875..0000000 Binary files a/src/assets/images/map_bi/point/ico23.png and /dev/null differ diff --git a/src/assets/images/map_bi/point/ico24.png b/src/assets/images/map_bi/point/ico24.png deleted file mode 100644 index 34bfcd8..0000000 Binary files a/src/assets/images/map_bi/point/ico24.png and /dev/null differ diff --git a/src/assets/images/map_bi/point/ico_people_blue.png b/src/assets/images/map_bi/point/ico_people_blue.png deleted file mode 100644 index 3dd97d5..0000000 Binary files a/src/assets/images/map_bi/point/ico_people_blue.png and /dev/null differ diff --git a/src/assets/images/map_bi/point/ico_people_orange.png b/src/assets/images/map_bi/point/ico_people_orange.png deleted file mode 100644 index a2fa564..0000000 Binary files a/src/assets/images/map_bi/point/ico_people_orange.png and /dev/null differ diff --git a/src/assets/images/map_bi/point/ico_people_red.png b/src/assets/images/map_bi/point/ico_people_red.png deleted file mode 100644 index afbb83c..0000000 Binary files a/src/assets/images/map_bi/point/ico_people_red.png and /dev/null differ diff --git a/src/assets/images/map_bi/point/ico_people_yellow.png b/src/assets/images/map_bi/point/ico_people_yellow.png deleted file mode 100644 index d0592a3..0000000 Binary files a/src/assets/images/map_bi/point/ico_people_yellow.png and /dev/null differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/bg11.png b/src/assets/images/map_bi/right_utils/branch_office/bg11.png new file mode 100644 index 0000000..1a599dd Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/bg11.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/button.png b/src/assets/images/map_bi/right_utils/branch_office/button.png new file mode 100644 index 0000000..1cc99fe Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/button.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/ico1.png b/src/assets/images/map_bi/right_utils/branch_office/ico1.png new file mode 100644 index 0000000..ef12f34 Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/ico1.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/ico2.png b/src/assets/images/map_bi/right_utils/branch_office/ico2.png new file mode 100644 index 0000000..269da92 Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/ico2.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/ico3.png b/src/assets/images/map_bi/right_utils/branch_office/ico3.png new file mode 100644 index 0000000..58b0075 Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/ico3.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/ico4.png b/src/assets/images/map_bi/right_utils/branch_office/ico4.png new file mode 100644 index 0000000..bedaf47 Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/ico4.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/ico5.png b/src/assets/images/map_bi/right_utils/branch_office/ico5.png new file mode 100644 index 0000000..c44a6ed Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/ico5.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/ico6.png b/src/assets/images/map_bi/right_utils/branch_office/ico6.png new file mode 100644 index 0000000..d3a3b6e Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/ico6.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/ico7.png b/src/assets/images/map_bi/right_utils/branch_office/ico7.png new file mode 100644 index 0000000..7e69cc3 Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/ico7.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/ico8.png b/src/assets/images/map_bi/right_utils/branch_office/ico8.png new file mode 100644 index 0000000..d382cab Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/ico8.png differ diff --git a/src/assets/images/map_bi/right_utils/branch_office/ico9.png b/src/assets/images/map_bi/right_utils/branch_office/ico9.png new file mode 100644 index 0000000..3dc3343 Binary files /dev/null and b/src/assets/images/map_bi/right_utils/branch_office/ico9.png differ diff --git a/src/assets/images/map_bi/right_utils/back.png b/src/assets/images/map_bi/right_utils/port/back.png similarity index 100% rename from src/assets/images/map_bi/right_utils/back.png rename to src/assets/images/map_bi/right_utils/port/back.png diff --git a/src/assets/images/map_bi/right_utils/bianjie.png b/src/assets/images/map_bi/right_utils/port/bianjie.png similarity index 100% rename from src/assets/images/map_bi/right_utils/bianjie.png rename to src/assets/images/map_bi/right_utils/port/bianjie.png diff --git a/src/assets/images/map_bi/right_utils/bianjie_on.png b/src/assets/images/map_bi/right_utils/port/bianjie_on.png similarity index 100% rename from src/assets/images/map_bi/right_utils/bianjie_on.png rename to src/assets/images/map_bi/right_utils/port/bianjie_on.png diff --git a/src/assets/images/map_bi/right_utils/del.png b/src/assets/images/map_bi/right_utils/port/del.png similarity index 100% rename from src/assets/images/map_bi/right_utils/del.png rename to src/assets/images/map_bi/right_utils/port/del.png diff --git a/src/assets/images/map_bi/right_utils/full.png b/src/assets/images/map_bi/right_utils/port/full.png similarity index 100% rename from src/assets/images/map_bi/right_utils/full.png rename to src/assets/images/map_bi/right_utils/port/full.png diff --git a/src/assets/images/map_bi/right_utils/full_on.png b/src/assets/images/map_bi/right_utils/port/full_on.png similarity index 100% rename from src/assets/images/map_bi/right_utils/full_on.png rename to src/assets/images/map_bi/right_utils/port/full_on.png diff --git a/src/assets/images/map_bi/right_utils/img2.png b/src/assets/images/map_bi/right_utils/port/img2.png similarity index 100% rename from src/assets/images/map_bi/right_utils/img2.png rename to src/assets/images/map_bi/right_utils/port/img2.png diff --git a/src/assets/images/map_bi/right_utils/img4.png b/src/assets/images/map_bi/right_utils/port/img4.png similarity index 100% rename from src/assets/images/map_bi/right_utils/img4.png rename to src/assets/images/map_bi/right_utils/port/img4.png diff --git a/src/assets/images/map_bi/right_utils/img4_on.png b/src/assets/images/map_bi/right_utils/port/img4_on.png similarity index 100% rename from src/assets/images/map_bi/right_utils/img4_on.png rename to src/assets/images/map_bi/right_utils/port/img4_on.png diff --git a/src/assets/images/map_bi/right_utils/map.png b/src/assets/images/map_bi/right_utils/port/map.png similarity index 100% rename from src/assets/images/map_bi/right_utils/map.png rename to src/assets/images/map_bi/right_utils/port/map.png diff --git a/src/assets/images/map_bi/right_utils/map_on.png b/src/assets/images/map_bi/right_utils/port/map_on.png similarity index 100% rename from src/assets/images/map_bi/right_utils/map_on.png rename to src/assets/images/map_bi/right_utils/port/map_on.png diff --git a/src/assets/images/map_bi/right_utils/qixiang.png b/src/assets/images/map_bi/right_utils/port/qixiang.png similarity index 100% rename from src/assets/images/map_bi/right_utils/qixiang.png rename to src/assets/images/map_bi/right_utils/port/qixiang.png diff --git a/src/assets/images/map_bi/right_utils/sisetu.png b/src/assets/images/map_bi/right_utils/port/sisetu.png similarity index 100% rename from src/assets/images/map_bi/right_utils/sisetu.png rename to src/assets/images/map_bi/right_utils/port/sisetu.png diff --git a/src/assets/images/map_bi/right_utils/sisetu_on.png b/src/assets/images/map_bi/right_utils/port/sisetu_on.png similarity index 100% rename from src/assets/images/map_bi/right_utils/sisetu_on.png rename to src/assets/images/map_bi/right_utils/port/sisetu_on.png diff --git a/src/assets/images/map_bi/right_utils/tooltip.png b/src/assets/images/map_bi/right_utils/port/tooltip.png similarity index 100% rename from src/assets/images/map_bi/right_utils/tooltip.png rename to src/assets/images/map_bi/right_utils/port/tooltip.png diff --git a/src/assets/images/map_bi/tanks.png b/src/assets/images/map_bi/tanks.png deleted file mode 100644 index 06472ba..0000000 Binary files a/src/assets/images/map_bi/tanks.png and /dev/null differ diff --git a/src/pages/Container/Map/components/BottomUtils/branchOfficeUtilsList.js b/src/pages/Container/Map/components/BottomUtils/branchOfficeUtilsList.js new file mode 100644 index 0000000..31bc7e4 --- /dev/null +++ b/src/pages/Container/Map/components/BottomUtils/branchOfficeUtilsList.js @@ -0,0 +1,236 @@ +import pointIco1 from "~/assets/images/map_bi/point/ico1.png"; +import pointIco2 from "~/assets/images/map_bi/point/ico2.png"; +import pointIco3 from "~/assets/images/map_bi/point/ico3.png"; +import pointIco4 from "~/assets/images/map_bi/point/ico4.png"; +import pointIco5 from "~/assets/images/map_bi/point/ico5.png"; +import pointIco6 from "~/assets/images/map_bi/point/ico6.png"; +import pointIco7 from "~/assets/images/map_bi/point/ico7.png"; +import pointIco8 from "~/assets/images/map_bi/point/ico8.png"; +import pointIco9 from "~/assets/images/map_bi/point/ico9.png"; +import pointIco10 from "~/assets/images/map_bi/point/ico10.png"; +import pointIco11 from "~/assets/images/map_bi/point/ico11.png"; +import pointIco12 from "~/assets/images/map_bi/point/ico12.png"; +import pointIco13 from "~/assets/images/map_bi/point/ico13.png"; +import pointIco14 from "~/assets/images/map_bi/point/ico14.png"; +import pointIco15 from "~/assets/images/map_bi/point/ico15.png"; +import pointIco16 from "~/assets/images/map_bi/point/ico16.png"; +import pointIco17 from "~/assets/images/map_bi/point/ico17.png"; +import pointIco19 from "~/assets/images/map_bi/point/ico19.png"; +import pointIco30 from "~/assets/images/map_bi/point/ico30.png"; +import pointIco31 from "~/assets/images/map_bi/point/ico31.png"; +import pointIco32 from "~/assets/images/map_bi/point/ico32.png"; +import pointIco33 from "~/assets/images/map_bi/point/ico33.png"; + +export const branchOfficeUtilsList = [ + { + label: "重点作业", + type: "danger", + list: [ + { + label: "动火作业", + type: "hotWork", + check: false, + mapIcon: pointIco9, + }, + { + label: "受限空间作业", + type: "confinedSpace", + check: false, + mapIcon: pointIco10, + }, + { + label: "临时用电作业", + type: "electricity", + check: false, + mapIcon: pointIco11, + }, + { + label: "高处作业", + type: "highWork", + check: false, + mapIcon: pointIco12, + }, + { + label: "断路作业", + type: "cutRoad", + check: false, + mapIcon: pointIco13, + }, + { + label: "动土作业", + type: "breakGround", + check: false, + mapIcon: pointIco14, + }, + { + label: "吊装作业", + type: "hoisting", + check: false, + mapIcon: pointIco15, + }, + { + label: "盲板抽堵作业", + type: "blindBoard", + check: false, + mapIcon: pointIco16, + }, + { + label: "摄像头", + check: false, + type: "camera", + mapIcon: pointIco3, + }, + ], + }, + { + label: "口门门禁", + type: "door", + list: [ + { + label: "口门", + check: false, + mapIcon: pointIco1, + type: "car", + }, + { + label: "人员", + check: false, + mapIcon: pointIco33, + type: "person", + }, + { + label: "车辆", + check: false, + mapIcon: pointIco2, + type: "car", + }, + { + label: "人员闸机", + check: false, + type: "personMachine", + }, + { + label: "车辆闸机", + check: false, + type: "carMachine", + }, + { + label: "摄像头", + check: false, + type: "camera", + mapIcon: pointIco3, + }, + ], + }, + { + label: "消防安全", + type: "fire", + list: [ + { + label: "消防救援队", + check: false, + mapIcon: pointIco4, + type: "xfjyd01", + }, + { + label: "消防控制室", + check: false, + type: "xfkzs01", + mapIcon: pointIco5, + }, + { + label: "消防泵房", + check: false, + type: "xfbf01", + mapIcon: pointIco6, + }, + { + label: "消防水源", + check: false, + type: "xfsy01", + mapIcon: pointIco7, + }, + { + label: "消防点位", + check: false, + type: "point", + mapIcon: pointIco8, + }, + { + label: "报警设备", + check: false, + type: "alarm", + mapIcon: pointIco32, + }, + ], + }, + { + label: "人员定位", + type: "people", + list: [ + { + label: "人员定位", + check: false, + type: "peoplePosition", + }, + { + label: "人员轨迹", + check: false, + type: "peopleTrajectory", + }, + ], + }, + { + label: "气象监测", + type: "weather", + list: [ + { + label: "气象站", + type: "293187ddfd984c9ab3fd716aef58da0e", + check: false, + mapIcon: pointIco17, + }, + { + label: "风速站", + type: "2da29f00852a4653ba3e760b9de57412", + check: false, + mapIcon: pointIco19, + }, + ], + }, + { + label: "重点工程", + type: "project", + list: [ + { + label: "重点工程定位", + check: false, + type: "project", + mapIcon: pointIco30, + }, + { + label: "视频定位", + check: false, + type: "video", + mapIcon: pointIco31, + }, + ], + }, + { + label: "视频巡屏", + type: "camera", + list: [ + { + label: "摄像头", + check: false, + type: "platCamera", + mapIcon: pointIco3, + }, + ], + }, + { + label: "封闭区域", + type: "closedArea", + list: [], + }, +]; diff --git a/src/pages/Container/Map/components/BottomUtils/index.js b/src/pages/Container/Map/components/BottomUtils/index.js index 08bd388..8016d3d 100644 --- a/src/pages/Container/Map/components/BottomUtils/index.js +++ b/src/pages/Container/Map/components/BottomUtils/index.js @@ -1,8 +1,10 @@ -import { useMount } from "ahooks"; -import { useContext, useState } from "react"; -import { CSSTransition } from "react-transition-group"; +import { useContext, useEffect, useState } from "react"; +import { CSSTransition, SwitchTransition } from "react-transition-group"; +import bg7 from "~/assets/images/map_bi/bottom_utils/bg7.png"; +import bg8 from "~/assets/images/map_bi/bottom_utils/bg8.png"; import titleImg from "~/assets/images/map_bi/bottom_utils/title.png"; import titleOnImg from "~/assets/images/map_bi/bottom_utils/title_on.png"; +import { branchOfficeUtilsList } from "~/pages/Container/Map/components/BottomUtils/branchOfficeUtilsList"; import { Context } from "~/pages/Container/Map/js/context"; import mitt from "~/pages/Container/Map/js/mitt"; import { @@ -20,10 +22,9 @@ function BottomUtils(props) { const { currentPort, pureMap, currentBranchOffice, bottomUtilsCurrentIndex } = useContext(Context); const [list, setList] = useState([]); - const [animationKey, setAnimationKey] = useState(0); const initList = () => { - setList(portUtilsList); + setList(!currentBranchOffice ? portUtilsList : branchOfficeUtilsList); }; const resetAllCheck = () => { @@ -35,11 +36,18 @@ function BottomUtils(props) { }); }; - useMount(() => { - setAnimationKey(Math.random()); + useEffect(() => { + mitt.on(initBottomUtilsMittKey, () => { + initList(); + }); + return () => { + mitt.off(initBottomUtilsMittKey); + }; + }, [currentBranchOffice]); + + useEffect(() => { mitt.on(changeBottomUtilsAnimationMittKey, () => { - setAnimationKey(Math.random()); }); mitt.on(resetBottomCurrentIndexMittKey, () => { props.setBottomUtilsCurrentIndex(-1); @@ -48,16 +56,18 @@ function BottomUtils(props) { resetAllCheck(); }); mitt.on(deletePeoplePositionPointMittKey, () => { - // closePeoplePosition(); }); - mitt.on(initBottomUtilsMittKey, () => { - initList(); - }); - }); + + return () => { + mitt.off(changeBottomUtilsAnimationMittKey); + mitt.off(resetBottomCurrentIndexMittKey); + mitt.off(resetAllBottomUtilsCheckMittKey); + mitt.off(deletePeoplePositionPointMittKey); + }; + }, []); const optionsClick = (index) => { props.setBottomUtilsCurrentIndex(bottomUtilsCurrentIndex === index ? -1 : index); - setAnimationKey(Math.random()); mitt.emit(changeContentAnimationKeyMittKey); }; @@ -70,83 +80,134 @@ function BottomUtils(props) { }); }; + const renderBranchOfficeUtils = () => { + return ( +
+ {list.map((item, index) => { + const isCurrentActive = bottomUtilsCurrentIndex === index; + // const hasActiveChildren = bottomUtilsCurrentIndex !== -1; + // if (hasActiveChildren && !isCurrentActive) { + // return null; + // } + + return ( +
optionsClick(index)} + > +
{item.label}
+ 0} + timeout={500} + classNames={{ + enter: "animate__animated animate__faster", + enterActive: "animate__animated animate__faster animate__fadeInUp", + exit: "animate__animated animate__faster", + exitActive: "animate__animated animate__faster animate__fadeOutDown", + }} + unmountOnExit + > +
+ {item.list?.map((item1, index1) => ( +
{ + e.stopPropagation(); + optionsItemsClick(index, index1, item, item1); + }} + > +
{item1.label}
+
+ ))} +
+
+
+ ); + })} +
+ ); + }; + + const renderPortUtils = () => { + return ( +
+ {list.map((item, index) => { + const isCurrentActive = bottomUtilsCurrentIndex === index; + const hasActiveChildren = bottomUtilsCurrentIndex !== -1; + if (hasActiveChildren && !isCurrentActive) { + return null; + } + + return ( +
optionsClick(index)}> + +
+ {item.label} +
+ 0} + timeout={500} + classNames={{ + enter: "animate__animated animate__faster", + enterActive: "animate__animated animate__faster animate__fadeInLeft", + exit: "animate__animated animate__faster", + exitActive: "animate__animated animate__faster animate__fadeOutLeft", + }} + unmountOnExit + > +
+ {item.list?.map((item1, index1) => ( +
{ + e.stopPropagation(); + optionsItemsClick(index, index1, item, item1); + }} + > + +
{item1.label}
+
+ ))} +
+
+
+ ); + })} +
+ ); + }; + + const renderUtils = () => { + if (pureMap || !currentPort) + return (
); + + return (!currentBranchOffice ? renderPortUtils() : renderBranchOfficeUtils()); + }; + return (
- -
- {list.map((item, index) => { - const isCurrentActive = bottomUtilsCurrentIndex === index; - const hasActiveChildren = bottomUtilsCurrentIndex !== -1; - if (hasActiveChildren && !isCurrentActive) { - return null; - } - - return ( -
optionsClick(index)} - > - -
- {item.label} -
- - 0} - timeout={500} - classNames={{ - enter: "animate__animated animate__faster", - enterActive: "animate__animated animate__faster animate__fadeInLeft", - exit: "animate__animated animate__faster", - exitActive: "animate__animated animate__faster animate__fadeOutLeft", - }} - unmountOnExit - > -
- {item.list?.map((item1, index1) => ( -
{ - e.stopPropagation(); - optionsItemsClick(index, index1, item, item1); - }} - > - -
- {item1.label} -
-
- ))} -
-
-
- ); - })} -
-
+ + + {renderUtils()} + +
); } diff --git a/src/pages/Container/Map/components/BottomUtils/index.less b/src/pages/Container/Map/components/BottomUtils/index.less index 93e28aa..92b1102 100644 --- a/src/pages/Container/Map/components/BottomUtils/index.less +++ b/src/pages/Container/Map/components/BottomUtils/index.less @@ -1,94 +1,140 @@ -.bottom_utils_container{ +.bottom_utils_container { .bottom_utils { width: 1000px; - height: 168px; + //height: 168px; position: absolute; bottom: 30px; left: calc(50% - 500px); display: flex; justify-content: space-between; - .option { - position: relative; - cursor: pointer; + &.port { + .option { + position: relative; + cursor: pointer; - .img { - width: 100px; - height: 100px; + .img { + width: 100px; + height: 100px; - &:hover { - animation: bottomUtilsContainerSlideY 0.5s; + &:hover { + animation: bottomUtilsContainerSlideY 0.5s; + } + } + + .label { + background-size: 100% 100%; + background-repeat: no-repeat; + width: 100px; + height: 30px; + text-align: center; + line-height: 30px; + color: #fff; + font-size: 14px; + } + + .items { + transform-origin: left; + display: flex; + position: absolute; + top: 8px; + left: 40px; + background-image: linear-gradient(to right, + rgba(31, 62, 129, 0) 0%, + rgba(31, 62, 129, 0.4) 50%, + rgba(31, 62, 129, 0) 100%); + border: 1px solid; + border-image: linear-gradient(to right, + rgba(255, 255, 255, 0) 0%, + rgba(255, 255, 255, 0.4) 50%, + rgba(255, 255, 255, 0) 100%) 1; + border-left: none; + border-right: none; + padding: 6px 50px; + + .item { + padding: 0 20px; + text-align: center; + + .child_img { + width: 60px; + height: 60px; + cursor: pointer; + + &:hover { + animation: bottomUtilsContainerSlideY 0.5s; + } + } + + .child_label { + margin-top: -10px; + font-size: 12px; + width: 80px; + color: rgba(255, 255, 255, 0.8); + } + } } } - .label { - background-size: 100% 100%; - background-repeat: no-repeat; - width: 100px; - height: 30px; - text-align: center; - line-height: 30px; - color: #fff; - font-size: 14px; - } - - .item { - transform-origin: left; - display: flex; - position: absolute; - top: 8px; - left: 40px; - background-image: linear-gradient( - to right, - rgba(31, 62, 129, 0) 0%, - rgba(31, 62, 129, 0.4) 50%, - rgba(31, 62, 129, 0) 100% - ); - border: 1px solid; - border-image: linear-gradient( - to right, - rgba(255, 255, 255, 0) 0%, - rgba(255, 255, 255, 0.4) 50%, - rgba(255, 255, 255, 0) 100% - ) - 1; - border-left: none; - border-right: none; - padding: 6px 50px; - - .items { - padding: 0 20px; - text-align: center; - - .suspension_img { - width: 60px; - height: 60px; - cursor: pointer; - - &:hover { - animation: bottomUtilsContainerSlideY 0.5s; - } - } - - .suspension_label { - margin-top: -10px; - font-size: 12px; - width: 80px; - color: rgba(255, 255, 255, 0.8); - } + @keyframes bottomUtilsContainerSlideY { + 0% { + transform: translateY(0); + } + 50% { + transform: translateY(-5px); + } + 100% { + transform: translateY(0); } } } - @keyframes bottomUtilsContainerSlideY { - 0% { - transform: translateY(0); - } - 50% { - transform: translateY(-5px); - } - 100% { - transform: translateY(0); + &.branch_office { + .option { + position: relative; + cursor: pointer; + width: 124px; + height: 43px; + background-size: 100% 100%; + background-repeat: no-repeat; + text-align: center; + line-height: 43px; + + .label { + font-size: 16px; + font-weight: bold; + color: #fff; + } + + .items { + background-image: linear-gradient(to bottom, rgba(0, 9, 100, 0.5), rgba(1, 35, 145, 0.5)); + border: 1px solid #167ce4; + border-radius: 2px; + position: absolute; + bottom: 50px; + left: 0; + right: 0; + margin: 0 auto; + width: max-content; + padding: 0 9px; + + .item { + padding: 10px 20px; + border: 1px solid transparent; + margin-top: 5px; + + &.active { + background-image: linear-gradient(to bottom, rgb(19, 44, 140), rgba(22, 124, 228, 0)); + border: 1px solid rgba(22, 124, 228, 0.5); + } + + .child_label { + color: #fff; + font-size: 14px; + line-height: normal; + } + } + } } } } diff --git a/src/pages/Container/Map/components/Content/index.js b/src/pages/Container/Map/components/Content/index.js index af59765..fcad377 100644 --- a/src/pages/Container/Map/components/Content/index.js +++ b/src/pages/Container/Map/components/Content/index.js @@ -1,5 +1,4 @@ -import { useMount } from "ahooks"; -import { useContext, useState } from "react"; +import { useContext, useEffect, useState } from "react"; import { CSSTransition, SwitchTransition } from "react-transition-group"; import collapseMenu from "~/assets/images/map_bi/content/collapse_menu.png"; import collapseMenuBg from "~/assets/images/map_bi/content/collapse_menu_bg.png"; @@ -24,14 +23,18 @@ function Content() { const [animationKey, setAnimationKey] = useState(0); const [collapse, setCollapse] = useState(false); - useMount(() => { + useEffect(() => { setAnimationKey(Math.random()); mitt.on(changeContentAnimationKeyMittKey, () => { setAnimationKey(Math.random()); setCollapse(false); }); - }); + + return () => { + mitt.off(changeContentAnimationKeyMittKey); + }; + }, []); const onChangeCollapse = () => { setAnimationKey(Math.random()); @@ -62,7 +65,7 @@ function Content() { const renderContent = () => { if (pureMap || collapse) - return
; + return null; return (
@@ -72,6 +75,22 @@ function Content() { ); }; + const renderCollapseMenu = () => { + if (pureMap) + return null; + if (currentPort) { + return ( +
+ +
+ ); + } + }; + return (
@@ -88,15 +107,7 @@ function Content() { >
{renderContent()} - {(!pureMap && currentPort) && ( -
- -
- )} + {renderCollapseMenu()}
diff --git a/src/pages/Container/Map/components/Content/index.less b/src/pages/Container/Map/components/Content/index.less index 566c7c7..ea63bf8 100644 --- a/src/pages/Container/Map/components/Content/index.less +++ b/src/pages/Container/Map/components/Content/index.less @@ -38,15 +38,13 @@ height: 89px; position: absolute; left: 445px; - top: 50%; - transform: translateY(-50%); + top: calc(50vh - 44.5px); background-repeat: no-repeat; background-size: 100% 100%; cursor: pointer; &.active { left: 0; - top: 50vh; img { transform: translate(-50%, -50%) rotate(180deg); diff --git a/src/pages/Container/Map/components/Header/index.js b/src/pages/Container/Map/components/Header/index.js index b3f6dd9..2906087 100644 --- a/src/pages/Container/Map/components/Header/index.js +++ b/src/pages/Container/Map/components/Header/index.js @@ -1,5 +1,4 @@ -import { useMount } from "ahooks"; -import { useContext, useState } from "react"; +import { useContext, useEffect, useState } from "react"; import { CSSTransition } from "react-transition-group"; import backImg from "~/assets/images/map_bi/back.png"; import guangImg from "~/assets/images/map_bi/guang.png"; @@ -14,7 +13,6 @@ import { clickBranchOfficePointMittKey, clickPortPointMittKey, deletePeoplePositionPointMittKey, - initBottomUtilsMittKey, resetAllBottomUtilsCheckMittKey, resetBottomCurrentIndexMittKey, } from "~/pages/Container/Map/js/mittKey"; @@ -25,9 +23,9 @@ function Header() { const [animationKey, setAnimationKey] = useState(0); - useMount(() => { + useEffect(() => { setAnimationKey(Math.random()); - }); + }, []); const onBack = () => { mitt.emit(deletePeoplePositionPointMittKey); @@ -60,7 +58,6 @@ function Header() { mapMethods.current.addPortPoint(); } mitt.emit(changeBottomUtilsAnimationMittKey); - mitt.emit(initBottomUtilsMittKey); mitt.emit(resetBottomCurrentIndexMittKey); mitt.emit(resetAllBottomUtilsCheckMittKey); mitt.emit(clickBackMittKey); diff --git a/src/pages/Container/Map/components/RightUtils/branchOfficeUtilsList.js b/src/pages/Container/Map/components/RightUtils/branchOfficeUtilsList.js new file mode 100644 index 0000000..78497eb --- /dev/null +++ b/src/pages/Container/Map/components/RightUtils/branchOfficeUtilsList.js @@ -0,0 +1,62 @@ +import backImg from "~/assets/images/map_bi/right_utils/branch_office/ico1.png"; +import fullImg from "~/assets/images/map_bi/right_utils/branch_office/ico2.png"; +import img2Img from "~/assets/images/map_bi/right_utils/branch_office/ico3.png"; +import img4Img from "~/assets/images/map_bi/right_utils/branch_office/ico4.png"; +import delImg from "~/assets/images/map_bi/right_utils/branch_office/ico5.png"; +import mapImg from "~/assets/images/map_bi/right_utils/branch_office/ico6.png"; +import qixiangImg from "~/assets/images/map_bi/right_utils/branch_office/ico7.png"; +import sisetuImg from "~/assets/images/map_bi/right_utils/branch_office/ico8.png"; +import bianjieImg from "~/assets/images/map_bi/right_utils/branch_office/ico9.png"; + +export const branchOfficeUtilsList = [ + { + img: backImg, + label: "返回主系统", + type: "back", + }, + { + img: fullImg, + check: false, + label: "全屏", + type: "full", + }, + { + img: img2Img, + label: "返回中心点", + type: "return", + }, + { + img: img4Img, + check: false, + label: "切换视角", + type: "scene", + }, + { + img: delImg, + label: "删除标记点", + type: "del", + }, + { + img: mapImg, + check: false, + label: "纯净地图", + type: "pureMap", + }, + { + img: qixiangImg, + label: "气象监测", + type: "weather", + }, + { + img: sisetuImg, + check: false, + label: "四色图", + type: "fourColor", + }, + { + img: bianjieImg, + check: false, + label: "边界", + type: "wall", + }, +]; diff --git a/src/pages/Container/Map/components/RightUtils/index.js b/src/pages/Container/Map/components/RightUtils/index.js index 7e8c9e4..7eae40b 100644 --- a/src/pages/Container/Map/components/RightUtils/index.js +++ b/src/pages/Container/Map/components/RightUtils/index.js @@ -1,8 +1,9 @@ -import { useMount } from "ahooks"; import { message } from "antd"; -import { useContext, useEffect, useRef, useState } from "react"; -import { CSSTransition } from "react-transition-group"; -import tooltipImg from "~/assets/images/map_bi/right_utils/tooltip.png"; +import { useContext, useEffect, useState } from "react"; +import { CSSTransition, SwitchTransition } from "react-transition-group"; +import tooltipImg2 from "~/assets/images/map_bi/right_utils/branch_office/bg11.png"; +import buttonBg from "~/assets/images/map_bi/right_utils/branch_office/button.png"; +import tooltipImg1 from "~/assets/images/map_bi/right_utils/port/tooltip.png"; import { Context } from "~/pages/Container/Map/js/context"; import mitt from "~/pages/Container/Map/js/mitt"; import { @@ -10,43 +11,42 @@ import { changeContentAnimationKeyMittKey, changePeopleTrajectorySelectVisibleMittKey, clickBackMittKey, - clickBranchOfficePointMittKey, clickMarkPointMittKey, deletePeoplePositionPointMittKey, + initRightUtilsMittKey, resetAllBottomUtilsCheckMittKey, } from "~/pages/Container/Map/js/mittKey"; -import { utilsList } from "./utilsList"; +import { branchOfficeUtilsList } from "./branchOfficeUtilsList"; +import { portUtilsList } from "./portUtilsList"; import "./index.less"; function RightUtils(props) { - const { currentPort, mapMethods, pureMap } = useContext(Context); + const { currentPort, mapMethods, pureMap, currentBranchOffice } = useContext(Context); - const [list, setList] = useState(utilsList); - const [animationKey, setAnimationKey] = useState(0); + const [list, setList] = useState(portUtilsList); + const [isShowChildLevel, setIsShowChildLevel] = useState(true); - const corpinfoId = useRef(""); + useEffect(() => { + mitt.on(initRightUtilsMittKey, () => { + mapMethods.current?.removeFourColorDiagram(); + mapMethods.current?.removeWall(); + setList(!currentBranchOffice ? portUtilsList : branchOfficeUtilsList); + }); - useMount(() => { - setAnimationKey(Math.random()); + return () => { + mitt.off(initRightUtilsMittKey); + }; + }, [currentBranchOffice]); + useEffect(() => { mitt.on(clickBackMittKey, () => { setList(list.map((item, index) => index === 7 || index === 8 ? { ...item, check: false } : item)); }); - mitt.on(clickBranchOfficePointMittKey, (data) => { - mapMethods.current.removeFourColorDiagram(); - mapMethods.current.removeWall(); - - setList(list.map((item, index) => index === 7 || index === 8 ? { ...item, check: false } : item)); - - corpinfoId.current = data.corpinfoId ?? ""; - }); - return () => { mitt.off(clickBackMittKey); - mitt.off(clickBranchOfficePointMittKey); }; - }); + }, []); useEffect(() => { setList(list.map((item, index) => index === 1 ? { ...item, check: props.isFullscreen } : item)); @@ -54,7 +54,7 @@ function RightUtils(props) { const clickRightTools = (index, type) => { let check; - if (list[index].check !== undefined && list[index].checkImg) { + if (list[index].check !== undefined) { check = !list[index].check; setList(list.map((item, i) => index === i ? { ...item, check: !item.check } : item)); } @@ -97,7 +97,7 @@ function RightUtils(props) { if (check) { mapMethods.current.addFourColorDiagram( currentPort, - corpinfoId.current, + currentBranchOffice, ); } else { @@ -111,40 +111,84 @@ function RightUtils(props) { return; } if (check) - mapMethods.current.addWall(currentPort, corpinfoId.current); + mapMethods.current.addWall(currentPort, currentBranchOffice); else mapMethods.current.removeWall(); break; } }; + const renderPortUtils = () => { + return ( +
+ { + list.map((item, index) => ( +
clickRightTools(index, item.type)} + > +
{item.label}
+ +
+ )) + } +
+ ); + }; + + const renderBranchOfficeUtils = () => { + return ( +
+ +
+ { + list.map((item, index) => ( +
clickRightTools(index, item.type)} + > +
{item.label}
+ +
+ )) + } +
+
+
setIsShowChildLevel(!isShowChildLevel)}> + +
+
+ ); + }; + return (
- -
- { - list.map((item, index) => ( -
clickRightTools(index, item.type)} - > -
{item.label}
- -
- )) - } -
-
+ + + {!currentBranchOffice ? renderPortUtils() : renderBranchOfficeUtils()} + +
); } diff --git a/src/pages/Container/Map/components/RightUtils/index.less b/src/pages/Container/Map/components/RightUtils/index.less index c946d75..87a1404 100644 --- a/src/pages/Container/Map/components/RightUtils/index.less +++ b/src/pages/Container/Map/components/RightUtils/index.less @@ -1,5 +1,22 @@ .right_utils_container { - .right_utils { + + .tooltip() { + transition: 0.5s; + opacity: 0; + width: 100px; + height: 40px; + background-size: 100% 100%; + background-repeat: no-repeat; + color: #fff; + font-size: 12px; + text-align: center; + line-height: 36px; + position: absolute; + right: 20px; + top: 20px; + } + + .right_utils.port { width: 80px; position: absolute; top: 170px; @@ -22,19 +39,7 @@ } .tooltip { - transition: 0.5s; - opacity: 0; - width: 100px; - height: 40px; - background-size: 100% 100%; - background-repeat: no-repeat; - color: #fff; - font-size: 12px; - text-align: center; - line-height: 36px; - position: absolute; - right: 20px; - top: 20px; + .tooltip(); } img { @@ -43,4 +48,67 @@ } } } + + .right_utils.branch_office { + width: 103px; + position: absolute; + bottom: 29px; + right: 36px; + + .bg { + cursor: pointer; + transition: all 0.5s; + transform: rotate(180deg); + + &.active { + transform: rotate(0deg); + } + + img { + width: 101px; + height: 100px; + } + } + + .options { + width: 68px; + background-color: rgba(24, 44, 91, 0.74); + margin: 0 auto 10px; + text-align: center; + border: 1px solid rgba(0, 126, 255, 0.58); + border-radius: 50px 50px 0 0; + + .option { + padding: 15px 0; + cursor: pointer; + border: 1px solid transparent; + position: relative; + + &:first-child { + border-radius: 50px 50px 0 0; + } + + &.active { + border: 1px solid rgb(46, 79, 130); + background-color: rgba(40, 84, 155, 0.459); + } + + &:hover { + .tooltip { + opacity: 1; + right: 80px; + } + } + + img { + width: 35px; + height: 35px; + } + + .tooltip { + .tooltip(); + } + } + } + } } diff --git a/src/pages/Container/Map/components/RightUtils/portUtilsList.js b/src/pages/Container/Map/components/RightUtils/portUtilsList.js new file mode 100644 index 0000000..462f06f --- /dev/null +++ b/src/pages/Container/Map/components/RightUtils/portUtilsList.js @@ -0,0 +1,72 @@ +import backImg from "~/assets/images/map_bi/right_utils/port/back.png"; +import bianjieImg from "~/assets/images/map_bi/right_utils/port/bianjie.png"; +import bianjieOnImg from "~/assets/images/map_bi/right_utils/port/bianjie_on.png"; +import delImg from "~/assets/images/map_bi/right_utils/port/del.png"; +import fullImg from "~/assets/images/map_bi/right_utils/port/full.png"; +import fullOnImg from "~/assets/images/map_bi/right_utils/port/full_on.png"; +import img2Img from "~/assets/images/map_bi/right_utils/port/img2.png"; +import img4Img from "~/assets/images/map_bi/right_utils/port/img4.png"; +import img4OnImg from "~/assets/images/map_bi/right_utils/port/img4_on.png"; +import mapImg from "~/assets/images/map_bi/right_utils/port/map.png"; +import mapOnImg from "~/assets/images/map_bi/right_utils/port/map_on.png"; +import qixiangImg from "~/assets/images/map_bi/right_utils/port/qixiang.png"; +import sisetuImg from "~/assets/images/map_bi/right_utils/port/sisetu.png"; +import sisetuOnImg from "~/assets/images/map_bi/right_utils/port/sisetu_on.png"; + +export const portUtilsList = [ + { + img: backImg, + label: "返回主系统", + type: "back", + }, + { + img: fullImg, + checkImg: fullOnImg, + check: false, + label: "全屏", + type: "full", + }, + { + img: img2Img, + label: "返回中心点", + type: "return", + }, + { + img: img4Img, + checkImg: img4OnImg, + check: false, + label: "切换视角", + type: "scene", + }, + { + img: delImg, + label: "删除标记点", + type: "del", + }, + { + img: mapImg, + checkImg: mapOnImg, + check: false, + label: "纯净地图", + type: "pureMap", + }, + { + img: qixiangImg, + label: "气象监测", + type: "weather", + }, + { + img: sisetuImg, + checkImg: sisetuOnImg, + check: false, + label: "四色图", + type: "fourColor", + }, + { + img: bianjieImg, + checkImg: bianjieOnImg, + check: false, + label: "边界", + type: "wall", + }, +]; diff --git a/src/pages/Container/Map/components/RightUtils/utilsList.js b/src/pages/Container/Map/components/RightUtils/utilsList.js deleted file mode 100644 index 1dc8b15..0000000 --- a/src/pages/Container/Map/components/RightUtils/utilsList.js +++ /dev/null @@ -1,72 +0,0 @@ -import backImg from "~/assets/images/map_bi/right_utils/back.png"; -import bianjieImg from "~/assets/images/map_bi/right_utils/bianjie.png"; -import bianjieOnImg from "~/assets/images/map_bi/right_utils/bianjie_on.png"; -import delImg from "~/assets/images/map_bi/right_utils/del.png"; -import fullImg from "~/assets/images/map_bi/right_utils/full.png"; -import fullOnImg from "~/assets/images/map_bi/right_utils/full_on.png"; -import img2Img from "~/assets/images/map_bi/right_utils/img2.png"; -import img4Img from "~/assets/images/map_bi/right_utils/img4.png"; -import img4OnImg from "~/assets/images/map_bi/right_utils/img4_on.png"; -import mapImg from "~/assets/images/map_bi/right_utils/map.png"; -import mapOnImg from "~/assets/images/map_bi/right_utils/map_on.png"; -import qixiangImg from "~/assets/images/map_bi/right_utils/qixiang.png"; -import sisetuImg from "~/assets/images/map_bi/right_utils/sisetu.png"; -import sisetuOnImg from "~/assets/images/map_bi/right_utils/sisetu_on.png"; - -export const utilsList = [ - { - img: backImg, - label: "返回主系统", - type: "back", - }, - { - img: fullImg, - checkImg: fullOnImg, - check: false, - label: "全屏", - type: "full", - }, - { - img: img2Img, - label: "返回中心点", - type: "return", - }, - { - img: img4Img, - checkImg: img4OnImg, - check: false, - label: "切换视角", - type: "scene", - }, - { - img: delImg, - label: "删除标记点", - type: "del", - }, - { - img: mapImg, - checkImg: mapOnImg, - check: false, - label: "纯净地图", - type: "pureMap", - }, - { - img: qixiangImg, - label: "气象监测", - type: "weather", - }, - { - img: sisetuImg, - checkImg: sisetuOnImg, - check: false, - label: "四色图", - type: "fourColor", - }, - { - img: bianjieImg, - checkImg: bianjieOnImg, - check: false, - label: "边界", - type: "wall", - }, -]; diff --git a/src/pages/Container/Map/index.js b/src/pages/Container/Map/index.js index 74a9a48..b213f69 100644 --- a/src/pages/Container/Map/index.js +++ b/src/pages/Container/Map/index.js @@ -1,7 +1,7 @@ import { useFullscreen, useMount } from "ahooks"; import { message } from "antd"; import autoFit from "autofit.js"; -import { useMemo, useRef, useState } from "react"; +import { useEffect, useMemo, useRef, useState } from "react"; import useGetUrlQuery from "zy-react-library/hooks/useGetUrlQuery"; import BottomUtils from "./components/BottomUtils"; import CenterUtils from "./components/CenterUtils"; @@ -11,7 +11,13 @@ import RightUtils from "./components/RightUtils"; import { Context } from "./js/context"; import InitMap from "./js/initMap"; import mitt from "./js/mitt"; -import { changeCoverMaskVisibleMittKey, clickBranchOfficePointMittKey, clickPortPointMittKey } from "./js/mittKey"; +import { + changeCoverMaskVisibleMittKey, + clickBranchOfficePointMittKey, + clickPortPointMittKey, + initBottomUtilsMittKey, + initRightUtilsMittKey, +} from "./js/mittKey"; import "./index.less"; function Map() { @@ -57,7 +63,7 @@ function Map() { mitt.on(changeCoverMaskVisibleMittKey, (data) => { setCoverMaskVisible(data); if (!data) { - message.success("点位标注完成"); + message.success("地图绘制完成"); } }); @@ -69,6 +75,11 @@ function Map() { }; }); + useEffect(() => { + mitt.emit(initBottomUtilsMittKey); + mitt.emit(initRightUtilsMittKey); + }, [currentBranchOffice]); + const providerValues = useMemo( () => ({ viewer, mapMethods, currentPort, currentBranchOffice, area, bottomUtilsCurrentIndex, pureMap }), [viewer, mapMethods, currentPort, currentBranchOffice, area, bottomUtilsCurrentIndex, pureMap], @@ -89,7 +100,7 @@ function Map() {
message.warning("正在标注点位,请等待标注完成在进行操作")} + onClick={() => message.warning("正在绘制地图,请等待绘制完成在进行操作")} />
); diff --git a/src/pages/Container/Map/js/mapMethods.js b/src/pages/Container/Map/js/mapMethods.js index 3777ed9..58d079c 100644 --- a/src/pages/Container/Map/js/mapMethods.js +++ b/src/pages/Container/Map/js/mapMethods.js @@ -171,7 +171,7 @@ export default class MapMethods { if (!edgeMap[id]) return; - + mitt.emit(changeCoverMaskVisibleMittKey, true); const currentEdge = edgeMap[id](); const entityCollection = createEntityCollection( "fourColorDiagramEntityCollection", @@ -215,6 +215,7 @@ export default class MapMethods { }); this.#viewer.dataSources.add(entityCollection); + mitt.emit(changeCoverMaskVisibleMittKey, false); }; // 删除四色图 @@ -232,6 +233,7 @@ export default class MapMethods { }; if (!edgeMap[id]) return; + mitt.emit(changeCoverMaskVisibleMittKey, true); const currentEdge = edgeMap[id](); const entityCollection = createEntityCollection("wallEntityCollection"); const wallList = currentEdge.wallList; @@ -262,6 +264,7 @@ export default class MapMethods { }); this.#viewer.dataSources.add(entityCollection); + mitt.emit(changeCoverMaskVisibleMittKey, false); }; // 删除墙 diff --git a/src/pages/Container/Map/js/mittKey.js b/src/pages/Container/Map/js/mittKey.js index d2d4f96..1c7c5a5 100644 --- a/src/pages/Container/Map/js/mittKey.js +++ b/src/pages/Container/Map/js/mittKey.js @@ -1,40 +1,28 @@ // 点击港口点位 -export const clickPortPointMittKey = Symbol("clickPortPoint"); +export const clickPortPointMittKey = "clickPortPoint"; // 点击分公司点位 -export const clickBranchOfficePointMittKey = Symbol("clickBranchOfficePoint"); +export const clickBranchOfficePointMittKey = "clickBranchOfficePoint"; // 点击标记点位 -export const clickMarkPointMittKey = Symbol("clickMarkPoint"); +export const clickMarkPointMittKey = "clickMarkPoint"; // 点击左上角返回 -export const clickBackMittKey = Symbol("clickBack"); +export const clickBackMittKey = "clickBack"; // 重新执行底部工具栏动画 -export const changeBottomUtilsAnimationMittKey = Symbol( - "changeBottomUtilsAnimation", -); +export const changeBottomUtilsAnimationMittKey = "changeBottomUtilsAnimation"; // 重置底部工具栏当前索引 -export const resetBottomCurrentIndexMittKey = Symbol( - "resetBottomCurrentIndex", -); +export const resetBottomCurrentIndexMittKey = "resetBottomCurrentIndex"; // 重置所有底部工具栏选中状态 -export const resetAllBottomUtilsCheckMittKey = Symbol( - "resetAllBottomUtilsCheck", -); +export const resetAllBottomUtilsCheckMittKey = "resetAllBottomUtilsCheck"; // 初始化底部工具栏 -export const initBottomUtilsMittKey = Symbol("initBottomUtilsMittKey"); +export const initBottomUtilsMittKey = "initBottomUtils"; // 改变覆盖蒙版显隐 -export const changeCoverMaskVisibleMittKey = Symbol("changeCoverMaskVisible"); +export const changeCoverMaskVisibleMittKey = "changeCoverMaskVisible"; // 改变内容动画显隐 -export const changeContentAnimationKeyMittKey = Symbol( - "changeContentAnimationKey", -); +export const changeContentAnimationKeyMittKey = "changeContentAnimationKey"; // 改变人员轨迹选择窗口显隐 -export const changePeopleTrajectorySelectVisibleMittKey = Symbol( - "changePeopleTrajectorySelectVisible", -); +export const changePeopleTrajectorySelectVisibleMittKey = "changePeopleTrajectorySelectVisible"; // 将人员定位列表提供给人员轨迹选择窗口 -export const providePeoplePositionListMittKey = Symbol( - "providePeoplePositionList", -); +export const providePeoplePositionListMittKey = "providePeoplePositionList"; // 删除人员轨迹点位 -export const deletePeoplePositionPointMittKey = Symbol( - "deletePeoplePositionPoint", -); +export const deletePeoplePositionPointMittKey = "deletePeoplePositionPoint"; +// 初始化右侧工具栏 +export const initRightUtilsMittKey = "initRightUtils"; diff --git a/src/pages/Container/Map/js/pointClickEvent.js b/src/pages/Container/Map/js/pointClickEvent.js index d13e92a..6141a60 100644 --- a/src/pages/Container/Map/js/pointClickEvent.js +++ b/src/pages/Container/Map/js/pointClickEvent.js @@ -10,7 +10,6 @@ import { clickMarkPointMittKey, clickPortPointMittKey, deletePeoplePositionPointMittKey, - initBottomUtilsMittKey, resetAllBottomUtilsCheckMittKey, resetBottomCurrentIndexMittKey, } from "./mittKey"; @@ -85,7 +84,6 @@ export default class PointClickEvent { }, 2000); mitt.emit(clickPortPointMittKey, data); mitt.emit(changeBottomUtilsAnimationMittKey); - mitt.emit(initBottomUtilsMittKey); mitt.emit(resetBottomCurrentIndexMittKey); mitt.emit(resetAllBottomUtilsCheckMittKey); mitt.emit(changeContentAnimationKeyMittKey); @@ -123,7 +121,6 @@ export default class PointClickEvent { mitt.emit(deletePeoplePositionPointMittKey); mitt.emit(clickBranchOfficePointMittKey, data); mitt.emit(changeBottomUtilsAnimationMittKey); - mitt.emit(initBottomUtilsMittKey); mitt.emit(resetBottomCurrentIndexMittKey); mitt.emit(resetAllBottomUtilsCheckMittKey); mitt.emit(changeContentAnimationKeyMittKey);