数据报表添加

babel.config.js

@@ -1,3 +1,6 @@
+// module.exports = {
+//   presets: ["@vue/cli-plugin-babel/preset"],
+// };
 module.exports = {
-  presets: ["@vue/cli-plugin-babel/preset"],
+  plugins: ["@babel/plugin-transform-optional-chaining"],
 };

package.json

@@ -12,18 +12,23 @@
     "core-js": "^3.8.3",
     "echarts": "^5.4.3",
     "element-ui": "^2.15.13",
+    "file-saver": "^2.0.5",
+    "jszip": "^3.10.1",
     "moment": "^2.29.4",
     "postcss-pxtorem": "^6.0.0",
     "swiper": "^10.2.0",
     "vue": "^2.6.14",
     "vue-awesome-swiper": "^5.0.1",
-    "vue-lazyload": "^1.3.3",
+    "vue-clipboard2": "^0.3.3",
+    "vue-lazyload": "^1.2.6",
     "vue-router": "^3.5.1",
+    "vue-touch": "^2.0.0-beta.4",
     "vuex": "^3.6.2"
   },
   "devDependencies": {
     "@babel/core": "^7.12.16",
     "@babel/eslint-parser": "^7.12.16",
+    "@babel/plugin-transform-optional-chaining": "^7.24.1",
     "@vue/cli-plugin-babel": "~5.0.0",
     "@vue/cli-plugin-eslint": "~5.0.0",
     "@vue/cli-plugin-router": "~5.0.0",

public/dd.json

@@ -0,0 +1,589 @@
+{
+  "version": 1.2,
+  "fileVersion": 1.0,
+  "type": 7,
+  "createTime": 20250113163055,
+  "flag": 1,
+  "name": "1",
+  "k": 4096,
+  "m": 1,
+  "channels": [
+    {
+      "n": 6,
+      "crests": [
+        {
+          "name": "H2",
+          "j": 0,
+          "time": 377.0,
+          "startTime": 309.0,
+          "endTime": "NaN",
+          "height": 5685.0,
+          "area": "NaN"
+        },
+        {
+          "name": "CO",
+          "j": 1,
+          "time": 475.0,
+          "startTime": 437.0,
+          "endTime": "NaN",
+          "height": 2287.0,
+          "area": "NaN"
+        },
+        {
+          "name": "CH4",
+          "j": 2,
+          "time": 659.0,
+          "startTime": 601.0,
+          "endTime": "NaN",
+          "height": 3018.0,
+          "area": "NaN"
+        },
+        {
+          "name": "C2H4",
+          "j": 3,
+          "time": 2052.0,
+          "startTime": 1939.0,
+          "endTime": "NaN",
+          "height": 4883.0,
+          "area": "NaN"
+        },
+        {
+          "name": "C2H6",
+          "j": 4,
+          "time": 2576.0,
+          "startTime": 2438.0,
+          "endTime": "NaN",
+          "height": 5909.0,
+          "area": "NaN"
+        },
+        {
+          "name": "C2H2",
+          "j": 5,
+          "time": 2997.0,
+          "startTime": 2863.0,
+          "endTime": "NaN",
+          "height": 1845.0,
+          "area": "NaN"
+        }
+      ],
+      "data": [
+        28689.0, 28689.0, 28689.0, 28688.0, 28687.0, 28686.0, 28685.0, 28685.0,
+        28684.0, 28682.0, 28681.0, 28680.0, 28679.0, 28679.0, 28679.0, 28679.0,
+        28679.0, 28678.0, 28678.0, 28678.0, 28677.0, 28677.0, 28677.0, 28676.0,
+        28676.0, 28676.0, 28675.0, 28675.0, 28674.0, 28673.0, 28672.0, 28671.0,
+        28671.0, 28672.0, 28672.0, 28673.0, 28672.0, 28672.0, 28671.0, 28670.0,
+        28670.0, 28670.0, 28669.0, 28669.0, 28669.0, 28669.0, 28669.0, 28668.0,
+        28667.0, 28666.0, 28665.0, 28666.0, 28666.0, 28667.0, 28667.0, 28667.0,
+        28667.0, 28667.0, 28667.0, 28667.0, 28666.0, 28666.0, 28666.0, 28666.0,
+        28666.0, 28665.0, 28665.0, 28664.0, 28663.0, 28662.0, 28663.0, 28664.0,
+        28664.0, 28665.0, 28665.0, 28665.0, 28665.0, 28665.0, 28664.0, 28664.0,
+        28664.0, 28663.0, 28663.0, 28663.0, 28663.0, 28662.0, 28661.0, 28661.0,
+        28660.0, 28660.0, 28661.0, 28662.0, 28662.0, 28663.0, 28663.0, 28663.0,
+        28663.0, 28663.0, 28663.0, 28663.0, 28663.0, 28663.0, 28663.0, 28663.0,
+        28662.0, 28662.0, 28661.0, 28661.0, 28661.0, 28662.0, 28662.0, 28663.0,
+        28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0,
+        28662.0, 28662.0, 28662.0, 28661.0, 28661.0, 28660.0, 28659.0, 28660.0,
+        28660.0, 28661.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0,
+        28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28661.0,
+        28660.0, 28659.0, 28659.0, 28660.0, 28661.0, 28662.0, 28662.0, 28662.0,
+        28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0, 28662.0,
+        28662.0, 28663.0, 28662.0, 28661.0, 28661.0, 28660.0, 28660.0, 28661.0,
+        28661.0, 28662.0, 28662.0, 28662.0, 28663.0, 28663.0, 28663.0, 28663.0,
+        28663.0, 28663.0, 28663.0, 28663.0, 28663.0, 28662.0, 28661.0, 28661.0,
+        28660.0, 28661.0, 28661.0, 28662.0, 28663.0, 28663.0, 28663.0, 28663.0,
+        28664.0, 28664.0, 28664.0, 28664.0, 28664.0, 28664.0, 28664.0, 28664.0,
+        28663.0, 28663.0, 28662.0, 28662.0, 28662.0, 28663.0, 28663.0, 28664.0,
+        28664.0, 28663.0, 28663.0, 28663.0, 28663.0, 28663.0, 28663.0, 28663.0,
+        28663.0, 28663.0, 28663.0, 28664.0, 28663.0, 28663.0, 28662.0, 28663.0,
+        28663.0, 28664.0, 28665.0, 28665.0, 28665.0, 28665.0, 28665.0, 28665.0,
+        28665.0, 28665.0, 28665.0, 28665.0, 28665.0, 28665.0, 28665.0, 28664.0,
+        28664.0, 28663.0, 28664.0, 28664.0, 28665.0, 28666.0, 28666.0, 28666.0,
+        28666.0, 28666.0, 28666.0, 28667.0, 28667.0, 28667.0, 28667.0, 28667.0,
+        28667.0, 28667.0, 28667.0, 28667.0, 28666.0, 28666.0, 28666.0, 28667.0,
+        28667.0, 28668.0, 28668.0, 28668.0, 28668.0, 28668.0, 28668.0, 28668.0,
+        28668.0, 28669.0, 28669.0, 28669.0, 28670.0, 28669.0, 28668.0, 28668.0,
+        28667.0, 28668.0, 28669.0, 28670.0, 28670.0, 28670.0, 28670.0, 28670.0,
+        28670.0, 28670.0, 28669.0, 28669.0, 28669.0, 28669.0, 28669.0, 28669.0,
+        28669.0, 28668.0, 28668.0, 28668.0, 28668.0, 28669.0, 28670.0, 28671.0,
+        28671.0, 28671.0, 28672.0, 28673.0, 28675.0, 28677.0, 28679.0, 28682.0,
+        28686.0, 28692.0, 28698.0, 28707.0, 28716.0, 28728.0, 28744.0, 28763.0,
+        28788.0, 28818.0, 28854.0, 28897.0, 28949.0, 29009.0, 29080.0, 29163.0,
+        29258.0, 29366.0, 29488.0, 29622.0, 29770.0, 29931.0, 30102.0, 30283.0,
+        30472.0, 30667.0, 30867.0, 31071.0, 31274.0, 31474.0, 31671.0, 31863.0,
+        32048.0, 32225.0, 32395.0, 32555.0, 32707.0, 32849.0, 32982.0, 33106.0,
+        33222.0, 33329.0, 33428.0, 33519.0, 33603.0, 33682.0, 33755.0, 33823.0,
+        33885.0, 33942.0, 33994.0, 34042.0, 34087.0, 34128.0, 34165.0, 34200.0,
+        34230.0, 34258.0, 34283.0, 34305.0, 34324.0, 34339.0, 34350.0, 34357.0,
+        34361.0, 34362.0, 34359.0, 34351.0, 34339.0, 34319.0, 34294.0, 34262.0,
+        34224.0, 34180.0, 34128.0, 34070.0, 34004.0, 33931.0, 33851.0, 33764.0,
+        33670.0, 33569.0, 33461.0, 33348.0, 33231.0, 33110.0, 32985.0, 32857.0,
+        32726.0, 32592.0, 32458.0, 32323.0, 32188.0, 32054.0, 31922.0, 31792.0,
+        31664.0, 31540.0, 31419.0, 31303.0, 31189.0, 31081.0, 30979.0, 30882.0,
+        30791.0, 30706.0, 30627.0, 30553.0, 30485.0, 30423.0, 30368.0, 30321.0,
+        30280.0, 30247.0, 30223.0, 30208.0, 30202.0, 30205.0, 30219.0, 30242.0,
+        30278.0, 30326.0, 30387.0, 30460.0, 30545.0, 30640.0, 30742.0, 30851.0,
+        30966.0, 31085.0, 31205.0, 31327.0, 31448.0, 31566.0, 31680.0, 31790.0,
+        31895.0, 31993.0, 32084.0, 32169.0, 32247.0, 32320.0, 32388.0, 32450.0,
+        32507.0, 32558.0, 32603.0, 32645.0, 32683.0, 32716.0, 32747.0, 32774.0,
+        32799.0, 32821.0, 32841.0, 32858.0, 32873.0, 32886.0, 32896.0, 32905.0,
+        32913.0, 32919.0, 32924.0, 32927.0, 32926.0, 32924.0, 32918.0, 32910.0,
+        32898.0, 32882.0, 32862.0, 32838.0, 32808.0, 32773.0, 32732.0, 32684.0,
+        32629.0, 32567.0, 32497.0, 32421.0, 32338.0, 32250.0, 32155.0, 32054.0,
+        31947.0, 31836.0, 31722.0, 31605.0, 31487.0, 31368.0, 31250.0, 31132.0,
+        31016.0, 30903.0, 30792.0, 30686.0, 30583.0, 30485.0, 30392.0, 30304.0,
+        30222.0, 30145.0, 30073.0, 30004.0, 29940.0, 29880.0, 29825.0, 29773.0,
+        29725.0, 29680.0, 29639.0, 29601.0, 29566.0, 29533.0, 29502.0, 29474.0,
+        29448.0, 29424.0, 29404.0, 29386.0, 29370.0, 29356.0, 29342.0, 29330.0,
+        29318.0, 29307.0, 29296.0, 29285.0, 29273.0, 29261.0, 29247.0, 29233.0,
+        29219.0, 29204.0, 29187.0, 29171.0, 29154.0, 29139.0, 29125.0, 29111.0,
+        29099.0, 29086.0, 29074.0, 29063.0, 29053.0, 29043.0, 29035.0, 29027.0,
+        29019.0, 29012.0, 29006.0, 29000.0, 28994.0, 28988.0, 28981.0, 28976.0,
+        28971.0, 28967.0, 28963.0, 28960.0, 28956.0, 28953.0, 28949.0, 28946.0,
+        28942.0, 28939.0, 28936.0, 28933.0, 28931.0, 28928.0, 28925.0, 28922.0,
+        28919.0, 28916.0, 28913.0, 28911.0, 28909.0, 28909.0, 28908.0, 28907.0,
+        28905.0, 28904.0, 28904.0, 28904.0, 28905.0, 28906.0, 28908.0, 28911.0,
+        28915.0, 28921.0, 28928.0, 28937.0, 28947.0, 28961.0, 28978.0, 28999.0,
+        29025.0, 29055.0, 29089.0, 29128.0, 29173.0, 29223.0, 29279.0, 29341.0,
+        29409.0, 29483.0, 29562.0, 29647.0, 29737.0, 29830.0, 29927.0, 30026.0,
+        30127.0, 30229.0, 30331.0, 30434.0, 30536.0, 30635.0, 30730.0, 30823.0,
+        30911.0, 30996.0, 31077.0, 31153.0, 31226.0, 31293.0, 31356.0, 31415.0,
+        31469.0, 31520.0, 31566.0, 31609.0, 31648.0, 31686.0, 31721.0, 31753.0,
+        31782.0, 31808.0, 31830.0, 31851.0, 31870.0, 31887.0, 31902.0, 31914.0,
+        31924.0, 31931.0, 31936.0, 31939.0, 31938.0, 31935.0, 31928.0, 31917.0,
+        31904.0, 31887.0, 31868.0, 31844.0, 31815.0, 31782.0, 31745.0, 31704.0,
+        31658.0, 31609.0, 31555.0, 31498.0, 31437.0, 31372.0, 31305.0, 31235.0,
+        31163.0, 31089.0, 31014.0, 30939.0, 30864.0, 30789.0, 30714.0, 30640.0,
+        30566.0, 30494.0, 30423.0, 30354.0, 30287.0, 30222.0, 30160.0, 30100.0,
+        30042.0, 29987.0, 29934.0, 29884.0, 29836.0, 29790.0, 29746.0, 29706.0,
+        29669.0, 29634.0, 29601.0, 29570.0, 29540.0, 29513.0, 29487.0, 29462.0,
+        29440.0, 29418.0, 29398.0, 29380.0, 29362.0, 29344.0, 29328.0, 29312.0,
+        29296.0, 29281.0, 29267.0, 29254.0, 29241.0, 29228.0, 29215.0, 29203.0,
+        29190.0, 29177.0, 29165.0, 29153.0, 29141.0, 29129.0, 29118.0, 29108.0,
+        29098.0, 29088.0, 29078.0, 29068.0, 29058.0, 29050.0, 29043.0, 29037.0,
+        29030.0, 29024.0, 29017.0, 29011.0, 29005.0, 28999.0, 28994.0, 28988.0,
+        28983.0, 28978.0, 28974.0, 28970.0, 28965.0, 28961.0, 28956.0, 28952.0,
+        28948.0, 28945.0, 28943.0, 28940.0, 28937.0, 28934.0, 28932.0, 28929.0,
+        28926.0, 28924.0, 28921.0, 28919.0, 28916.0, 28914.0, 28912.0, 28909.0,
+        28907.0, 28904.0, 28901.0, 28898.0, 28897.0, 28896.0, 28895.0, 28894.0,
+        28892.0, 28890.0, 28889.0, 28887.0, 28885.0, 28884.0, 28882.0, 28881.0,
+        28879.0, 28878.0, 28876.0, 28875.0, 28875.0, 28877.0, 28927.0, 29043.0,
+        29225.0, 29469.0, 29726.0, 29970.0, 30195.0, 30398.0, 30580.0, 30742.0,
+        30886.0, 31013.0, 31124.0, 31223.0, 31310.0, 31387.0, 31454.0, 31513.0,
+        31566.0, 31612.0, 31654.0, 31692.0, 31726.0, 31757.0, 31784.0, 31808.0,
+        31830.0, 31850.0, 31868.0, 31884.0, 31899.0, 31913.0, 31926.0, 31937.0,
+        31947.0, 31957.0, 31964.0, 31972.0, 31978.0, 31985.0, 31993.0, 32000.0,
+        32006.0, 32011.0, 32016.0, 32021.0, 32025.0, 32029.0, 32033.0, 32037.0,
+        32040.0, 32043.0, 32046.0, 32049.0, 32052.0, 32054.0, 32056.0, 32057.0,
+        32059.0, 32062.0, 32065.0, 32067.0, 32070.0, 32071.0, 32073.0, 32075.0,
+        32076.0, 32078.0, 32079.0, 32081.0, 32082.0, 32084.0, 32085.0, 32086.0,
+        32087.0, 32088.0, 32088.0, 32089.0, 32091.0, 32092.0, 32094.0, 32095.0,
+        32096.0, 32096.0, 32097.0, 32098.0, 32099.0, 32100.0, 32101.0, 32101.0,
+        32102.0, 32102.0, 32103.0, 32103.0, 32104.0, 32104.0, 32104.0, 32105.0,
+        32106.0, 32107.0, 32108.0, 32108.0, 32108.0, 32109.0, 32109.0, 32110.0,
+        32110.0, 32111.0, 32111.0, 32112.0, 32112.0, 32113.0, 32113.0, 32112.0,
+        32112.0, 32112.0, 32114.0, 32116.0, 32117.0, 32119.0, 32119.0, 32120.0,
+        32120.0, 32121.0, 32121.0, 32121.0, 32122.0, 32122.0, 32123.0, 32123.0,
+        32123.0, 32124.0, 32122.0, 32121.0, 32120.0, 32119.0, 32120.0, 32122.0,
+        32123.0, 32123.0, 32124.0, 32124.0, 32124.0, 32124.0, 32124.0, 32124.0,
+        32125.0, 32125.0, 32125.0, 32126.0, 32126.0, 32125.0, 32125.0, 32125.0,
+        32125.0, 32126.0, 32127.0, 32128.0, 32129.0, 32129.0, 32129.0, 32129.0,
+        32129.0, 32129.0, 32130.0, 32130.0, 32130.0, 32130.0, 32130.0, 32130.0,
+        32130.0, 32129.0, 32129.0, 32129.0, 32130.0, 32131.0, 32132.0, 32132.0,
+        32133.0, 32133.0, 32133.0, 32133.0, 32134.0, 32134.0, 32134.0, 32134.0,
+        32134.0, 32135.0, 32134.0, 32134.0, 32134.0, 32134.0, 32134.0, 32134.0,
+        32135.0, 32136.0, 32137.0, 32138.0, 32138.0, 32138.0, 32139.0, 32139.0,
+        32139.0, 32139.0, 32140.0, 32140.0, 32140.0, 32140.0, 32140.0, 32139.0,
+        32139.0, 32139.0, 32139.0, 32140.0, 32141.0, 32141.0, 32142.0, 32142.0,
+        32142.0, 32143.0, 32143.0, 32144.0, 32144.0, 32144.0, 32144.0, 32145.0,
+        32145.0, 32145.0, 32144.0, 32144.0, 32143.0, 32144.0, 32144.0, 32144.0,
+        32146.0, 32146.0, 32147.0, 32148.0, 32148.0, 32148.0, 32148.0, 32149.0,
+        32149.0, 32149.0, 32149.0, 32149.0, 32149.0, 32149.0, 32148.0, 32148.0,
+        32148.0, 32149.0, 32150.0, 32151.0, 32151.0, 32151.0, 32152.0, 32152.0,
+        32152.0, 32153.0, 32153.0, 32153.0, 32154.0, 32154.0, 32154.0, 32154.0,
+        32154.0, 32153.0, 32152.0, 32152.0, 32153.0, 32154.0, 32155.0, 32155.0,
+        32156.0, 32156.0, 32156.0, 32156.0, 32157.0, 32157.0, 32157.0, 32158.0,
+        32158.0, 32158.0, 32158.0, 32157.0, 32157.0, 32157.0, 32157.0, 32158.0,
+        32158.0, 32159.0, 32160.0, 32160.0, 32160.0, 32161.0, 32161.0, 32161.0,
+        32161.0, 32161.0, 32161.0, 32161.0, 32161.0, 32161.0, 32161.0, 32161.0,
+        32160.0, 32160.0, 32160.0, 32161.0, 32162.0, 32163.0, 32163.0, 32164.0,
+        32164.0, 32164.0, 32164.0, 32165.0, 32165.0, 32165.0, 32166.0, 32166.0,
+        32166.0, 32167.0, 32166.0, 32166.0, 32166.0, 32166.0, 32166.0, 32167.0,
+        32168.0, 32168.0, 32169.0, 32169.0, 32169.0, 32169.0, 32170.0, 32170.0,
+        32170.0, 32170.0, 32170.0, 32170.0, 32170.0, 32170.0, 32170.0, 32169.0,
+        32169.0, 32170.0, 32171.0, 32172.0, 32172.0, 32172.0, 32173.0, 32173.0,
+        32174.0, 32174.0, 32174.0, 32174.0, 32175.0, 32175.0, 32175.0, 32175.0,
+        32175.0, 32175.0, 32174.0, 32174.0, 32175.0, 32176.0, 32176.0, 32177.0,
+        32177.0, 32177.0, 32177.0, 32178.0, 32178.0, 32178.0, 32178.0, 32179.0,
+        32179.0, 32179.0, 32179.0, 32179.0, 32179.0, 32178.0, 32178.0, 32179.0,
+        32179.0, 32180.0, 32181.0, 32181.0, 32182.0, 32182.0, 32183.0, 32183.0,
+        32183.0, 32183.0, 32183.0, 32183.0, 32183.0, 32183.0, 32184.0, 32183.0,
+        32182.0, 32182.0, 32182.0, 32183.0, 32184.0, 32185.0, 32185.0, 32186.0,
+        32186.0, 32186.0, 32186.0, 32187.0, 32187.0, 32187.0, 32188.0, 32188.0,
+        32188.0, 32188.0, 32188.0, 32188.0, 32187.0, 32187.0, 32188.0, 32189.0,
+        32190.0, 32191.0, 32191.0, 32192.0, 32192.0, 32192.0, 32192.0, 32192.0,
+        32192.0, 32193.0, 32193.0, 32193.0, 32193.0, 32192.0, 32192.0, 32191.0,
+        32192.0, 32193.0, 32194.0, 32194.0, 32195.0, 32195.0, 32195.0, 32195.0,
+        32196.0, 32196.0, 32197.0, 32197.0, 32198.0, 32198.0, 32198.0, 32198.0,
+        32197.0, 32196.0, 32196.0, 32195.0, 32196.0, 32197.0, 32199.0, 32199.0,
+        32200.0, 32200.0, 32200.0, 32200.0, 32200.0, 32201.0, 32201.0, 32201.0,
+        32201.0, 32202.0, 32202.0, 32201.0, 32201.0, 32200.0, 32200.0, 32201.0,
+        32201.0, 32202.0, 32203.0, 32203.0, 32203.0, 32204.0, 32204.0, 32204.0,
+        32204.0, 32205.0, 32205.0, 32205.0, 32206.0, 32206.0, 32205.0, 32205.0,
+        32204.0, 32204.0, 32205.0, 32206.0, 32208.0, 32209.0, 32209.0, 32209.0,
+        32209.0, 32209.0, 32210.0, 32210.0, 32210.0, 32210.0, 32210.0, 32211.0,
+        32211.0, 32211.0, 32210.0, 32210.0, 32210.0, 32210.0, 32211.0, 32212.0,
+        32213.0, 32213.0, 32213.0, 32214.0, 32214.0, 32214.0, 32215.0, 32215.0,
+        32215.0, 32215.0, 32216.0, 32216.0, 32216.0, 32216.0, 32215.0, 32214.0,
+        32214.0, 32215.0, 32216.0, 32217.0, 32218.0, 32218.0, 32218.0, 32219.0,
+        32219.0, 32220.0, 32220.0, 32220.0, 32220.0, 32221.0, 32221.0, 32221.0,
+        32221.0, 32221.0, 32221.0, 32221.0, 32222.0, 32223.0, 32224.0, 32225.0,
+        32225.0, 32225.0, 32225.0, 32225.0, 32225.0, 32226.0, 32226.0, 32227.0,
+        32227.0, 32227.0, 32227.0, 32227.0, 32226.0, 32226.0, 32226.0, 32227.0,
+        32227.0, 32228.0, 32229.0, 32229.0, 32230.0, 32230.0, 32230.0, 32230.0,
+        32230.0, 32230.0, 32231.0, 32231.0, 32231.0, 32232.0, 32231.0, 32231.0,
+        32230.0, 32230.0, 32231.0, 32232.0, 32233.0, 32235.0, 32235.0, 32235.0,
+        32236.0, 32236.0, 32236.0, 32236.0, 32236.0, 32236.0, 32236.0, 32236.0,
+        32236.0, 32236.0, 32235.0, 32235.0, 32234.0, 32235.0, 32235.0, 32236.0,
+        32237.0, 32237.0, 32237.0, 32237.0, 32238.0, 32238.0, 32238.0, 32238.0,
+        32239.0, 32239.0, 32239.0, 32239.0, 32239.0, 32238.0, 32238.0, 32238.0,
+        32238.0, 32239.0, 32240.0, 32241.0, 32241.0, 32241.0, 32241.0, 32241.0,
+        32241.0, 32242.0, 32242.0, 32243.0, 32243.0, 32243.0, 32243.0, 32243.0,
+        32242.0, 32242.0, 32241.0, 32242.0, 32242.0, 32243.0, 32244.0, 32244.0,
+        32244.0, 32245.0, 32245.0, 32245.0, 32245.0, 32246.0, 32246.0, 32246.0,
+        32246.0, 32247.0, 32246.0, 32246.0, 32245.0, 32245.0, 32245.0, 32246.0,
+        32247.0, 32248.0, 32249.0, 32249.0, 32249.0, 32250.0, 32250.0, 32250.0,
+        32250.0, 32250.0, 32250.0, 32251.0, 32251.0, 32251.0, 32250.0, 32250.0,
+        32249.0, 32249.0, 32249.0, 32250.0, 32251.0, 32252.0, 32252.0, 32253.0,
+        32253.0, 32253.0, 32253.0, 32254.0, 32254.0, 32254.0, 32254.0, 32254.0,
+        32254.0, 32254.0, 32253.0, 32253.0, 32252.0, 32253.0, 32254.0, 32255.0,
+        32255.0, 32256.0, 32256.0, 32256.0, 32256.0, 32256.0, 32256.0, 32257.0,
+        32257.0, 32257.0, 32257.0, 32257.0, 32257.0, 32257.0, 32256.0, 32256.0,
+        32256.0, 32257.0, 32258.0, 32259.0, 32259.0, 32259.0, 32260.0, 32260.0,
+        32260.0, 32260.0, 32261.0, 32261.0, 32261.0, 32261.0, 32262.0, 32261.0,
+        32261.0, 32260.0, 32260.0, 32260.0, 32261.0, 32262.0, 32262.0, 32263.0,
+        32263.0, 32263.0, 32263.0, 32263.0, 32264.0, 32264.0, 32264.0, 32264.0,
+        32264.0, 32265.0, 32265.0, 32264.0, 32264.0, 32263.0, 32263.0, 32264.0,
+        32265.0, 32266.0, 32266.0, 32267.0, 32267.0, 32267.0, 32267.0, 32267.0,
+        32267.0, 32267.0, 32268.0, 32268.0, 32268.0, 32267.0, 32267.0, 32267.0,
+        32266.0, 32266.0, 32267.0, 32267.0, 32268.0, 32269.0, 32269.0, 32270.0,
+        32270.0, 32270.0, 32271.0, 32271.0, 32271.0, 32271.0, 32271.0, 32271.0,
+        32271.0, 32271.0, 32271.0, 32271.0, 32270.0, 32271.0, 32272.0, 32274.0,
+        32275.0, 32276.0, 32276.0, 32276.0, 32276.0, 32276.0, 32276.0, 32276.0,
+        32276.0, 32276.0, 32277.0, 32277.0, 32276.0, 32276.0, 32275.0, 32274.0,
+        32274.0, 32275.0, 32276.0, 32278.0, 32278.0, 32278.0, 32278.0, 32278.0,
+        32278.0, 32278.0, 32278.0, 32278.0, 32278.0, 32278.0, 32279.0, 32279.0,
+        32278.0, 32278.0, 32277.0, 32277.0, 32278.0, 32279.0, 32279.0, 32280.0,
+        32280.0, 32280.0, 32280.0, 32281.0, 32281.0, 32281.0, 32281.0, 32281.0,
+        32281.0, 32282.0, 32282.0, 32281.0, 32281.0, 32281.0, 32281.0, 32282.0,
+        32283.0, 32283.0, 32284.0, 32284.0, 32284.0, 32285.0, 32285.0, 32285.0,
+        32285.0, 32285.0, 32286.0, 32286.0, 32287.0, 32287.0, 32286.0, 32285.0,
+        32285.0, 32284.0, 32285.0, 32286.0, 32287.0, 32288.0, 32288.0, 32288.0,
+        32288.0, 32289.0, 32289.0, 32290.0, 32290.0, 32290.0, 32290.0, 32290.0,
+        32290.0, 32290.0, 32290.0, 32290.0, 32290.0, 32290.0, 32291.0, 32291.0,
+        32292.0, 32292.0, 32292.0, 32292.0, 32292.0, 32293.0, 32293.0, 32293.0,
+        32293.0, 32294.0, 32294.0, 32295.0, 32294.0, 32294.0, 32293.0, 32292.0,
+        32292.0, 32293.0, 32294.0, 32295.0, 32296.0, 32296.0, 32296.0, 32296.0,
+        32296.0, 32296.0, 32297.0, 32297.0, 32298.0, 32298.0, 32298.0, 32298.0,
+        32297.0, 32296.0, 32296.0, 32296.0, 32297.0, 32298.0, 32299.0, 32299.0,
+        32299.0, 32300.0, 32300.0, 32300.0, 32300.0, 32300.0, 32300.0, 32300.0,
+        32301.0, 32301.0, 32301.0, 32300.0, 32300.0, 32299.0, 32299.0, 32300.0,
+        32301.0, 32302.0, 32303.0, 32303.0, 32304.0, 32304.0, 32304.0, 32305.0,
+        32305.0, 32305.0, 32305.0, 32305.0, 32305.0, 32305.0, 32304.0, 32304.0,
+        32303.0, 32303.0, 32304.0, 32304.0, 32305.0, 32306.0, 32306.0, 32306.0,
+        32307.0, 32307.0, 32307.0, 32307.0, 32306.0, 32291.0, 32238.0, 32137.0,
+        31982.0, 31786.0, 31572.0, 31357.0, 31150.0, 30957.0, 30781.0, 30620.0,
+        30476.0, 30346.0, 30231.0, 30128.0, 30037.0, 29956.0, 29884.0, 29819.0,
+        29762.0, 29710.0, 29664.0, 29623.0, 29586.0, 29550.0, 29518.0, 29490.0,
+        29465.0, 29443.0, 29424.0, 29405.0, 29387.0, 29370.0, 29355.0, 29341.0,
+        29327.0, 29315.0, 29304.0, 29293.0, 29283.0, 29273.0, 29264.0, 29255.0,
+        29246.0, 29238.0, 29230.0, 29224.0, 29218.0, 29214.0, 29209.0, 29204.0,
+        29198.0, 29193.0, 29188.0, 29184.0, 29179.0, 29175.0, 29171.0, 29168.0,
+        29164.0, 29160.0, 29156.0, 29152.0, 29148.0, 29144.0, 29141.0, 29139.0,
+        29138.0, 29136.0, 29133.0, 29130.0, 29128.0, 29125.0, 29123.0, 29121.0,
+        29119.0, 29117.0, 29115.0, 29113.0, 29111.0, 29109.0, 29106.0, 29104.0,
+        29102.0, 29100.0, 29099.0, 29100.0, 29099.0, 29098.0, 29096.0, 29095.0,
+        29093.0, 29092.0, 29091.0, 29090.0, 29089.0, 29088.0, 29087.0, 29086.0,
+        29085.0, 29083.0, 29081.0, 29079.0, 29078.0, 29077.0, 29077.0, 29078.0,
+        29077.0, 29077.0, 29076.0, 29075.0, 29074.0, 29073.0, 29073.0, 29072.0,
+        29071.0, 29071.0, 29070.0, 29069.0, 29068.0, 29067.0, 29066.0, 29065.0,
+        29064.0, 29065.0, 29065.0, 29065.0, 29065.0, 29065.0, 29064.0, 29064.0,
+        29063.0, 29063.0, 29063.0, 29063.0, 29062.0, 29062.0, 29062.0, 29061.0,
+        29061.0, 29060.0, 29060.0, 29061.0, 29062.0, 29063.0, 29065.0, 29066.0,
+        29067.0, 29068.0, 29070.0, 29071.0, 29073.0, 29075.0, 29077.0, 29080.0,
+        29083.0, 29086.0, 29089.0, 29093.0, 29096.0, 29100.0, 29106.0, 29112.0,
+        29120.0, 29128.0, 29137.0, 29146.0, 29155.0, 29165.0, 29177.0, 29189.0,
+        29202.0, 29216.0, 29232.0, 29248.0, 29266.0, 29285.0, 29305.0, 29327.0,
+        29349.0, 29374.0, 29401.0, 29431.0, 29462.0, 29495.0, 29529.0, 29565.0,
+        29602.0, 29642.0, 29684.0, 29728.0, 29774.0, 29822.0, 29873.0, 29926.0,
+        29980.0, 30036.0, 30094.0, 30153.0, 30215.0, 30280.0, 30347.0, 30416.0,
+        30487.0, 30558.0, 30631.0, 30706.0, 30782.0, 30859.0, 30937.0, 31016.0,
+        31097.0, 31178.0, 31260.0, 31343.0, 31425.0, 31508.0, 31590.0, 31673.0,
+        31756.0, 31840.0, 31924.0, 32007.0, 32089.0, 32170.0, 32250.0, 32330.0,
+        32408.0, 32485.0, 32561.0, 32636.0, 32709.0, 32781.0, 32851.0, 32919.0,
+        32985.0, 33049.0, 33112.0, 33172.0, 33232.0, 33290.0, 33345.0, 33399.0,
+        33449.0, 33497.0, 33543.0, 33586.0, 33628.0, 33667.0, 33703.0, 33737.0,
+        33768.0, 33797.0, 33824.0, 33847.0, 33868.0, 33886.0, 33903.0, 33918.0,
+        33930.0, 33940.0, 33948.0, 33952.0, 33954.0, 33954.0, 33950.0, 33945.0,
+        33937.0, 33926.0, 33913.0, 33898.0, 33881.0, 33861.0, 33839.0, 33814.0,
+        33787.0, 33758.0, 33727.0, 33695.0, 33661.0, 33624.0, 33586.0, 33545.0,
+        33502.0, 33458.0, 33411.0, 33363.0, 33313.0, 33262.0, 33209.0, 33154.0,
+        33099.0, 33041.0, 32982.0, 32921.0, 32860.0, 32798.0, 32737.0, 32674.0,
+        32610.0, 32545.0, 32478.0, 32412.0, 32345.0, 32278.0, 32210.0, 32142.0,
+        32074.0, 32006.0, 31938.0, 31870.0, 31802.0, 31733.0, 31665.0, 31598.0,
+        31531.0, 31466.0, 31402.0, 31338.0, 31274.0, 31211.0, 31149.0, 31088.0,
+        31028.0, 30969.0, 30911.0, 30854.0, 30798.0, 30743.0, 30690.0, 30638.0,
+        30586.0, 30535.0, 30486.0, 30438.0, 30393.0, 30349.0, 30306.0, 30264.0,
+        30224.0, 30184.0, 30146.0, 30109.0, 30074.0, 30039.0, 30006.0, 29973.0,
+        29942.0, 29912.0, 29883.0, 29854.0, 29826.0, 29800.0, 29775.0, 29752.0,
+        29730.0, 29708.0, 29687.0, 29667.0, 29647.0, 29629.0, 29611.0, 29594.0,
+        29577.0, 29561.0, 29546.0, 29531.0, 29517.0, 29503.0, 29489.0, 29476.0,
+        29463.0, 29451.0, 29441.0, 29431.0, 29422.0, 29412.0, 29403.0, 29394.0,
+        29385.0, 29377.0, 29369.0, 29362.0, 29354.0, 29347.0, 29340.0, 29333.0,
+        29326.0, 29320.0, 29313.0, 29307.0, 29301.0, 29296.0, 29291.0, 29287.0,
+        29282.0, 29278.0, 29273.0, 29269.0, 29265.0, 29261.0, 29257.0, 29253.0,
+        29249.0, 29245.0, 29242.0, 29239.0, 29235.0, 29231.0, 29227.0, 29223.0,
+        29221.0, 29219.0, 29216.0, 29214.0, 29211.0, 29209.0, 29206.0, 29204.0,
+        29201.0, 29199.0, 29197.0, 29195.0, 29192.0, 29190.0, 29188.0, 29186.0,
+        29183.0, 29181.0, 29179.0, 29177.0, 29176.0, 29175.0, 29173.0, 29171.0,
+        29169.0, 29168.0, 29166.0, 29165.0, 29163.0, 29162.0, 29160.0, 29159.0,
+        29157.0, 29156.0, 29154.0, 29152.0, 29150.0, 29148.0, 29147.0, 29146.0,
+        29146.0, 29145.0, 29144.0, 29142.0, 29141.0, 29139.0, 29139.0, 29138.0,
+        29137.0, 29136.0, 29135.0, 29134.0, 29133.0, 29131.0, 29129.0, 29127.0,
+        29126.0, 29125.0, 29124.0, 29125.0, 29124.0, 29124.0, 29123.0, 29121.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29119.0, 29119.0, 29118.0, 29117.0, 29116.0, 29115.0,
+        29115.0, 29113.0, 29112.0, 29110.0, 29109.0, 29109.0, 29109.0, 29109.0,
+        29109.0, 29108.0, 29108.0, 29107.0, 29106.0, 29106.0, 29105.0, 29104.0,
+        29103.0, 29103.0, 29102.0, 29101.0, 29100.0, 29099.0, 29096.0, 29095.0,
+        29094.0, 29094.0, 29094.0, 29094.0, 29094.0, 29093.0, 29093.0, 29092.0,
+        29091.0, 29091.0, 29090.0, 29089.0, 29089.0, 29088.0, 29088.0, 29087.0,
+        29085.0, 29084.0, 29083.0, 29082.0, 29083.0, 29083.0, 29084.0, 29084.0,
+        29083.0, 29083.0, 29082.0, 29082.0, 29082.0, 29081.0, 29081.0, 29080.0,
+        29081.0, 29081.0, 29081.0, 29081.0, 29080.0, 29080.0, 29081.0, 29082.0,
+        29083.0, 29085.0, 29085.0, 29086.0, 29088.0, 29089.0, 29091.0, 29092.0,
+        29094.0, 29096.0, 29099.0, 29101.0, 29104.0, 29107.0, 29109.0, 29113.0,
+        29117.0, 29121.0, 29127.0, 29133.0, 29140.0, 29147.0, 29153.0, 29161.0,
+        29169.0, 29177.0, 29187.0, 29197.0, 29208.0, 29220.0, 29232.0, 29245.0,
+        29259.0, 29274.0, 29289.0, 29306.0, 29324.0, 29344.0, 29366.0, 29389.0,
+        29412.0, 29437.0, 29462.0, 29489.0, 29518.0, 29548.0, 29580.0, 29613.0,
+        29647.0, 29684.0, 29722.0, 29762.0, 29803.0, 29846.0, 29890.0, 29937.0,
+        29986.0, 30038.0, 30091.0, 30147.0, 30203.0, 30260.0, 30320.0, 30381.0,
+        30444.0, 30509.0, 30576.0, 30644.0, 30713.0, 30784.0, 30856.0, 30929.0,
+        31004.0, 31079.0, 31156.0, 31235.0, 31315.0, 31396.0, 31478.0, 31559.0,
+        31641.0, 31724.0, 31807.0, 31889.0, 31972.0, 32056.0, 32140.0, 32223.0,
+        32307.0, 32389.0, 32472.0, 32553.0, 32633.0, 32713.0, 32793.0, 32873.0,
+        32953.0, 33031.0, 33108.0, 33184.0, 33259.0, 33333.0, 33405.0, 33477.0,
+        33546.0, 33615.0, 33683.0, 33748.0, 33813.0, 33875.0, 33936.0, 33995.0,
+        34052.0, 34109.0, 34165.0, 34220.0, 34273.0, 34323.0, 34371.0, 34418.0,
+        34462.0, 34506.0, 34547.0, 34588.0, 34626.0, 34662.0, 34696.0, 34728.0,
+        34759.0, 34787.0, 34813.0, 34837.0, 34860.0, 34883.0, 34903.0, 34921.0,
+        34938.0, 34952.0, 34965.0, 34976.0, 34984.0, 34991.0, 34996.0, 34999.0,
+        35000.0, 35000.0, 34998.0, 34994.0, 34988.0, 34979.0, 34969.0, 34958.0,
+        34945.0, 34932.0, 34917.0, 34899.0, 34880.0, 34859.0, 34836.0, 34811.0,
+        34785.0, 34758.0, 34729.0, 34698.0, 34666.0, 34633.0, 34597.0, 34561.0,
+        34522.0, 34481.0, 34440.0, 34398.0, 34356.0, 34312.0, 34267.0, 34219.0,
+        34170.0, 34121.0, 34070.0, 34018.0, 33965.0, 33911.0, 33857.0, 33801.0,
+        33744.0, 33687.0, 33628.0, 33568.0, 33507.0, 33446.0, 33385.0, 33324.0,
+        33262.0, 33200.0, 33137.0, 33073.0, 33009.0, 32945.0, 32880.0, 32815.0,
+        32750.0, 32685.0, 32619.0, 32555.0, 32489.0, 32424.0, 32358.0, 32292.0,
+        32226.0, 32162.0, 32098.0, 32035.0, 31972.0, 31909.0, 31846.0, 31784.0,
+        31723.0, 31662.0, 31602.0, 31542.0, 31483.0, 31425.0, 31367.0, 31311.0,
+        31255.0, 31199.0, 31144.0, 31089.0, 31036.0, 30984.0, 30934.0, 30885.0,
+        30837.0, 30789.0, 30742.0, 30695.0, 30650.0, 30606.0, 30563.0, 30520.0,
+        30479.0, 30438.0, 30399.0, 30360.0, 30323.0, 30285.0, 30249.0, 30214.0,
+        30181.0, 30149.0, 30118.0, 30087.0, 30057.0, 30028.0, 29999.0, 29972.0,
+        29945.0, 29919.0, 29893.0, 29869.0, 29845.0, 29822.0, 29800.0, 29778.0,
+        29756.0, 29735.0, 29714.0, 29696.0, 29678.0, 29661.0, 29644.0, 29628.0,
+        29612.0, 29596.0, 29581.0, 29566.0, 29552.0, 29538.0, 29524.0, 29512.0,
+        29499.0, 29487.0, 29475.0, 29463.0, 29451.0, 29439.0, 29429.0, 29419.0,
+        29410.0, 29401.0, 29393.0, 29384.0, 29375.0, 29367.0, 29358.0, 29351.0,
+        29343.0, 29335.0, 29328.0, 29321.0, 29314.0, 29307.0, 29300.0, 29292.0,
+        29285.0, 29279.0, 29274.0, 29269.0, 29264.0, 29259.0, 29254.0, 29248.0,
+        29243.0, 29238.0, 29233.0, 29228.0, 29223.0, 29219.0, 29214.0, 29210.0,
+        29205.0, 29200.0, 29195.0, 29191.0, 29186.0, 29183.0, 29181.0, 29178.0,
+        29175.0, 29171.0, 29167.0, 29164.0, 29160.0, 29157.0, 29153.0, 29150.0,
+        29147.0, 29143.0, 29141.0, 29138.0, 29134.0, 29131.0, 29127.0, 29124.0,
+        29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0,
+        29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0,
+        29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0,
+        29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0,
+        29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0, 29122.0,
+        29122.0, 29122.0, 29121.0, 29120.0, 29119.0, 29118.0, 29117.0, 29116.0,
+        29115.0, 29114.0, 29113.0, 29112.0, 29112.0, 29111.0, 29109.0, 29108.0,
+        29107.0, 29106.0, 29106.0, 29106.0, 29106.0, 29106.0, 29106.0, 29105.0,
+        29105.0, 29104.0, 29104.0, 29104.0, 29104.0, 29103.0, 29103.0, 29103.0,
+        29103.0, 29102.0, 29102.0, 29101.0, 29101.0, 29102.0, 29103.0, 29104.0,
+        29105.0, 29105.0, 29106.0, 29107.0, 29107.0, 29108.0, 29110.0, 29111.0,
+        29112.0, 29113.0, 29114.0, 29116.0, 29117.0, 29118.0, 29119.0, 29121.0,
+        29124.0, 29127.0, 29130.0, 29134.0, 29137.0, 29140.0, 29143.0, 29147.0,
+        29151.0, 29155.0, 29159.0, 29164.0, 29169.0, 29174.0, 29179.0, 29185.0,
+        29191.0, 29196.0, 29203.0, 29210.0, 29218.0, 29227.0, 29235.0, 29244.0,
+        29253.0, 29262.0, 29271.0, 29281.0, 29291.0, 29302.0, 29313.0, 29324.0,
+        29336.0, 29349.0, 29362.0, 29374.0, 29387.0, 29401.0, 29415.0, 29431.0,
+        29448.0, 29464.0, 29481.0, 29498.0, 29515.0, 29532.0, 29550.0, 29568.0,
+        29587.0, 29606.0, 29626.0, 29645.0, 29666.0, 29687.0, 29707.0, 29728.0,
+        29749.0, 29771.0, 29794.0, 29817.0, 29841.0, 29864.0, 29888.0, 29911.0,
+        29935.0, 29960.0, 29984.0, 30008.0, 30033.0, 30057.0, 30081.0, 30106.0,
+        30131.0, 30155.0, 30179.0, 30202.0, 30227.0, 30252.0, 30277.0, 30302.0,
+        30326.0, 30350.0, 30373.0, 30397.0, 30421.0, 30444.0, 30466.0, 30489.0,
+        30510.0, 30532.0, 30553.0, 30574.0, 30594.0, 30613.0, 30632.0, 30651.0,
+        30670.0, 30689.0, 30708.0, 30726.0, 30743.0, 30759.0, 30774.0, 30789.0,
+        30803.0, 30816.0, 30830.0, 30842.0, 30854.0, 30865.0, 30876.0, 30885.0,
+        30894.0, 30902.0, 30910.0, 30918.0, 30925.0, 30932.0, 30938.0, 30943.0,
+        30947.0, 30950.0, 30953.0, 30955.0, 30956.0, 30956.0, 30956.0, 30955.0,
+        30953.0, 30951.0, 30948.0, 30943.0, 30938.0, 30932.0, 30926.0, 30922.0,
+        30916.0, 30909.0, 30901.0, 30892.0, 30883.0, 30873.0, 30863.0, 30852.0,
+        30840.0, 30828.0, 30816.0, 30803.0, 30789.0, 30775.0, 30759.0, 30743.0,
+        30727.0, 30711.0, 30695.0, 30680.0, 30663.0, 30646.0, 30628.0, 30610.0,
+        30591.0, 30572.0, 30553.0, 30534.0, 30514.0, 30494.0, 30474.0, 30454.0,
+        30434.0, 30413.0, 30391.0, 30370.0, 30349.0, 30328.0, 30308.0, 30288.0,
+        30268.0, 30247.0, 30226.0, 30205.0, 30183.0, 30162.0, 30141.0, 30120.0,
+        30099.0, 30079.0, 30058.0, 30038.0, 30017.0, 29996.0, 29975.0, 29955.0,
+        29935.0, 29917.0, 29898.0, 29880.0, 29861.0, 29843.0, 29824.0, 29806.0,
+        29789.0, 29772.0, 29755.0, 29738.0, 29721.0, 29705.0, 29689.0, 29672.0,
+        29656.0, 29640.0, 29624.0, 29610.0, 29597.0, 29583.0, 29570.0, 29557.0,
+        29544.0, 29531.0, 29519.0, 29507.0, 29495.0, 29483.0, 29472.0, 29461.0,
+        29451.0, 29440.0, 29430.0, 29419.0, 29409.0, 29399.0, 29390.0, 29382.0,
+        29375.0, 29367.0, 29359.0, 29352.0, 29344.0, 29337.0, 29329.0, 29322.0,
+        29316.0, 29309.0, 29302.0, 29297.0, 29291.0, 29285.0, 29280.0, 29273.0,
+        29267.0, 29262.0, 29258.0, 29255.0, 29251.0, 29247.0, 29243.0, 29239.0,
+        29235.0, 29231.0, 29228.0, 29224.0, 29221.0, 29218.0, 29214.0, 29211.0,
+        29208.0, 29204.0, 29200.0, 29196.0, 29193.0, 29192.0, 29191.0, 29190.0,
+        29188.0, 29185.0, 29183.0, 29181.0, 29179.0, 29178.0, 29176.0, 29174.0,
+        29173.0, 29171.0, 29169.0, 29168.0, 29166.0, 29163.0, 29161.0, 29160.0,
+        29159.0, 29159.0, 29158.0, 29157.0, 29156.0, 29155.0, 29154.0, 29153.0,
+        29152.0, 29151.0, 29150.0, 29149.0, 29148.0, 29147.0, 29146.0, 29145.0,
+        29143.0, 29142.0, 29141.0, 29140.0, 29141.0, 29141.0, 29140.0, 29140.0,
+        29139.0, 29139.0, 29138.0, 29137.0, 29137.0, 29136.0, 29136.0, 29136.0,
+        29135.0, 29135.0, 29134.0, 29133.0, 29132.0, 29130.0, 29130.0, 29130.0,
+        29130.0, 29130.0, 29131.0, 29130.0, 29130.0, 29129.0, 29129.0, 29128.0,
+        29128.0, 29127.0, 29127.0, 29127.0, 29127.0, 29126.0, 29125.0, 29124.0,
+        29123.0, 29123.0, 29123.0, 29124.0, 29124.0, 29124.0, 29124.0, 29124.0,
+        29124.0, 29124.0, 29123.0, 29123.0, 29123.0, 29123.0, 29123.0, 29123.0,
+        29122.0, 29121.0, 29120.0, 29119.0, 29119.0, 29120.0, 29120.0, 29121.0,
+        29121.0, 29121.0, 29121.0, 29121.0, 29121.0, 29121.0, 29121.0, 29121.0,
+        29121.0, 29120.0, 29120.0, 29119.0, 29119.0, 29118.0, 29118.0, 29118.0,
+        29118.0, 29118.0, 29119.0, 29119.0, 29119.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0,
+        29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0, 29120.0
+      ]
+    }
+  ],
+  "yunit": 48,
+  "xinterval": 1.0,
+  "xunit": 49,
+  "ymax": 35000.0
+}

public/index.html

@@ -1,15 +1,19 @@
 <!DOCTYPE html>
 <html lang="">
   <head>
-    <meta charset="utf-8">
-    <meta http-equiv="X-UA-Compatible" content="IE=edge">
-    <meta name="viewport" content="width=device-width,initial-scale=1.0">
-    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-    <title><%= htmlWebpackPlugin.options.title %></title>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
+    <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
+
+    <title>视频监控可视化平台</title>
   </head>
   <body>
     <noscript>
-      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
+      <strong
+        >We're sorry but 视频监控可视化平台 doesn't work properly without
+        JavaScript enabled. Please enable it to continue.</strong
+      >
     </noscript>
     <div id="app"></div>
     <!-- built files will be auto injected -->

src/App.vue

@@ -1,10 +1,119 @@
 <template>
-  <div id="app">
-    <router-view />
+  <div id="app" :class="mobelH == 1 ? 'zoomclass' : ''">
+    <router-view></router-view>
   </div>
 </template>
 
+<script>
+import { mapActions } from "vuex";
+
+export default {
+  name: "App",
+  data() {
+    return { mobelH: 0 };
+  },
+  mounted() {
+    this.isMobile2();
+    let goUrl = this.isMobile();
+
+    if (goUrl === 1) {
+      this.$confirm(
+        "您正在使用手机访问本站，可能无法获得最佳浏览体验， 即将跳转到手机端...",
+        "提示",
+        {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+          customClass: "phonemesBox",
+        }
+      )
+        .then(() => {
+          // this.$message({
+          //   type: "success",
+          //   message: "删除成功!",
+          // });
+          //移动端地址
+          location = "http://61.169.135.146:40080/phone/#/login";
+        })
+        .catch(() => {
+          // this.$message({
+          //   type: "info",
+          //   message: "已取消删除",
+          // });
+        });
+    }
+  },
+  methods: {
+    ...mapActions("cache", ["addCache", "removeCache"]),
+    // 收集缓存（通过监听）
+    collectCaches() {
+      // 收集当前路由相关的缓存
+      this.$route.matched.forEach((routeMatch) => {
+        const instance = routeMatch.components?.default;
+        const componentName = instance?.name;
+        console.log(componentName);
+        if (process.env.NODE_ENV === "development") {
+          this.checkRouteComponentName(componentName, instance?.__file);
+        }
+        // 配置了meta.keepAlive的路由组件添加到缓存
+        if (routeMatch.meta.keepAlive) {
+          if (!componentName) {
+            console.warn(`${routeMatch.path} 路由的组件名称name为空`);
+            return;
+          }
+          this.addCache(componentName);
+        } else {
+          this.removeCache(componentName);
+        }
+      });
+    },
+    // 检测路由组件名称是否重复（组件重名会缓存到不该缓存的组件，而且不容易排查问题，所以开发环境时检测重名）
+    checkRouteComponentName(name, file) {
+      if (!this.cmpNames) this.cmpNames = {};
+      if (this.cmpNames[name]) {
+        if (this.cmpNames[name] !== file) {
+          console.warn(
+            `${file} 与${this.cmpNames[name]} 组件名称重复： ${name}`
+          );
+        }
+      } else {
+        this.cmpNames[name] = file;
+      }
+    },
+    isMobile() {
+      let flag = navigator.userAgent.match(
+        /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
+      );
+      // localStorage.setItem('isiphone',flag)
+      localStorage.setItem("ismobile", flag ? 1 : 0);
+      let goUrl = flag ? 1 : 0;
+      return goUrl;
+    },
+    isMobile2() {
+      let flag = navigator.userAgent.match(
+        /(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i
+      );
+      // localStorage.setItem('isiphone',flag)
+      this.mobelH = flag ? 1 : 0;
+    },
+  },
+  watch: {
+    "$route.path": {
+      immediate: true,
+      handler() {
+        this.collectCaches();
+      },
+    },
+  },
+};
+</script>
+
 <style lang="less">
-#app {
+.phonemesBox {
+  width: 80% !important;
+  max-width: 450px;
+}
+.zoomclass {
+  zoom: 0.6;
 }
 </style>

src/Permission.vue

@@ -0,0 +1,60 @@
+<template>
+  <div class="error-page">
+    <div class="error-code">4<span>0</span>3</div>
+    <div class="error-desc">啊哦~ 你没有权限访问该页面哦</div>
+    <div class="error-handle">
+      <router-link to="/stritl">
+        <el-button type="primary" size="large">返回首页</el-button>
+      </router-link>
+      <el-button class="error-btn" type="primary" size="large" @click="goBack"
+        >返回上一页</el-button
+      >
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  methods: {
+    goBack() {
+      this.$router.go(-1);
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.error-page {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  background: #f3f3f3;
+  box-sizing: border-box;
+  .error-code {
+    line-height: 1;
+    font-size: 250px;
+    font-weight: bolder;
+    color: #f02d2d;
+  }
+  .error-code span {
+    color: #00a854;
+  }
+  .error-desc {
+    font-size: 30px;
+    color: #777;
+  }
+  .error-handle {
+    margin-top: 30px;
+    padding-bottom: 200px;
+  }
+  .el-button--primary {
+    width: auto !important;
+  }
+  .error-btn {
+    margin-left: 100px;
+  }
+}
+</style>

src/assets/css/element.less

@@ -78,3 +78,6 @@
 .el-image-viewer__actions {
   background: rgba(0, 0, 0, 0.15);
 }
+.el-form-item__label{
+  padding: 0 6px 0 0;
+}

src/assets/css/global.less

@@ -1,5 +1,5 @@
 //Brand @color
-@color-primary: #169e8c;
+@color-primary: #1c77ac;
 @color-primary-light: mix(@color-white, @color-primary, 80%);
 @color-primary-lighter: mix(@color-white, @color-primary, 90%);
 //Functional @color

src/assets/css/reset.css

@@ -2,7 +2,12 @@
   margin: 0;
   padding: 0;
 }
-
+img {
+  -webkit-user-select: none; /* Safari 3.1+ */
+  -moz-user-select: none; /* Firefox 2+ */
+  -ms-user-select: none; /* IE 10+ */
+  user-select: none; /* Standard syntax */
+}
 html,
 body,
 #app,
@@ -30,18 +35,22 @@ a {
 /* 整个滚动条 */
 ::-webkit-scrollbar {
   width: 8px;
-  height: 8px;
 }
 
 /* 滚动条上的滚动滑块 */
 ::-webkit-scrollbar-thumb {
   background-color: #ccc;
   /* 关键代码 */
-  border-radius: 32px;
+  border-radius: 2px;
 }
 
 /* 滚动条轨道 */
 ::-webkit-scrollbar-track {
   background-color: #f0f0f0;
-  border-radius: 32px;
+  border-radius: 2px;
+}
+.el-table__fixed,
+.el-table__fixed-right {
+  height: auto !important;
+  bottom: 15px !important;
 }

src/assets/fonts - 副本/iconfont.css

@@ -0,0 +1,61 @@
+@font-face {
+  font-family: "iconfont"; /* Project id  */
+  src: url('iconfont.ttf?t=1690188947515') format('truetype');
+}
+
+.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-paizhao:before {
+  content: "\e6ba";
+}
+
+.icon-paizhao-xianxing:before {
+  content: "\e8d1";
+}
+
+.icon-tuiguanglishitupianjinqun:before {
+  content: "\e613";
+}
+
+.icon-gongsi:before {
+  content: "\e62e";
+}
+
+.icon-dianli:before {
+  content: "\e649";
+}
+
+.icon-dianlihangye:before {
+  content: "\e791";
+}
+
+.icon-shexiangtoulixian:before {
+  content: "\e7b2";
+}
+
+.icon-video-camera:before {
+  content: "\e962";
+}
+
+.icon-shexiangtou-lixian:before {
+  content: "\ef1c";
+}
+
+.icon-shexiangtou-zaixian:before {
+  content: "\ef1d";
+}
+
+.icon-shudianxianlu_2722010801:before {
+  content: "\efed";
+}
+
+.icon-tupian_normal:before {
+  content: "\e681";
+}
+

src/assets/fonts/iconfont.css

@@ -1,6 +1,6 @@
 @font-face {
   font-family: "iconfont"; /* Project id  */
-  src: url('iconfont.ttf?t=1690188947515') format('truetype');
+  src: url('iconfont.ttf?t=1709789909096') format('truetype');
 }
 
 .iconfont {
@@ -11,6 +11,10 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-1wenhe:before {
+  content: "\e653";
+}
+
 .icon-paizhao:before {
   content: "\e6ba";
 }
@@ -27,6 +31,10 @@
   content: "\e62e";
 }
 
+.icon-shudianxianlu:before {
+  content: "\e60a";
+}
+
 .icon-dianli:before {
   content: "\e649";
 }
@@ -43,6 +51,10 @@
   content: "\e962";
 }
 
+.icon-qixiang:before {
+  content: "\e67c";
+}
+
 .icon-shexiangtou-lixian:before {
   content: "\ef1c";
 }
@@ -59,3 +71,7 @@
   content: "\e681";
 }
 
+.icon-fubing:before {
+  content: "\e7ac";
+}
+

src/components/Home.vue

@@ -1,11 +1,15 @@
 <template>
   <div class="wrapper">
     <v-head></v-head>
+    <layout-tabs></layout-tabs>
+
     <div class="content-box">
       <div class="content">
-        <transition name="move" mode="out-in">
-          <router-view></router-view>
-        </transition>
+        <!-- <transition name="move" mode="out-in"> -->
+        <keep-alive :include="caches">
+          <router-view v-if="isRenderTab"></router-view>
+        </keep-alive>
+        <!-- </transition> -->
       </div>
     </div>
   </div>
@@ -13,13 +17,19 @@
 
 <script>
 import vHead from "./header.vue";
-
+import LayoutTabs from "./LayoutTabs.vue";
+import { mapState } from "vuex";
 export default {
   data() {
     return {};
   },
   components: {
     vHead,
+    LayoutTabs,
+  },
+  computed: {
+    ...mapState("cache", ["caches"]),
+    ...mapState(["isRenderTab"]),
   },
   created() {},
 };
@@ -31,7 +41,7 @@ export default {
     position: absolute;
     left: 0px;
     right: 0;
-    top: 56px;
+    top: 92px;
     bottom: 0;
     //padding-bottom: 30px;
     -webkit-transition: left 0.3s ease-in-out;

src/components/LayoutTabs.vue

@@ -0,0 +1,251 @@
+<template>
+  <div class="layout-tabs">
+    <el-tabs
+      type="border-card"
+      v-model="curTabKey"
+      closable
+      @tab-click="clickTab"
+      @tab-remove="removeTab"
+    >
+      <el-tab-pane
+        v-for="item in tabs"
+        :label="item.title"
+        :name="item.tabKey"
+        :key="item.tabKey"
+      >
+        <template slot="label"
+          >{{ item.title }}
+          <i
+            v-if="curTabKey === item.tabKey"
+            class="el-icon-refresh"
+            @click="refreshTab(item)"
+          ></i
+        ></template>
+      </el-tab-pane>
+    </el-tabs>
+    <div class="close-tabs" @click="closeOtherTabs">关闭其他</div>
+  </div>
+</template>
+
+<script>
+import { mapMutations, mapActions } from "vuex";
+import EventBus from "@/utils/event-bus";
+
+export default {
+  name: "LayoutTabs",
+  props: {
+    // 【根据项目修改】tab页面在路由的第几层，或者说第几层的 router-view 组件（当前项目为第二层）
+    tabRouteViewDepth: {
+      type: Number,
+      default: 2,
+    },
+    // tab页面的key值，从route对象中取，一个key值对应一个tab页面
+    // 默认为matchRoute.path值
+    getTabKey: {
+      type: Function,
+      default: function (routeMatch /* , route */) {
+        return routeMatch.path;
+      },
+    },
+    // tab页签的标题，默认从路由meta.title中获取
+    tabTitleKey: {
+      type: String,
+      default: "title",
+    },
+  },
+  data() {
+    return {
+      tabs: [],
+      curTabKey: "",
+    };
+  },
+  methods: {
+    ...mapActions("cache", ["addCache", "removeCache", "removeCacheEntry"]),
+    ...mapMutations(["setIsRenderTab"]),
+    // 切换tab
+    changeCurTab() {
+      // 当前路由信息
+      const { path, query, params, hash, matched } = this.$route;
+      // tab标签页路由信息：meta、componentName
+      const routeMatch = matched[this.tabRouteViewDepth - 1];
+      const meta = routeMatch.meta;
+      const componentName = routeMatch.components?.default?.name;
+      // 获取tab标签页信息：tabKey标签页key值；title-标签页标题；tab-存在的标签页
+      const tabKey = this.getTabKey(routeMatch, this.$route);
+      const title = String(meta[this.tabTitleKey] || "");
+      const tab = this.tabs.find((tab) => tab.tabKey === tabKey);
+
+      if (!tabKey) {
+        // tabKey默认为路由的name值
+        console.warn(
+          `LayoutTabs组件：${path} 路由没有匹配的tab标签页，如有需要请配置tab标签页的key值`
+        );
+        return;
+      }
+
+      // 同一个路由，但是新旧路径不同时，需要清除路由缓存。例如route.path配置为 '/detail/:id'时路径会不同
+      // 这里判断 props.tabRouteViewDepth === matched.length 必须是跟tab同级路由，否则会影响多级路由缓存
+      if (
+        tab &&
+        tab.path !== path &&
+        this.tabRouteViewDepth === matched.length
+      ) {
+        this.removeCacheEntry(componentName || "");
+        tab.title = "";
+      }
+
+      const newTab = {
+        tabKey,
+        title: tab?.title || title,
+        path,
+        params,
+        query,
+        hash,
+        componentName,
+      };
+      tab ? Object.assign(tab, newTab) : this.tabs.push(newTab);
+      this.curTabKey = tabKey;
+    },
+    // 点击tab
+    clickTab(pane) {
+      if (!pane.index) return;
+
+      const tab = this.tabs[Number(pane.index)];
+      if (tab.path !== this.$route.path) {
+        this.gotoTab(tab);
+      }
+    },
+    // 移除tab
+    async removeTab(tabKey) {
+      // 剩下一个时不能删
+      if (this.tabs.length === 1) return;
+
+      const index = this.tabs.findIndex((tab) => tab.tabKey === tabKey);
+      if (index < -1) return;
+
+      const tab = this.tabs[index];
+      this.tabs.splice(index, 1);
+
+      // 如果删除的是当前tab，则切换到最后一个tab
+      if (tab.tabKey === this.curTabKey) {
+        const lastTab = this.tabs[this.tabs.length - 1];
+        lastTab && this.gotoTab(lastTab);
+      }
+      this.removeCache(tab.componentName || "");
+    },
+    // 跳转tab页面
+    async gotoTab(tab) {
+      await this.$router.push({
+        path: tab.path,
+        query: tab.query,
+        hash: tab.hash,
+      });
+    },
+    // 关闭非当前页的所有tab页签
+    closeOtherTabs() {
+      this.tabs
+        .filter((tab) => tab.tabKey !== this.curTabKey)
+        .forEach((tab) => {
+          this.removeCache(tab.componentName || "");
+        });
+      this.tabs = this.tabs.filter((tab) => tab.tabKey === this.curTabKey);
+    },
+    // 刷新当前tab页面
+    async refreshTab(tab) {
+      this.setIsRenderTab(false);
+      await this.removeCacheEntry(tab.componentName);
+      this.setIsRenderTab(true);
+    },
+    // 关闭tab页面，默认关闭当前页
+    async closeLayoutTab(tabKey = this.curTabKey) {
+      const index = this.tabs.findIndex((tab) => tab.tabKey === tabKey);
+      if (index > -1) {
+        this.removeCache(this.tabs[index].componentName);
+        this.tabs.splice(index, 1);
+      }
+    },
+    // 设置当前tab的标题
+    setCurTabTitle(title) {
+      const curTab = this.tabs.find((tab) => tab.tabKey === this.curTabKey);
+      if (curTab) {
+        curTab.title = title;
+      }
+    },
+  },
+  watch: {
+    "$route.path": {
+      handler() {
+        this.changeCurTab();
+      },
+      immediate: true,
+    },
+  },
+  created() {
+    // 对外提供的事件：关闭弹窗；设置tab标题
+    EventBus.$on("LayoutTabs:closeTab", (tabKey) => {
+      this.closeLayoutTab(tabKey);
+    });
+    EventBus.$on("LayoutTabs:setTabTitle", (title) => {
+      this.setCurTabTitle(title);
+    });
+  },
+};
+</script>
+
+<style lang="less">
+.layout-tabs {
+  position: relative;
+  height: 32px;
+  line-height: 32px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background-color: #f5f7fa;
+  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), 0 0 6px 0 rgba(0, 0, 0, 0.04);
+  //background-color: #fcc;
+  .close-tabs {
+    padding-right: 12px;
+    cursor: pointer;
+    color: #999;
+    height: 32px;
+    line-height: 32px;
+    font-size: 12px;
+    &:hover {
+      color: #169e8c;
+    }
+  }
+  .el-tabs--border-card {
+    height: 30px;
+    flex: 1;
+    margin-right: 12px;
+    border: 1px solid #dcdfe6;
+    box-shadow: none;
+  }
+  .el-icon-refresh {
+    margin: 0px 8px 0px 4px;
+  }
+  .el-tabs--border-card > .el-tabs__header .el-tabs__item.is-active {
+    color: #fff;
+    background-color: #169e8c;
+  }
+  .el-tabs--border-card
+    > .el-tabs__header
+    .el-tabs__item:not(.is-disabled):hover {
+    color: #fff;
+    background-color: #169e8c;
+  }
+  .el-tabs__item .el-icon-close {
+    transition: none;
+  }
+
+  .el-tabs__item {
+    height: 30px;
+    line-height: 30px;
+    font-size: 12px;
+    padding: 0 10px !important;
+  }
+  .el-tabs__content {
+    display: none;
+  }
+}
+</style>

src/components/Sidebar.vue

@@ -63,7 +63,6 @@ export default {
           index: "/realTimeMonitor",
           title: "实时监控",
         },
-
         {
           icon: "el-icon-film",
           index: "/pictureRotation",
@@ -74,106 +73,35 @@ export default {
           index: "/photoAlarm",
           title: "告警处理",
         },
-
         {
           icon: "el-icon-search",
           index: "/realTimeSearch",
           title: "历史图片",
         },
         {
-          icon: "el-icon-files",
-          index: "/property",
-          title: "资产管理",
-          subs: [
-            {
-              index: "/lineInformation",
-              title: "线路信息管理",
-            },
-            {
-              index: "/towerInformation",
-              title: "杆塔信息管理",
-            },
-
-            {
-              index: "/cameraChannel",
-              title: "通道管理",
-            },
-            {
-              index: "/photographicDevice",
-              title: "拍照装置管理",
-            },
-            {
-              index: "/devicePhotoSchedule",
-              title: "拍照时间表设置",
-            },
-            {
-              index: "/deviceReport",
-              title: "装置报表",
-            },
-            {
-              index: "/waterMark",
-              title: "水印下发",
-            },
-            // {
-            //   index: "/deviceUpgrade",
-            //   title: "装置升级",
-            // },
-            // {
-            //   icon: "el-icon-picture-outline",
-            //   index: "imageSettings",
-            //   title: "图像采集参数设置",
-            // },
-          ],
-        },
-        {
-          icon: "el-icon-monitor",
-          index: "/system",
-          title: "系统管理",
+          icon: "iconfont icon-fubing",
+          index: "/weatherIce",
+          title: "气象覆冰",
           subs: [
             {
-              index: "/userManagement",
-              title: "用户管理",
+              index: "/weather",
+              title: "气象监测",
             },
             {
-              index: "/globalTools",
-              title: "全局设置",
+              index: "/icing",
+              title: "覆冰监测",
             },
           ],
         },
-      ],
-      items1: [
-        {
-          icon: "el-icon-s-home",
-          index: "stritl",
-          title: "首页",
-        },
-        {
-          icon: "el-icon-camera",
-          index: "/realTimeMonitor",
-          title: "实时监控",
-        },
-
-        {
-          icon: "el-icon-film",
-          index: "/pictureRotation",
-          title: "图片轮巡",
-        },
-        {
-          icon: "el-icon-bell",
-          index: "/photoAlarm",
-          title: "告警处理",
-        },
-
-        {
-          icon: "el-icon-search",
-          index: "/realTimeSearch",
-          title: "历史图片",
-        },
         {
           icon: "el-icon-files",
           index: "/property",
           title: "资产管理",
           subs: [
+            {
+              index: "/dyInformation",
+              title: "电压信息管理",
+            },
             {
               index: "/lineInformation",
               title: "线路信息管理",
@@ -189,21 +117,20 @@ export default {
             },
             {
               index: "/photographicDevice",
-              title: "拍照装置管理",
+              title: "装置管理",
             },
             {
               index: "/devicePhotoSchedule",
               title: "拍照时间表设置",
             },
-            // {
-            //   index: "/deviceUpgrade",
-            //   title: "装置升级",
-            // },
-            // {
-            //   icon: "el-icon-picture-outline",
-            //   index: "imageSettings",
-            //   title: "图像采集参数设置",
-            // },
+            {
+              index: "/reportData",
+              title: "数据报表",
+            },
+            {
+              index: "/statisticalReport",
+              title: "统计报表",
+            },
           ],
         },
         {
@@ -215,82 +142,47 @@ export default {
               index: "/userManagement",
               title: "用户管理",
             },
+            {
+              index: "/roleManagement",
+              title: "角色管理",
+            },
             // {
-            //   index: "/globalTools",
-            //   title: "全局设置",
+            //   index: "/menuManagement",
+            //   title: "菜单功能管理",
             // },
-          ],
-        },
-      ],
-      items2: [
-        {
-          icon: "el-icon-s-home",
-          index: "stritl",
-          title: "首页",
-        },
-        {
-          icon: "el-icon-camera",
-          index: "/realTimeMonitor",
-          title: "实时监控",
-        },
+            {
+              index: "/deviceUpgrade",
+              title: "升级管理",
+            },
 
-        {
-          icon: "el-icon-film",
-          index: "/pictureRotation",
-          title: "图片轮巡",
-        },
-        {
-          icon: "el-icon-bell",
-          index: "photoAlarm",
-          title: "告警处理",
-        },
-        {
-          icon: "el-icon-search",
-          index: "/realTimeSearch",
-          title: "历史图片",
-        },
-        {
-          icon: "el-icon-files",
-          index: "/property",
-          title: "资产管理",
-          subs: [
             {
-              index: "/lineInformation",
-              title: "线路信息管理",
+              index: "/globalTools",
+              title: "全局设置",
             },
             {
-              index: "/towerInformation",
-              title: "杆塔信息管理",
+              index: "/waterMark",
+              title: "水印下发",
             },
-
-            // {
-            //   index: "/cameraChannel",
-            //   title: "通道管理",
-            // },
             {
-              index: "/photographicDevice",
-              title: "拍照装置管理",
+              index: "/otherCommon",
+              title: "批量命令",
             },
             {
-              index: "/devicePhotoSchedule",
-              title: "拍照时间表设置",
+              index: "/aiWork",
+              title: "AI绘图",
+            },
+            {
+              index: "/weatherIceConfig",
+              title: "覆冰微气象转发",
             },
-            // {
-            //   index: "/deviceUpgrade",
-            //   title: "装置升级",
-            // },
-            // {
-            //   icon: "el-icon-picture-outline",
-            //   index: "imageSettings",
-            //   title: "图像采集参数设置",
-            // },
           ],
         },
       ],
-
       role: "",
+      menuList: [],
     };
   },
+
   watch: {
     $route() {
       this.setCurrentRoute();
@@ -298,24 +190,131 @@ export default {
   },
   methods: {
     setCurrentRoute() {
-      this.activeIndex = this.$route.path; // 通过他就可以监听到当前路由状态并激活当前菜单
+      console.log(this.$route.path);
+      this.$nextTick(() => {
+        this.activeIndex = this.$route.path; // 通过他就可以监听到当前路由状态并激活当前菜单
+        console.log(this.activeIndex);
+        localStorage.setItem("menuActive", this.activeIndex);
+      });
+    },
+
+    getMenuArr(originalArray) {
+      const icons = {
+        stritl: "el-icon-s-home",
+        realTimeMonitor: "el-icon-camera",
+        pictureRotation: "el-icon-film",
+        photoAlarm: "el-icon-bell",
+        realTimeSearch: "el-icon-search",
+        // ... 其他图标
+        default: "el-icon-default", // 默认图标
+      };
+      const assetManagementSubs = []; // 用于存储资产管理子菜单的对象
+      const systemManagementSubs = []; // 用于存储系统管理子菜单的对象
+      const weatherManagementSubs = []; // 用于存储系统管理子菜单的对象
+      const newArray = [];
+
+      // 遍历原始数组，根据条件构建新数组
+      originalArray.forEach((item) => {
+        const { id, key, desc } = item;
+        console.log(key, desc);
+        const index = key.startsWith("/") ? key.substring(1) : key; // 移除开头的斜杠
+        // 移除desc中"-"后面的内容
+        const processedDesc = desc.split("-")[0].trim();
+        console.log(index, processedDesc);
+        const icon = icons[index] || icons["default"]; // 获取图标，如果未找到则使用默认图标
+
+        if (
+          [
+            "dyInformation",
+            "lineInformation",
+            "towerInformation",
+            "cameraChannel",
+            "photographicDevice",
+            "devicePhotoSchedule",
+            "reportData",
+          ].includes(index)
+        ) {
+          // 如果包含杆塔或线路信息，则添加到资产管理子菜单
+          assetManagementSubs.push({
+            index: "/" + index,
+            title: processedDesc,
+          });
+        } else if (
+          [
+            "userManagement",
+            "roleManagement",
+            "menuManagement",
+            "deviceUpgrade",
+            "globalTools",
+            "waterMark",
+          ].includes(index)
+        ) {
+          // 如果包含用户列表等，则添加到系统管理子菜单
+          systemManagementSubs.push({
+            index: "/" + index,
+            title: processedDesc,
+          });
+        } else if (["weather", "icing"].includes(index)) {
+          // 如果包含用户列表等，则添加到系统管理子菜单
+          weatherManagementSubs.push({
+            index: "/" + index,
+            title: processedDesc,
+          });
+        } else {
+          // 其他菜单项直接添加到新数组中
+          newArray.push({ icon, index: "/" + index, title: processedDesc });
+        }
+      });
+      // 如果存在资产管理子菜单项，则添加资产管理菜单
+      if (weatherManagementSubs.length > 0) {
+        newArray.push({
+          icon: "iconfont icon-fubing",
+          index: "weatherIce",
+          title: "气象覆冰",
+          subs: weatherManagementSubs,
+        });
+      }
+      // 如果存在资产管理子菜单项，则添加资产管理菜单
+      if (assetManagementSubs.length > 0) {
+        newArray.push({
+          icon: "el-icon-files",
+          index: "property",
+          title: "资产管理",
+          subs: assetManagementSubs,
+        });
+      }
+
+      // 如果存在系统管理子菜单项，则添加系统管理菜单
+      if (systemManagementSubs.length > 0) {
+        newArray.push({
+          icon: "el-icon-setting", // 假设的系统管理图标
+          index: "system",
+          title: "系统管理",
+          subs: systemManagementSubs,
+        });
+      }
+      console.log("我是最后的", newArray);
+
+      //return newArray;
+      this.items = newArray;
     },
   },
   created() {
+    console.log("我是被选中的", this.activeIndex);
     this.setCurrentRoute();
     this.role = localStorage.getItem("role");
     console.log("用户管理");
     console.log(this.role);
-
-    if (this.role == 0) {
+    if (this.role !== "0") {
+      this.menuList = JSON.parse(localStorage.getItem("menuPermission"));
+      console.log(this.menuList);
+      this.menuList.push({ id: 8, key: "/stritl", desc: "首页-菜单" });
+      this.menuList = this.menuList.sort((a, b) => a.id - b.id);
+      this.getMenuArr(this.menuList);
+    } else {
+      console.log("我是超管");
       this.items = this.items;
-    } else if (this.role == 1) {
-      this.items = this.items1;
-    } else if (this.role == 2) {
-      this.items = this.items2;
     }
-
-    console.log(this.items);
   },
 };
 </script>
@@ -335,6 +334,9 @@ export default {
     }
     .el-submenu__title {
       padding: 0 10px;
+      .iconfont {
+        margin-right: 5px;
+      }
     }
     .el-dropdown-menu__item,
     .el-menu-item,
@@ -411,5 +413,12 @@ export default {
     border: 1px solid #169e8c;
     background-color: #169e8c;
   }
+  .el-menu-item [class^="iconfont"] {
+    margin-right: 5px;
+    width: 24px;
+    text-align: center;
+    font-size: 18px;
+    vertical-align: middle;
+  }
 }
 </style>

src/components/header.vue

@@ -1,6 +1,7 @@
 <template>
   <div class="header">
-    <div class="logoTitle">视频监控可视化平台</div>
+    <div class="logoTitle" v-if="notes == '覆冰用户使用'">覆冰在线监测系统</div>
+    <div class="logoTitle" v-else>视频监控可视化平台</div>
     <div class="menuBox">
       <vSidebar></vSidebar>
       <div class="userInfo">
@@ -41,6 +42,8 @@ export default {
   data() {
     return {
       userName: localStorage.getItem("userName"),
+      role: localStorage.getItem("role"),
+      notes: localStorage.getItem("notes"),
     };
   },
   methods: {

src/components/passwordDialog.vue

@@ -6,9 +6,19 @@
     :close-on-click-modal="false"
     width="420px"
   >
-    <el-form :model="psdForm" :rules="rules" ref="formInfo" label-position="left" label-width="80px">
+    <el-form
+      :model="psdForm"
+      :rules="rules"
+      ref="formInfo"
+      label-position="left"
+      label-width="80px"
+    >
       <el-form-item label="用户名:">
-        <el-input v-model="psdForm.userName" autocomplete="off" :disabled="true"></el-input>
+        <el-input
+          v-model="psdForm.userName"
+          autocomplete="off"
+          :disabled="true"
+        ></el-input>
       </el-form-item>
       <!-- <el-form-item label="原密码:">
         <el-input v-model="psdForm.originalPsd" autocomplete="off"></el-input>
@@ -31,9 +41,9 @@ import { updateUserApi } from "@/utils/api/index";
 export default {
   data() {
     return {
-      isShow:false,
+      isShow: false,
       psdForm: {
-        userName: localStorage.getItem('userName'),
+        userName: localStorage.getItem("userName"),
         originalPsd: "",
         newPsd: "",
         password: "",
@@ -54,12 +64,12 @@ export default {
     submitForm() {
       this.$refs.formInfo.validate((valid) => {
         if (valid) {
-          this.$set(this.psdForm,'userId',localStorage.getItem('userid'))
+          this.$set(this.psdForm, "uid", localStorage.getItem("uid"));
           updateUserApi(this.psdForm)
             .then((res) => {
               if (res.code == 200) {
                 this.$message.success("修改成功,请重新登录");
-                this.isShow = false
+                this.isShow = false;
                 this.$store.commit("REMOVE_INFO");
                 this.$router.push("/login");
               } else {

src/echartsDemo.vue

@@ -0,0 +1,576 @@
+<template>
+  <div class="echartsBox">
+    <div class="gropName">
+      <!-- <el-checkbox-group v-model="checkList">
+        <el-checkbox
+          v-for="item in qtOption"
+          :label="item.groupName"
+          :key="item.groupName"
+          ><span v-if="item.groupName == 'H2'">{{ item.groupName }}(氢气)</span>
+          <span v-if="item.groupName == 'CO'"
+            >{{ item.groupName }}(一氧化碳)</span
+          >
+          <span v-if="item.groupName == 'CH4'">{{ item.groupName }}(甲烷)</span>
+          <span v-if="item.groupName == 'C2H4'"
+            >{{ item.groupName }}(乙烯)</span
+          >
+          <span v-if="item.groupName == 'C2H6'"
+            >{{ item.groupName }}(乙烷)</span
+          >
+          <span v-if="item.groupName == 'C2H2'"
+            >{{ item.groupName }}(乙炔)</span
+          ></el-checkbox
+        >
+      </el-checkbox-group> -->
+    </div>
+    <div id="demo1"></div>
+    <div id="demo2"></div>
+    <div id="demo3"></div>
+    <div id="demo4"></div>
+  </div>
+</template>
+<script>
+import axios from "axios";
+export default {
+  name: "",
+  data() {
+    return {
+      checkList: [], //选中勾选框
+      qtOption: [], //气体数据
+      myChart: "",
+      xData1: [], //横坐标
+      lineData1: [], //纵坐标
+      yMax1: "", //y轴最大值
+      channelCrests1: [], //气体数组
+      dataPointer1: [], //气体点
+
+      xData2: [], //横坐标
+      lineData2: [], //纵坐标
+      yMax2: "", //y轴最大值
+      channelCrests2: [], //气体数组
+      dataPointer2: [], //气体点
+
+      xData3: [], //横坐标
+      lineData3: [], //纵坐标
+      yMax3: "", //y轴最大值
+      channelCrests3: [], //气体数组
+      dataPointer3: [], //气体点
+
+      xData4: [], //横坐标
+      lineData4: [], //纵坐标
+      yMax4: "", //y轴最大值
+      channelCrests4: [], //气体数组
+      dataPointer4: [], //气体点
+    };
+  },
+  created() {
+    this.getMenuData1();
+    this.getMenuData2();
+    this.getMenuData3();
+    this.getMenuData4();
+  },
+  mounted() {},
+  watch: {},
+  methods: {
+    //图表1
+    getMenuData1() {
+      axios
+        .get("/aa.json")
+        .then((res) => {
+          console.log("getMenuData", res);
+          // this.qtOption = res.data.config.channels[0].crests;//气体
+          // console.log(this.qtOption);
+          this.lineData1 = res.data.data[0]; //纵坐标数据
+          this.yMax1 = res.data.config.yMax; //y轴最大值
+
+          this.channelCrests1 = res.data.config.channels[0].crests;
+
+          var timeSpan = 1; //时间间隔
+          for (
+            var i = 0;
+            i < res.data.config.numberOfData * timeSpan;
+            i = i + timeSpan
+          ) {
+            this.xData1.push(i);
+          }
+          for (var i = 0; i < this.channelCrests1.length; i++) {
+            this.dataPointer1.push({
+              name: this.channelCrests1[i].groupName,
+              label: this.channelCrests1[i].crestNo + "",
+              xAxis: this.channelCrests1[i].crestTime,
+              yAxis: this.lineData1[this.channelCrests1[i].crestTime],
+            });
+          }
+          console.log(this.dataPointer1);
+
+          //横坐标数据
+          this.getEchart1();
+        })
+        .catch((error) => {
+          console.log(error);
+        });
+    },
+    //图表2
+    getMenuData2() {
+      axios
+        .get("/bb.json")
+        .then((res) => {
+          this.lineData2 = res.data.data[0]; //纵坐标数据
+          this.yMax2 = res.data.config.yMax; //y轴最大值
+
+          this.channelCrests2 = res.data.config.channels[0].crests;
+          var timeSpan = 1; //时间间隔
+          for (
+            var i = 0;
+            i < res.data.config.numberOfData * timeSpan;
+            i = i + timeSpan
+          ) {
+            this.xData2.push(i);
+          }
+          for (var i = 0; i < this.channelCrests2.length; i++) {
+            this.dataPointer2.push({
+              name: this.channelCrests2[i].groupName,
+              label: this.channelCrests2[i].crestNo + "",
+              xAxis: this.channelCrests2[i].crestTime,
+              yAxis: this.lineData2[this.channelCrests2[i].crestTime],
+            });
+          }
+          console.log(this.dataPointer2);
+
+          //横坐标数据
+          //横坐标数据
+          this.getEchart2();
+        })
+        .catch((error) => {
+          console.log(error);
+        });
+    },
+    //图表3
+    getMenuData3() {
+      axios
+        .get("/cc.json")
+        .then((res) => {
+          this.lineData3 = res.data.data[0]; //纵坐标数据
+          this.yMax3 = res.data.config.yMax; //y轴最大值
+          this.channelCrests3 = res.data.config.channels[0].crests;
+          var timeSpan = 1; //时间间隔
+          for (
+            var i = 0;
+            i < res.data.config.numberOfData * timeSpan;
+            i = i + timeSpan
+          ) {
+            this.xData3.push(i);
+          }
+          console.log(this.lineData3);
+          for (var i = 0; i < this.channelCrests3.length; i++) {
+            this.dataPointer3.push({
+              name: this.channelCrests3[i].groupName,
+              label: this.channelCrests3[i].crestNo + "",
+              xAxis: this.channelCrests3[i].crestTime,
+              yAxis: this.lineData3[this.channelCrests3[i].crestTime],
+            });
+          }
+          console.log(this.dataPointer3);
+
+          //横坐标数据
+          this.getEchart3();
+        })
+        .catch((error) => {
+          console.log(error);
+        });
+    },
+    //图表4
+    getMenuData4() {
+      axios
+        .get("/dd.json")
+        .then((res) => {
+          this.lineData4 = res.data.channels[0].data; //纵坐标数据
+          this.yMax4 = res.data.yMax; //y轴最大值
+          this.channelCrests4 = res.data.channels[0].crests;
+          var timeSpan = 1; //时间间隔
+          for (var i = 0; i < res.data.k * timeSpan; i = i + timeSpan) {
+            this.xData4.push(i);
+          }
+          console.log(this.lineData4);
+          for (var i = 0; i < this.channelCrests4.length; i++) {
+            this.dataPointer4.push({
+              name: this.channelCrests4[i].name,
+              label: this.channelCrests4[i].j + "",
+              xAxis: this.channelCrests4[i].time,
+              yAxis: this.lineData4[this.channelCrests4[i].time],
+            });
+          }
+          console.log(this.dataPointer4);
+
+          //横坐标数据
+          this.getEchart4();
+        })
+        .catch((error) => {
+          console.log(error);
+        });
+    },
+    //装置数量统计
+    getEchart1() {
+      this.$nextTick(() => {
+        let that = this;
+        that.myChart = this.$echarts.init(document.getElementById("demo1"));
+        let option = {
+          title: {
+            text: "图谱1",
+            left: "left",
+          },
+          tooltip: {
+            trigger: "axis",
+            axisPointer: {
+              animation: false,
+            },
+          },
+          dataZoom: [
+            {
+              type: "inside",
+              start: 0,
+              end: 100,
+            },
+            {
+              start: 0,
+              end: 100,
+            },
+          ],
+          xAxis: {
+            type: "category",
+            data: this.xData1, // 把时间组成的数组接过来，放在x轴上
+            boundaryGap: false,
+            showMaxLabel: true,
+            name: "单位:s", // 这个设置只在末尾添加单位
+          },
+
+          yAxis: {
+            type: "value",
+            scale: true,
+            name: "单位:mV", //  你的单位写在这就可以
+
+            nameTextStyle: {
+              //  单位样式
+              color: "#000", //  字体颜色
+              fontSize: 10, //  字体大小
+              padding: [0, 28, 4, 0], //  内填充
+            },
+          },
+          series: [
+            {
+              data: this.lineData1,
+              type: "line",
+              smooth: true,
+              symbol: "none",
+              sampling: "lttb",
+              itemStyle: {
+                color: "rgb(255, 70, 131)",
+              },
+              markPoint: {
+                data: this.dataPointer1,
+                symbol: "pin",
+                symbolSize: 18,
+                itemStyle: {
+                  normal: {
+                    label: {
+                      show: true,
+                      position: "top",
+                      distance: 0,
+                      formatter: function (params) {
+                        console.log(params);
+                        return params.data.label + ":" + params.name;
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          ],
+        };
+        that.myChart.setOption(option);
+        window.addEventListener("resize", () => {
+          that.myChart.resize();
+        });
+      });
+    },
+    getEchart2() {
+      this.$nextTick(() => {
+        let that = this;
+        that.myChart = this.$echarts.init(document.getElementById("demo2"));
+        let option = {
+          title: {
+            text: "图谱2",
+            left: "left",
+          },
+          tooltip: {
+            trigger: "axis",
+            axisPointer: {
+              animation: false,
+            },
+          },
+          dataZoom: [
+            {
+              type: "inside",
+              start: 0,
+              end: 100,
+            },
+            {
+              start: 0,
+              end: 100,
+            },
+          ],
+          xAxis: {
+            type: "category",
+            data: this.xData2, // 把时间组成的数组接过来，放在x轴上
+            boundaryGap: false,
+            showMaxLabel: true,
+            name: "单位:s", // 这个设置只在末尾添加单位
+          },
+
+          yAxis: {
+            type: "value",
+            scale: true,
+            name: "单位:mV", //  你的单位写在这就可以
+
+            nameTextStyle: {
+              //  单位样式
+              color: "#000", //  字体颜色
+              fontSize: 10, //  字体大小
+              padding: [0, 28, 4, 0], //  内填充
+            },
+          },
+          series: [
+            {
+              data: this.lineData2,
+              type: "line",
+              smooth: true,
+              symbol: "none",
+              sampling: "lttb",
+              itemStyle: {
+                color: "rgb(255, 70, 131)",
+              },
+              markPoint: {
+                data: this.dataPointer2,
+                symbol: "pin",
+                symbolSize: 18,
+                itemStyle: {
+                  normal: {
+                    label: {
+                      show: true,
+                      position: "top",
+                      distance: 0,
+                      formatter: function (params) {
+                        console.log(params);
+                        return params.data.label + ":" + params.name;
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          ],
+        };
+        that.myChart.setOption(option);
+        window.addEventListener("resize", () => {
+          that.myChart.resize();
+        });
+      });
+    },
+    getEchart3() {
+      this.$nextTick(() => {
+        let that = this;
+        that.myChart = this.$echarts.init(document.getElementById("demo3"));
+        let option = {
+          title: {
+            text: "图谱3",
+            left: "left",
+          },
+          tooltip: {
+            trigger: "axis",
+            axisPointer: {
+              animation: false,
+            },
+          },
+          dataZoom: [
+            {
+              type: "inside",
+              start: 0,
+              end: 100,
+            },
+            {
+              start: 0,
+              end: 100,
+            },
+          ],
+          xAxis: {
+            type: "category",
+            data: this.xData3, // 把时间组成的数组接过来，放在x轴上
+            boundaryGap: false,
+            showMaxLabel: true,
+            name: "单位:s", // 这个设置只在末尾添加单位
+          },
+
+          yAxis: {
+            type: "value",
+            scale: true,
+            show: true, //   前提：  y轴肯定是要显示的
+            name: "单位:mV", //  你的单位写在这就可以
+
+            nameTextStyle: {
+              //  单位样式
+              color: "#000", //  字体颜色
+              fontSize: 10, //  字体大小
+              padding: [0, 28, 4, 0], //  内填充
+            },
+          },
+          series: [
+            {
+              data: this.lineData3,
+              type: "line",
+              smooth: true,
+              symbol: "none",
+              sampling: "lttb",
+              itemStyle: {
+                color: "rgb(255, 70, 131)",
+              },
+              markPoint: {
+                data: this.dataPointer3,
+                symbol: "pin",
+                symbolSize: 18,
+                itemStyle: {
+                  normal: {
+                    label: {
+                      show: true,
+                      position: "top",
+                      distance: 0,
+                      formatter: function (params) {
+                        console.log(params);
+                        return params.data.label + ":" + params.name;
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          ],
+        };
+        that.myChart.setOption(option);
+        window.addEventListener("resize", () => {
+          that.myChart.resize();
+        });
+      });
+    },
+    getEchart4() {
+      this.$nextTick(() => {
+        let that = this;
+        that.myChart = this.$echarts.init(document.getElementById("demo4"));
+        let option = {
+          title: {
+            text: "图谱4",
+            left: "left",
+          },
+          tooltip: {
+            trigger: "axis",
+            axisPointer: {
+              animation: false,
+            },
+          },
+          dataZoom: [
+            {
+              type: "inside",
+              start: 0,
+              end: 100,
+            },
+            {
+              start: 0,
+              end: 100,
+            },
+          ],
+          xAxis: {
+            type: "category",
+            data: this.xData4, // 把时间组成的数组接过来，放在x轴上
+            boundaryGap: false,
+            showMaxLabel: true,
+            name: "单位:s", // 这个设置只在末尾添加单位
+          },
+
+          yAxis: {
+            type: "value",
+            scale: true,
+            show: true, //   前提：  y轴肯定是要显示的
+            name: "单位:mV", //  你的单位写在这就可以
+
+            nameTextStyle: {
+              //  单位样式
+              color: "#000", //  字体颜色
+              fontSize: 10, //  字体大小
+              padding: [0, 28, 4, 0], //  内填充
+            },
+          },
+          series: [
+            {
+              data: this.lineData4,
+              type: "line",
+              smooth: true,
+              symbol: "none",
+              sampling: "lttb",
+              itemStyle: {
+                color: "rgb(255, 70, 131)",
+              },
+              markPoint: {
+                data: this.dataPointer4,
+                symbol: "pin",
+                symbolSize: 18,
+                itemStyle: {
+                  normal: {
+                    label: {
+                      show: true,
+                      position: "top",
+                      distance: 0,
+                      formatter: function (params) {
+                        console.log(params);
+                        return params.data.label + ":" + params.name;
+                      },
+                    },
+                  },
+                },
+              },
+            },
+          ],
+        };
+        that.myChart.setOption(option);
+        window.addEventListener("resize", () => {
+          that.myChart.resize();
+        });
+      });
+    },
+  },
+};
+</script>
+<style lang="less">
+.echartsBox {
+  height: calc(100% - 32px);
+  padding: 16px;
+  // display: flex;
+  // flex-direction: column;
+  overflow: auto;
+  // justify-content: space-around;
+  #demo1,
+  #demo2,
+  #demo3,
+  #demo4 {
+    height: 400px;
+    width: 80%;
+  }
+  .gropName {
+    .el-checkbox-group {
+      display: flex;
+      flex-direction: column;
+      .el-checkbox {
+        height: 40px;
+        line-height: 40px;
+      }
+    }
+  }
+}
+</style>

src/main.js

@@ -28,8 +28,22 @@ Vue.use(ElementUI, {
 //引入插件
 import VueLazyload from "vue-lazyload";
 //注册插件
+// 全局配置vue-lazyload
+// Vue.use(VueLazyload, {
+
+//   listenEvents: ["scroll"], // 监听的事件类型
+// });
 Vue.use(VueLazyload, {
   error: require("./assets/img/nodatapic2.jpg"),
+  listenEvents: [
+    "scroll",
+    "wheel",
+    "mousewheel",
+    "resize",
+    "animationend",
+    "transitionend",
+    "touchmove",
+  ],
 });
 /* 引入公共js*/
 import common from "@/utils/common/common.js";
@@ -54,17 +68,42 @@ Vue.directive("noMoreClick", {
 //使用钩子函数对路由进行权限跳转
 router.beforeEach((to, from, next) => {
   document.title = `${to.meta.title} | 视频监控可视化平台`;
+
+  // 获取用户的角色和token
   const role = localStorage.getItem("role");
   const token = localStorage.getItem("token");
-  console.log(role, token);
+
+  // 如果没有token，并且不是登录页面，重定向到登录页面
   if (!token && to.path !== "/login") {
-    //next("/login");
-    next({
-      path: "/login",
-    });
-  } else {
-    next();
+    return next({ path: "/login" });
+  }
+  // 如果用户是超级管理员（role == 0），则允许访问任何页面
+  if (role === "0") {
+    return next();
+  }
+  // 如果用户从登录页面跳转到其他页面，并且已经拥有token，则允许通过
+  if (from.path === "/login" && token) {
+    return next();
+  }
+  // 获取权限列表（这里假设permissions是从后端获取的权限数组）
+  const permissions = JSON.parse(localStorage.getItem("menuPermission")) || [];
+
+  // 检查用户是否有访问当前路由的权限
+  const hasPermission = permissions.some(
+    (permission) => permission.key === to.path
+  );
+
+  // 如果路由需要权限，但用户没有权限，则重定向到无权限页面
+  if (to.meta.requiresAuth && !hasPermission) {
+    return next({ path: "/permission" });
+  }
+
+  // 如果路由在免登录白名单中，则直接通过
+  if (to.meta.noAuth) {
+    return next();
   }
+  // 如果以上条件都不满足，正常通过
+  next();
 });
 new Vue({
   router,

src/router/index.js

@@ -4,135 +4,312 @@ import VueRouter from "vue-router";
 Vue.use(VueRouter);
 
 const routes = [
-  { path: "/", redirect: "/login" },
   {
-    path: "/stritl",
+    path: "/",
+    redirect: "/stritl",
     component: () => import("../components/Home.vue"),
-    meta: { title: "首页" },
     children: [
       {
         path: "/stritl",
-        component: () =>
-          import(
-            /* webpackChunkName: "dashboard" */ "../views/homePage/index.vue"
-          ),
+        component: () => import("../views/homePage/index.vue"),
+        name: "stritl",
         meta: {
           title: "首页",
           icon: "el-icon-s-home",
+          keepAlive: true,
+          noAuth: true,
         },
       },
       {
         path: "/realTimeMonitor",
-        component: () =>
-          import(
-            /* webpackChunkName: "home" */ "../views/realTimeMonitor/index.vue"
-          ),
+        component: () => import("../views/realTimeMonitor/index.vue"),
+        name: "realTimeMonitor",
         meta: {
           title: "实时监控",
           permission: true,
           icon: "el-icon-camera",
+          keepAlive: true,
+          requiresAuth: true,
         },
       },
       {
         path: "/pictureRotation",
-        component: () =>
-          import(
-            /* webpackChunkName: "home" */ "../views/pictureRotation/index.vue"
-          ),
+        component: () => import("../views/pictureRotation/index.vue"),
+        name: "pictureRotation",
         meta: {
           title: "图片轮巡",
           permission: true,
           icon: "el-icon-camera",
+          keepAlive: true,
+          requiresAuth: true,
         },
       },
       {
         path: "/realTimeSearch",
-        component: () =>
-          import(
-            /* webpackChunkName: "home" */ "../views/realTimeSearch/index.vue"
-          ),
+
+        component: () => import("../views/realTimeSearch/index.vue"),
+        name: "realTimeSearch",
         meta: {
           title: "历史图片",
           permission: true,
           icon: "el-icon-camera",
+          requiresAuth: true,
+          //keepAlive: true,
         },
       },
       {
         path: "/photoAlarm",
-        component: () =>
-          import(
-            /* webpackChunkName: "home" */ "../views/alarmHandling/index.vue"
-          ),
+        component: () => import("../views/alarmHandling/index.vue"),
+        name: "alarmHandling",
         meta: {
           title: "告警处理",
           permission: true,
           icon: "el-icon-camera",
+          keepAlive: true,
+          requiresAuth: true,
         },
       },
 
       {
         path: "/userManagement",
-        component: () =>
-          import(
-            /* webpackChunkName: "tabs" */ "../views/system/userManagement.vue"
-          ),
-        meta: { title: "用户管理", icon: "el-icon-monitor" },
+        component: () => import("../views/system/user/userManagement.vue"),
+        name: "userManagement",
+        meta: {
+          title: "用户管理",
+          icon: "el-icon-monitor",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+      {
+        path: "/roleManagement",
+        component: () => import("../views/system/roleManagement/index.vue"),
+        name: "roleManagement",
+        meta: {
+          title: "角色管理",
+          icon: "el-icon-monitor",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+      {
+        path: "/menuManagement",
+        component: () => import("../views/system/menuManagement/index.vue"),
+        name: "menuManagement",
+        meta: {
+          title: "菜单功能管理",
+          icon: "el-icon-monitor",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+
+      {
+        path: "/deviceUpgrade",
+        component: () => import("../views/system/deviceUpgrade/index.vue"),
+        name: "deviceUpgrade",
+        meta: {
+          title: "升级管理",
+          icon: "el-icon-monitor",
+          keepAlive: true,
+          requiresAuth: true,
+        },
       },
       {
         path: "/globalTools",
-        component: () =>
-          import(
-            /* webpackChunkName: "tabs" */ "../views/system/globalTools/index.vue"
-          ),
-        meta: { title: "全局设置" },
+        component: () => import("../views/system/globalTools/index.vue"),
+        name: "globalTools",
+        meta: { title: "全局设置", keepAlive: true, requiresAuth: true },
+      },
+      {
+        path: "/dyInformation",
+        component: () => import("../views/dyInformation/index.vue"),
+        name: "dyInformation",
+        meta: {
+          title: "电压信息管理",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
       },
       {
         path: "/lineInformation",
-        component: () =>
-          import(
-            /* webpackChunkName: "tabs" */ "../views/lineInformation/index.vue"
-          ),
-        meta: { title: "线路信息管理", icon: "" },
+        component: () => import("../views/lineInformation/index.vue"),
+        name: "lineInformation",
+        meta: {
+          title: "线路信息管理",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
       },
       {
         path: "/towerInformation",
-        component: () =>
-          import(
-            /* webpackChunkName: "tabs" */ "../views/towerInformation/index.vue"
-          ),
-        meta: { title: "杆塔信息管理", icon: "" },
+        component: () => import("../views/towerInformation/index.vue"),
+        name: "towerInformation",
+        meta: {
+          title: "杆塔信息管理",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
       },
       {
         path: "/cameraChannel",
-        component: () =>
-          import(
-            /* webpackChunkName: "tabs" */ "../views/cameraChannel/index.vue"
-          ),
-        meta: { title: "通道管理", icon: "" },
+        component: () => import("../views/cameraChannel/index.vue"),
+        name: "cameraChannel",
+        meta: {
+          title: "通道管理",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
       },
       {
         path: "/photographicDevice",
-        component: () =>
-          import(
-            /* webpackChunkName: "tabs" */ "../views/photographicDevice/index.vue"
-          ),
-        meta: { title: "拍照装置管理", icon: "" },
+        component: () => import("../views/photographicDevice/index.vue"),
+        name: "photographicDevice",
+        meta: {
+          title: "拍照装置管理",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
       },
       {
         path: "/devicePhotoSchedule",
-        component: () =>
-          import(
-            /* webpackChunkName: "tabs" */ "../views/devicePhotoSchedule/index.vue"
-          ),
-        meta: { title: "拍照时间表设置", icon: "" },
+        component: () => import("../views/devicePhotoSchedule/index.vue"),
+        name: "devicePhotoSchedule",
+        meta: {
+          title: "拍照时间表设置",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+      {
+        path: "/waterMark",
+        component: () => import("../views/waterMark/index.vue"),
+        name: "waterMark",
+        meta: {
+          title: "水印下发",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+      {
+        path: "/otherCommon",
+        component: () => import("../views/otherCommon/index.vue"),
+        name: "otherCommon",
+        meta: {
+          title: "批量命令",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+      {
+        path: "/reportData",
+        component: () => import("../views/reportData/index.vue"),
+        name: "reportData",
+        meta: {
+          title: "数据报表",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+      // {
+      //   path: "/photoTotal",
+      //   component: () => import("../views/photoTotal/index.vue"),
+      //   name: "photoTotal",
+      //   meta: {
+      //     title: "图片数据统计",
+      //     icon: "",
+      //     keepAlive: true,
+      //     requiresAuth: true,
+      //   },
+      // },
+      {
+        path: "/aiwork",
+        component: () => import("../views/system/drawPic.vue"),
+        name: "aiwork",
+        meta: {
+          title: "ai绘图",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+      {
+        path: "/weatherIceConfig",
+        component: () => import("../views/system/weatherIceConfig.vue"),
+        name: "weatherIceConfig",
+        meta: {
+          title: "微气象覆冰转发",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+
+      {
+        path: "/echarts",
+        component: () => import("../echartsDemo.vue"),
+        name: "echartsDemo",
+        meta: {
+          title: "echarts图表",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+
+      //气象检测
+      {
+        path: "/weather",
+        component: () => import("../views/iceWeather/weather/index.vue"),
+        name: "weather",
+        meta: {
+          title: "气象检测",
+          keepAlive: true,
+          requiresAuth: true,
+        },
+      },
+      //覆冰
+      {
+        path: "/icing",
+        component: () => import("../views/iceWeather/icing/index.vue"),
+        name: "icing",
+        meta: { title: "覆冰监测", keepAlive: true, requiresAuth: true },
+      },
+      //数据报表
+      {
+        path: "/statisticalReport",
+        component: () => import("../views/statisticalReport/index.vue"),
+        name: "statisticalReport",
+        meta: {
+          title: "统计报表",
+          icon: "",
+          keepAlive: true,
+          requiresAuth: true,
+        },
       },
     ],
   },
-
   {
     path: "/login",
+    name: "login",
     component: () => import("../views/login/index.vue"),
-    meta: { title: "登录" },
+    meta: { title: "登录", noAuth: true }, // 标记为免登录页面
+  },
+  {
+    // 权限页面
+    path: "/permission",
+    component: () =>
+      import(/* webpackChunkName: "permission" */ "../Permission.vue"),
+    meta: { title: "权限测试" },
   },
 ];
 

src/store/cache.js

@@ -0,0 +1,57 @@
+import Vue from "vue";
+
+export default {
+  namespaced: true,
+  state: {
+    caches: [],
+  },
+  actions: {
+    // 添加缓存的路由组件
+    addCache({ state, dispatch }, componentName) {
+      if (Array.isArray(componentName)) {
+        componentName.forEach((item) => {
+          dispatch("addCache", item);
+        });
+        return;
+      }
+
+      const { caches } = state;
+      if (!componentName || caches.includes(componentName)) return;
+
+      caches.push(componentName);
+      console.log("缓存路由组件：", componentName);
+    },
+
+    // 移除缓存的路由组件
+    removeCache({ state, dispatch }, componentName) {
+      if (Array.isArray(componentName)) {
+        componentName.forEach((item) => {
+          dispatch("removeCache", item);
+        });
+        return;
+      }
+
+      const { caches } = state;
+      const index = caches.indexOf(componentName);
+      if (index > -1) {
+        console.log("清除缓存的路由组件：", componentName);
+        return caches.splice(index, 1)[0];
+      }
+    },
+    // 移除缓存的路由组件的实例
+    async removeCacheEntry({ dispatch }, componentName) {
+      const cacheRemoved = await dispatch("removeCache", componentName);
+      if (cacheRemoved) {
+        await Vue.nextTick();
+        dispatch("addCache", componentName);
+      }
+    },
+    // 清除缓存的路由组件的实例
+    clearEntry({ state, dispatch }) {
+      const { caches } = state;
+      caches.slice().forEach((key) => {
+        dispatch("removeCacheEntry", key);
+      });
+    },
+  },
+};

src/store/index.js

@@ -1,6 +1,6 @@
 import Vue from "vue";
 import Vuex from "vuex";
-
+import cacheModule from "./cache";
 Vue.use(Vuex);
 
 export default new Vuex.Store({
@@ -8,21 +8,29 @@ export default new Vuex.Store({
     //用户登录token 存储
     token: "",
     userName: "",
-    userid: "",
+    uid: "",
     role: "",
+    notes: "",
     currentData: "",
     channelId: "",
     termId: "",
     protocol: "",
     cmdId: "",
     channelIdList: [],
+    isRenderTab: true,
+    responseProcessing: false, // 用于防止重复处理相同错误状态的标志
   },
   getters: {
     token: (state) => state.token,
     userName: (state) => state.userName,
     role: (state) => state.role,
+    notes: (state) => state.notes,
+    menuPermission: (state) => state.resources,
   },
   mutations: {
+    setResponseProcessing(state, status) {
+      state.responseProcessing = status;
+    },
     //点击获取的左侧列表
     currentData(state, currentData) {
       state.currentData = currentData;
@@ -63,17 +71,34 @@ export default new Vuex.Store({
     },
     SET_USERINFO(state, val) {
       state.userName = val.userName;
-      state.userid = val.id;
+      state.uid = val.uid;
       state.role = val.role;
+      state.notes = val.notes;
+      if (val.role !== 0) {
+        state.resources = val.resources;
+        const menuArr = val.resources
+          .filter((item) => item.key.includes("/"))
+          .sort((a, b) => a.id - b.id);
+        const btnArr = val.resources
+          .filter((item) => item.key.includes("Btn"))
+          .sort((a, b) => a.id - b.id);
+        localStorage.setItem("menuPermission", JSON.stringify(menuArr));
+        localStorage.setItem("btnPermission", JSON.stringify(btnArr));
+      }
+
       localStorage.setItem("userName", state.userName);
-      localStorage.setItem("userid", state.userid);
+      localStorage.setItem("uid", state.uid);
       localStorage.setItem("role", state.role);
+      localStorage.setItem("notes", state.notes);
     },
     //退出清除locastorge
     REMOVE_INFO(state) {
       localStorage.clear();
     },
+    setIsRenderTab(state, data) {
+      state.isRenderTab = data;
+    },
   },
   actions: {},
-  modules: {},
+  modules: { cache: cacheModule },
 });

src/utils/api/drawApi.js

@@ -0,0 +1,17 @@
+import request from "../request";
+//获取图片
+export function getTestTerminalPhotoListApi(data) {
+  return request({
+    url: "/xymanager/getTestTerminalPhotoList",
+    method: "post",
+    data,
+  });
+}
+//上传坐标
+export function takeAlarmApi(data) {
+  return request({
+    url: "/xymanager/takeAlarm",
+    method: "post",
+    data,
+  });
+}

src/utils/api/iceApi.js

@@ -0,0 +1,142 @@
+import request from "../request";
+//获取装置总数图表
+//郑州左侧树状结构接口
+export function getICEdyTreeList(data) {
+  return request({
+    url: "/xymanager/getdyTreeList",
+    method: "post",
+    data,
+  });
+}
+//查询附带天气
+
+export function weatherJoggle(data) {
+  return request({
+    url: "/xymanager/terminal/listWithWeather",
+    method: "get",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+//查询天气列表
+export function weatherListJoggle(data) {
+  return request({
+    url: "/xymanager/weather/list",
+    method: "get",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+//查询附带覆冰拉力
+
+export function LeadPullJoggle(data) {
+  return request({
+    url: "/xymanager/terminal/listWithLeadPull",
+    method: "get",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+//查询覆冰拉力列表
+export function leadpullsListJoggle(data) {
+  return request({
+    url: "/xymanager/leadpulls/list",
+    method: "get",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+//获取相位码
+export function funccodeJoggle(data) {
+  return request({
+    url: "/xapi/funccode.php",
+    method: "get",
+    params: data,
+
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+
+//导出覆冰数据
+export function exportJoggle(data) {
+  return request({
+    url: "/xymanager/leadpulls/export",
+    method: "get",
+    params: data,
+    responseType: "blob",
+  });
+}
+
+//查询天气装置列表
+export function getWeatherListApi(data) {
+  return request({
+    url: "/xymanager/henan/getWeatherList",
+    method: "get",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+//查询拉力装置点表
+export function getPointListApi(data) {
+  return request({
+    url: "/xymanager/henan/getPointList",
+    method: "get",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+
+//新增微气象转发
+export function addWeatherApi(data) {
+  return request({
+    url: "/xymanager/henan/addWeather",
+    method: "post",
+    data,
+  });
+}
+//新增覆冰转发
+export function addIcePointApi(data) {
+  return request({
+    url: "/xymanager/henan/addPoint",
+    method: "post",
+    data,
+  });
+}
+
+//删除微气象转发
+export function delWeatherApi(data) {
+  return request({
+    url: "/xymanager/henan/delWeather",
+    method: "post",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}
+
+//删除覆冰转发
+export function delPointApi(data) {
+  return request({
+    url: "/xymanager/henan/delPoint",
+    method: "post",
+    params: data,
+    headers: {
+      "Content-Type": "application/x-www-form-urlencoded;charset=UTF-8",
+    },
+  });
+}

src/utils/api/reportApi.js

@@ -0,0 +1,61 @@
+import request from "../request";
+
+//照片统计
+// export function getphotoList(data) {
+//   return request({
+//     url: "/xymanager/terminal/listWithPhoto",
+//     method: "get",
+//     params: data,
+//   });
+// }
+//获取电压-线路-杆塔等信息
+
+export function getSearchInfo(data) {
+  return request({
+    url: "/xymanager/getLineAndGt",
+    method: "post",
+    data,
+  });
+}
+//获取实时图片数据
+export function getphotoApi(data) {
+  return request({
+    url: "/xymanager/getPhotoList",
+    method: "post",
+    data,
+  });
+}
+//获取心跳历史
+export function getIpList(data) {
+  return request({
+    url: "/xymanager/terminal/heartbeat",
+    method: "get",
+    params: data,
+  });
+}
+
+//获取装置状态统表
+export function gettermAllList(data) {
+  return request({
+    url: "/xymanager/terminal/listWithAll",
+    method: "get",
+    params: data,
+  });
+}
+
+//规约版本
+export function getProtocolList(data) {
+  return request({
+    url: "/xymanager/getProtocolList",
+    method: "get",
+    params: data,
+  });
+}
+//获取活动列表
+export function getActivityApi(data) {
+  return request({
+    url: "/xymanager/activity/listAll",
+    method: "get",
+    params: data,
+  });
+}

src/utils/event-bus.js

@@ -0,0 +1,4 @@
+import Vue from 'vue'
+
+const EventBus = new Vue()
+export default EventBus

src/utils/request.js

@@ -1,61 +1,55 @@
 import axios from "axios";
 import { MessageBox, Message } from "element-ui";
 import router from "../router/index";
-
+import store from "../store/index"; // 确保路径正确
 const service = axios.create({
   // process.env.NODE_ENV === 'development' 来判断是否开发环境
   // easy-mock服务挂了，暂时不使用了
   // baseURL: '',
   // timeout: 5000
   baseURL: "api", //把原来的项目地址，改成api，解决跨域问题
-  timeout: 30000,
+  timeout: 600000,
 });
 
 service.interceptors.request.use((config) => {
   if (localStorage.getItem("token")) {
-    config.headers.sessionId = localStorage.getItem("token");
+    // console.log("aaaaaaaaaaaaaa", localStorage.getItem("token"));
+    config.headers.Authorization = localStorage.getItem("token");
   }
   return config;
 });
 service.interceptors.response.use(
-  // (response) => {
-  //   if (response.status === 200) {
-  //     return response.data;
-  //   } else {
-  //     Promise.reject();
-  //   }
-  // },
-  // (error) => {
-  //   console.log(error);
-  //   return Promise.reject();
-  // }
-
   (response) => {
     const res = response.data;
-    if (res.code !== 200) {
-      // Message({
-      //   showClose: true,
-      //   message: res.msg || "Error",
-      //   type: "error",
-      //   duration: 5 * 1000,
-      // });
+    if (res.code !== 200 && !store.state.responseProcessing) {
+      store.commit("setResponseProcessing", true); // 设置状态为处理中
+
       if (res.code === 401) {
-        Message({ message: res.msg, type: "error", duration: 1500 });
+        Message({
+          showClose: true,
+          message: res.msg,
+          type: "error",
+          duration: 1500,
+        });
+        localStorage.removeItem("token");
         router.push("/login");
-      }
-
-      if (res.code === 400) {
-        Message({ message: res.msg, type: "error", duration: 1500 });
-      }
-
-      if (res.code === 500) {
+      } else if (res.code === 400) {
         Message({
           showClose: true,
-          message: 服务器错误(500),
+          message: res.msg,
+          type: "error",
+          duration: 1500,
+        });
+      } else if (res.code === 500) {
+        Message({
+          showClose: true,
+          message: res.msg || "Error",
           type: "error",
           duration: 1500,
         });
       }
+
+      store.commit("setResponseProcessing", false); // 重置状态
       return Promise.reject(new Error(res.msg || "Error"));
     } else {
       return res;

src/views/alarmHandling/index.vue

@@ -364,6 +364,7 @@ import {
 import morePicPreveiw from "../realTimeMonitor/components/morePicPreveiw";
 import moment from "moment";
 export default {
+  name: "alarmHandling",
   components: {
     morePicPreveiw,
   },
@@ -950,7 +951,7 @@ export default {
         alias: val.alias,
         channnelname: val.channnelName,
         photoTime: val.alarmTime,
-        termid: val.id,
+        termid: val.termId,
         channelid: val.channelId,
       };
       this.$refs.morePicPreveiw_ref.display(currentPrams);
@@ -1241,6 +1242,7 @@ export default {
           bottom: 0px;
           background: rgba(0, 0, 0, 0.5);
           width: calc(100% - 12px);
+          z-index: 3;
           .alarmInfo {
             color: #fff;
           }

src/views/cameraChannel/index.vue

@@ -100,6 +100,7 @@ import addChannelDialog from "./components/addChannelDialog.vue";
 import { getChannelListapi, deleteChannelapi } from "@/utils/api/index";
 
 export default {
+  name: "cameraChannel",
   components: {
     addChannelDialog,
   },

src/views/devicePhotoSchedule/components/bdSchedule.vue

@@ -249,6 +249,10 @@ export default {
             name: "act",
             value: "schedule",
           },
+          {
+            name: "udp",
+            value: 1,
+          },
           {
             name: "flag",
             value: 1,
@@ -269,12 +273,21 @@ export default {
             .add(node.setNum, "minute")
             .format("YYYY-MM-DD HH:mm:ss");
 
-          var Etime = this.$moment(scheduleTimeList[i].endTime, "HH:mm")
-            .add(node.setNum, "minute")
-            .format("YYYY-MM-DD HH:mm:ss");
+          // var Etime = this.$moment(scheduleTimeList[i].endTime, "HH:mm")
+          //   .add(node.setNum, "minute")
+          //   .format("YYYY-MM-DD HH:mm:ss");
+          //结束时间不添加偏移量
+          var Etime = this.$moment(scheduleTimeList[i].endTime, "HH:mm").format(
+            "YYYY-MM-DD HH:mm:ss"
+          );
           var spanTime = scheduleTimeList[i].timeSpan;
           console.log(Stime, Etime, spanTime);
-          if (node.protocol == "65283" || node.protocol == "65285") {
+          if (
+            node.protocol == "65283" ||
+            node.protocol == "65285" ||
+            node.protocol == "65290" ||
+            node.protocol == "65298"
+          ) {
             //湖南 河南
             console.log("湖南,河南", scheduleTimeList.length);
 
@@ -445,7 +458,7 @@ export default {
       }
     }
     .treeDevice {
-      background-color: #169e8c;
+      //background-color: #169e8c;
       height: 366px;
       // overflow: auto;
       display: flex;

src/views/devicePhotoSchedule/components/setdevice.vue

@@ -346,9 +346,10 @@ export default {
             var Stime = moment(this.ruleSchedule[j].startTime)
               .add(this.allCheckNode[i].offsetNum, "minute")
               .format();
-            var Etime = moment(this.ruleSchedule[j].endTime)
-              .add(this.allCheckNode[i].offsetNum, "minute")
-              .format();
+            // var Etime = moment(this.ruleSchedule[j].endTime)
+            //   .add(this.allCheckNode[i].offsetNum, "minute")
+            //   .format();
+            var Etime = moment(this.ruleSchedule[j].endTime).format();
             var lastETime = moment(this.ruleSchedule[j].endTime).format();
 
             var spanTime = this.ruleSchedule[j].span;

src/views/devicePhotoSchedule/components/setdevice_yh.vue

@@ -235,10 +235,11 @@ export default {
               "minute"
             );
 
-            var Etime = this.$moment(this.rulesList[j].endTime).add(
-              this.allCheckNode[i].offsetNum,
-              "minute"
-            );
+            // var Etime = this.$moment(this.rulesList[j].endTime).add(
+            //   this.allCheckNode[i].offsetNum,
+            //   "minute"
+            // );
+            var Etime = this.$moment(this.rulesList[j].endTime);
 
             var spanTime = this.rulesList[j].span;
             console.log(Stime, Etime, spanTime);

src/views/devicePhotoSchedule/index.vue

@@ -96,6 +96,7 @@ import adddeviceDialog from "./components/adddeviceDialog.vue";
 import bdSchedule from "./components/bdSchedule.vue";
 
 export default {
+  name: "devicePhotoSchedule",
   components: {
     adddeviceDialog,
     bdSchedule,

src/views/dyInformation/components/addDyDialog.vue

@@ -0,0 +1,129 @@
+<template>
+  <el-dialog
+    class="addDyDialog"
+    :title="title"
+    :visible.sync="isShow"
+    :close-on-click-modal="false"
+    width="470px"
+  >
+    <el-form
+      label-position="left"
+      ref="formInfo"
+      label-width="100px"
+      :rules="rules"
+      :model="formdata"
+    >
+      <el-form-item label="电压名称：" prop="name">
+        <el-input v-model="formdata.name" autocomplete="off"></el-input>
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="isShow = false">取 消</el-button>
+      <el-button type="primary" @click="submitForm()">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+import { addDyJoggle, updateDyJoggle } from "@/utils/api/index";
+
+export default {
+  props: {
+    title: String,
+  },
+  data() {
+    return {
+      isShow: false,
+
+      formdata: {},
+      rules: {
+        name: [{ required: true, message: "请输入电压名称", trigger: "blur" }],
+      },
+    };
+  },
+  mounted() {},
+  methods: {
+    //判断
+    getdataform(val) {
+      if (val == null) {
+        return (this.formdata = {});
+      }
+      //this.formdata = val;
+      this.formdata = JSON.parse(JSON.stringify(val));
+    },
+    // 保存确定操作
+    submitForm() {
+      this.$refs.formInfo.validate((valid) => {
+        if (valid) {
+          if (this.title == "新增") {
+            this.$set(this.formdata, "dyValue", "220");
+            addDyJoggle(this.formdata)
+              .then((res) => {
+                this.isShow = false;
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: "添加成功",
+                  type: "success",
+                });
+                this.$parent.deviceList();
+              })
+              .catch((err) => {
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: "添加失败",
+                  type: "error",
+                });
+              });
+          } else {
+            console.log(this.formdata);
+            updateDyJoggle(this.formdata)
+              .then((res) => {
+                this.isShow = false;
+                //this.$message.success("修改成功");
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: "修改成功",
+                  type: "success",
+                });
+                this.$parent.deviceList();
+              })
+              .catch((err) => {
+                //this.$message.error("修改失败");
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: "修改失败",
+                  type: "error",
+                });
+              });
+          }
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    display() {
+      this.isShow = true;
+    },
+    hide() {
+      this.isShow = false;
+    },
+  },
+};
+</script>
+<style lang="less">
+.addDyDialog {
+  .el-select {
+    width: 100%;
+  }
+  .el-input-number {
+    width: 100%;
+  }
+  .el-input-number .el-input__inner {
+    text-align: left;
+  }
+}
+</style>

src/views/dyInformation/index.vue

@@ -0,0 +1,271 @@
+<template>
+  <div class="dyInfoBox">
+    <div class="deviceBox">
+      <div class="deviceBtnGroup">
+        <h4>电压信息管理</h4>
+        <el-button
+          type="primary"
+          icon="el-icon-plus"
+          @click.native.stop="handleAdddevice()"
+          >新增</el-button
+        >
+      </div>
+      <div class="searchBox">
+        <el-form :inline="true" :model="formdata" class="demo-form-inline">
+          <el-form-item>
+            <el-input
+              v-model="formdata.search"
+              placeholder="请输入电压"
+              clearable
+            ></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="onSubmit">查询</el-button>
+            <el-button type="primary" @click="onReset">重置</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="deviceTable">
+        <el-table
+          ref="multipleTable"
+          :data="tableDate"
+          tooltip-effect="dark"
+          stripe
+          style="width: 100%"
+          height="calc(100% - 40px)"
+          @selection-change="handleSelectionChange"
+          @row-click="handleRowClick"
+          v-loading="loading"
+          highlight-current-row
+          :row-key="getRowKeys"
+        >
+          <template slot="empty">
+            <el-empty :image-size="160" description="暂无数据"></el-empty>
+          </template>
+          <el-table-column prop="name" label="电压等级" show-overflow-tooltip>
+            <template slot-scope="scope">
+              {{ scope.row.name }}
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="createTime"
+            label="创建时间"
+            show-overflow-tooltip
+          >
+            <template slot-scope="scope">
+              {{ scope.row.createTime }}
+            </template>
+          </el-table-column>
+
+          <el-table-column fixed="right" label="操作" width="200">
+            <template slot-scope="scope">
+              <el-button
+                @click.native.stop="handleResive(scope.row)"
+                type="text"
+                >修改</el-button
+              >
+              <el-button
+                type="text"
+                class="deleteText"
+                @click.native.stop="handleDelete(scope.row)"
+                >删除</el-button
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="pageNation">
+          <el-pagination
+            @current-change="handleCurrentChange"
+            @size-change="handleSizeChange"
+            :current-page="page"
+            :page-size="pageSize"
+            layout="sizes, prev, pager, next, jumper,total"
+            :total="total"
+            background
+          >
+          </el-pagination>
+        </div>
+      </div>
+    </div>
+    <!-- 新增电压 -->
+    <addDyDialog :title="title" ref="addDialogref"></addDyDialog>
+  </div>
+</template>
+<script>
+import { getDyListJoggle, deleteDyJoggle } from "@/utils/api/index";
+import addDyDialog from "./components/addDyDialog.vue";
+
+export default {
+  name: "dyInformation",
+  components: {
+    addDyDialog,
+  },
+  data() {
+    return {
+      title: "", //弹窗标题
+      tableDate: [],
+      //multipleSelection: [], //获取当前选中
+      page: 1, // 当前页数
+      pageSize: 20, // 每页数量
+      total: 0, //总条数
+      loading: true,
+
+      formdata: {
+        search: "",
+      },
+    };
+  },
+  created() {},
+  mounted() {
+    this.deviceList();
+  },
+
+  methods: {
+    getRowKeys(row) {
+      return row.id;
+    },
+
+    //查询
+    onSubmit() {
+      this.page = 1;
+      this.deviceList();
+    },
+    //重置
+    onReset() {
+      this.formdata = {
+        search: "",
+      };
+      this.page = 1;
+      this.pageSize = 20;
+      this.deviceList();
+    },
+    //获取数据列表
+    deviceList() {
+      this.loading = true;
+      this.$set(this.formdata, "pageindex", this.page);
+      this.$set(this.formdata, "pagesize", this.pageSize);
+      getDyListJoggle(this.formdata)
+        .then((res) => {
+          this.tableDate = res.data.list;
+          this.total = res.data.total;
+          this.loading = false;
+        })
+        .catch((err) => {});
+    },
+    //点击行选中
+    handleRowClick(row, column, event) {
+      this.$refs.multipleTable.toggleRowSelection(row);
+    },
+    //获取选中的行
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+
+    // 新建
+    handleAdddevice() {
+      this.title = "新增";
+      this.$refs.addDialogref.display();
+      this.$refs.addDialogref.getdataform(null);
+    },
+
+    //修改
+    handleResive(data) {
+      this.title = "修改";
+      this.$refs.addDialogref.display();
+      this.$refs.addDialogref.getdataform(data);
+    },
+
+    //删除数据
+    handleDelete(data) {
+      let deleteArr = [];
+      deleteArr.push(data.id);
+      console.log("aaaaaaaaaaaaaaaaaaaaaaaaaaa", deleteArr);
+      this.$confirm("确定要删除记录吗,同时删除关联关系?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          deleteDyJoggle({ list: deleteArr }).then((res) => {
+            if (res.code == 200) {
+              this.$message({
+                duration: 1500,
+                showClose: true,
+                type: "success",
+                message: "删除成功!",
+              });
+              this.deviceList(); //刷新
+            } else {
+              this.$message({
+                duration: 1500,
+                showClose: true,
+                type: "error",
+                message: "删除失败!",
+              });
+            }
+          });
+        })
+        .catch(() => {
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            type: "info",
+            message: "已取消删除",
+          });
+        });
+    },
+    //点击分页
+    handleCurrentChange(val) {
+      this.page = val;
+      this.deviceList();
+    },
+    //每页条数
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.deviceList();
+    },
+  },
+};
+</script>
+<style lang="less">
+.dyInfoBox {
+  width: calc(100% - 24px);
+  height: calc(100% - 24px);
+  padding: 12px 12px;
+  background: #fff;
+
+  .deviceBox {
+    border: 1px solid #dddddd;
+    height: calc(100% - 24px);
+    padding: 12px;
+    border-radius: 4px;
+    .searchBox {
+      margin-top: 8px;
+      .ml10 {
+        margin-left: 10px;
+      }
+      .el-form {
+        .dybox {
+          .el-form-item__content {
+            width: 120px;
+          }
+        }
+        .xlbox {
+          .el-form-item__content {
+            width: 160px;
+          }
+        }
+      }
+    }
+  }
+  .deviceBtnGroup {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+  .deviceTable {
+    height: calc(100% - 94px);
+    //background: #fcc;
+  }
+}
+</style>

src/views/homePage/index.vue

@@ -46,7 +46,7 @@
         <div id="echart2" class="chartClass" v-loading="pieloading"></div>
       </el-card>
     </div>
-    <div class="echart-top">
+    <div class="echart-top" v-if="notes !== '覆冰用户使用'">
       <el-card class="box-card" v-loading="barloading">
         <h3>7天告警数量统计</h3>
         <div class="dateBox">
@@ -98,16 +98,30 @@
           tooltip-effect="dark"
           height="calc(100% - 54px)"
         >
-          <el-table-column prop="lineName" label="线路名称"></el-table-column>
-          <el-table-column prop="towerName" label="杆塔名称"></el-table-column>
-          <el-table-column prop="cmdId" label="装置ID"></el-table-column>
+          <el-table-column
+            prop="lineName"
+            label="线路名称"
+            min-width="120"
+          ></el-table-column>
+          <el-table-column
+            prop="towerName"
+            label="杆塔名称"
+            min-width="120"
+          ></el-table-column>
+          <el-table-column
+            prop="cmdId"
+            label="装置ID"
+            min-width="120"
+          ></el-table-column>
           <el-table-column
             prop="hearttime"
             label="最新心跳时间"
+            min-width="120"
           ></el-table-column>
           <el-table-column
             prop="pictime"
             label="最新图片拍照时间"
+            min-width="120"
           ></el-table-column>
           <el-table-column prop="isonline" label="是否在线"></el-table-column>
           <el-table-column prop="longitude" label="经度"></el-table-column>
@@ -126,7 +140,7 @@ import {
   getOnlineTerminalListExcel,
 } from "@/utils/api/index";
 export default {
-  name: "",
+  name: "stritl",
   data() {
     return {
       termDataNum: "", //总数
@@ -151,6 +165,7 @@ export default {
       onLineData: [],
       exportLoading: false,
       paramsLineVal: "",
+      notes: localStorage.getItem("notes"),
     };
   },
   created() {
@@ -177,6 +192,9 @@ export default {
   methods: {
     //查看在线列表
     handleLook(val) {
+      if (this.notes == "覆冰用户使用") {
+        return;
+      }
       console.log(val);
       this.paramsLineVal = val;
       this.dialogTableVisible = true;
@@ -195,7 +213,8 @@ export default {
     //导出
     handleExport(val) {
       console.log(val);
-      window.location.href = "/api/api/getOnlineTerminalListExcel?type=" + val;
+      window.location.href =
+        "/api/xymanager/getOnlineTerminalListExcel?type=" + val;
     },
     // 隐患数量统计
     changedate() {
@@ -225,6 +244,13 @@ export default {
         .then((res) => {
           console.log(res);
           this.termDataNum = res.data;
+          // this.termDataNum = {
+          //   totalNum: 2185,
+          //   onlineNum: 2165,
+          //   offlineNum: 20,
+          //   onlinePercent: 0.9908,
+          //   offlinePercent: 0.0092,
+          // };
           this.numloading = false;
           this.pieloading = false;
           this.getEchart2();
@@ -477,11 +503,11 @@ export default {
 </script>
 <style lang="less">
 .stritleEchartsPage {
-  height: calc(100% - 32px);
-  padding: 16px;
+  height: calc(100% - 24px);
+  padding: 12px;
   display: flex;
   flex-direction: column;
-  justify-content: space-around;
+  justify-content: space-between;
   .echart-top {
     display: flex;
     height: 48%;

src/views/iceWeather/components/leftTree.vue

@@ -0,0 +1,291 @@
+<template>
+  <div class="leftTreeBox">
+    <div class="companyBox">
+      <span class="spanLabel"
+        ><i class="el-icon-office-building"></i>公司：</span
+      >
+      <el-select v-model="companyVal" placeholder="请选择公司">
+        <!-- <el-option label="捕鱼达人" value="budr"></el-option> -->
+        <el-option
+          v-for="item in companyOptions"
+          :key="item.value"
+          :label="item.label"
+          :value="item.value"
+          @click.native="handleClick(item.value)"
+        >
+        </el-option>
+      </el-select>
+    </div>
+    <el-divider></el-divider>
+    <div class="searchBar">
+      <el-input
+        placeholder="输入关键字进行过滤"
+        v-model="filterText"
+        prefix-icon="el-icon-search"
+      >
+      </el-input>
+    </div>
+    <el-tree
+      ref="tree"
+      v-loading="treeLoading"
+      :data="lineTreeData"
+      :props="defaultProps"
+      node-key="id"
+      highlight-current
+      :default-expanded-keys="[9]"
+      :expand-on-click-node="false"
+      :filter-node-method="filterNode"
+      :current-node-key="currentNodekey"
+      @node-click="handleNodeClick"
+    >
+      <span class="custom-tree-node" slot-scope="{ node, data }">
+        <span v-if="node.level === 1">
+          <span class="iconfont icon-dianli" style="margin-right: 6px"></span>
+          <span>{{ node.label }} </span>
+          <!-- <span>捕鱼达人</span> -->
+        </span>
+        <span v-else-if="node.level === 2">
+          <span class="iconfont icon-dianlihangye" style="margin-right: 6px">
+          </span>
+          <span
+            >{{ node.label }}
+            <span class="num">({{ data.list.length }}) </span></span
+          >
+        </span>
+        <span v-else>
+          <span
+            class="iconfont icon-shexiangtoulixian"
+            v-if="data.onlinestatus == 0"
+            :class="data.onlinestatus == 0 ? 'disconnect' : ''"
+            style="margin-right: 6px"
+          ></span>
+          <span
+            class="iconfont icon-shexiangtou-lixian"
+            v-else
+            :class="data.onlinestatus == 0 ? 'disconnect' : ''"
+            style="margin-right: 6px"
+          ></span>
+          <span
+            :id="data.id"
+            :class="data.onlinestatus == 0 ? 'disconnect' : ''"
+            >{{ node.label }}</span
+          >
+        </span>
+      </span>
+    </el-tree>
+  </div>
+</template>
+<script>
+import { getICEdyTreeList } from "@/utils/api/iceApi";
+export default {
+  data() {
+    return {
+      treeLoading: false,
+      companyVal: "", //公司，
+      companyOptions: [
+        {
+          value: "bydr",
+          label: "捕鱼达人",
+        },
+      ],
+      filterText: "", //查询字段过滤
+      lineTreeData: [],
+      defaultExpandedKeys: [], //默认展开
+      collapsedKeys: [], // 收起节点的key数组
+      defaultProps: {
+        //指定参数格式回显数据
+        children: "list",
+        label: "name",
+      },
+      icecurrentData: {}, //当前选中的数据
+      currentNodekey: "", //默认选中的节点树,
+      role: "",
+    };
+  },
+  watch: {
+    filterText(newVal) {
+      this.handleFilter(); // 当 filterText 发生变化时执行过滤操作
+    },
+  },
+  created() {
+    this.getLineTreeList(); //获取树状图
+    this.companyVal = this.companyOptions[0].value;
+  },
+  methods: {
+    handleClick(val) {
+      console.log(val);
+    },
+    handleFilter() {
+      // 在输入框输入完成后的500毫秒执行过滤节点方法
+      setTimeout(() => {
+        this.$refs.tree.filter(this.filterText);
+      }, 500);
+    },
+    //树状图搜索
+    filterNode(value, data, node) {
+      // 如果什么都没填全部匹配全部返回
+      if (!value) return true;
+      this.searchName = data.name + data.cmdid;
+      //console.log(this.searchName);
+      // 如果传入的value和data中的label相同，匹配成功
+      if (this.searchName.indexOf(value) !== -1) {
+        return true;
+      }
+    },
+    //获取树状图列表
+    getLineTreeList() {
+      this.role = localStorage.getItem("role");
+      console.log(this.role);
+      const menuName = this.$route.path;
+      console.log(menuName);
+      this.treeLoading = true;
+      let devtypeList;
+      //微气象
+      if (menuName == "/weather") {
+        devtypeList = [3, 23, 123];
+      }
+      //覆冰拉力
+      if (menuName == "/icing") {
+        devtypeList = [2, 23, 123];
+      }
+
+      console.log(devtypeList);
+      getICEdyTreeList({
+        type: -1,
+        devtype: devtypeList,
+      })
+        .then((res) => {
+          this.lineTreeData = [];
+          this.lineTreeData = res.data.list;
+          this.treeLoading = false;
+          this.icecurrentData = JSON.parse(
+            localStorage.getItem("icecurrentData")
+          );
+          this.lineTreeData.forEach((node) => {
+            if (node.list) {
+              node.list.forEach((child) => {
+                this.defaultExpandedKeys.push(child.id);
+              });
+            } else {
+              this.defaultExpandedKeys.push(node.id);
+            }
+          });
+          this.defaultExpandedKeys =
+            JSON.parse(localStorage.getItem("defaultKey")) !== null
+              ? JSON.parse(localStorage.getItem("defaultKey"))
+              : this.defaultExpandedKeys; //获取保存的defaultKey ;
+
+          //console.log(this.defaultExpandedKeys);
+          if (this.lineTreeData[0].list[0].list.length > 0) {
+          }
+          if (
+            this.icecurrentData !== null &&
+            Object.keys(this.icecurrentData).length !== 0
+          ) {
+            this.currentNodekey = this.icecurrentData.id;
+            this.handleNodeClick(this.icecurrentData);
+          } else {
+            this.icecurrentData = this.lineTreeData[0]; //第一个选中的数据
+            this.currentNodekey = this.lineTreeData[0].id; //第一个数据
+            this.handleNodeClick(this.icecurrentData);
+          }
+          this.$nextTick(() => {
+            this.$refs.tree.setCurrentKey(this.currentNodekey); //一定要加这个选中了否则样式没有出来
+          });
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    //点击当前选中的treenode
+    handleNodeClick(data) {
+      this.icecurrentData = data;
+      this.$parent.getCurrentData(this.icecurrentData);
+    },
+  },
+};
+</script>
+<style lang="less">
+.leftTreeBox {
+  width: 260px;
+  display: flex;
+  flex-direction: column;
+  padding: 16px 0;
+  .companyBox {
+    display: flex;
+    width: 94%;
+    margin: 0 auto;
+    margin-bottom: 8px;
+    align-items: center;
+    .spanLabel {
+      font-size: 14px;
+      width: 96px;
+    }
+  }
+  .el-divider--horizontal {
+    margin: 0px 0px 8px 0px;
+  }
+  .searchBar {
+    width: 94%;
+    margin: 0 auto;
+    margin-bottom: 8px;
+  }
+  .el-tree {
+    overflow-y: scroll;
+    overflow-x: hidden;
+    .el-tree-node__content {
+      height: 32px;
+      font-size: 12px;
+    }
+    .custom-tree-node {
+      color: #333;
+      overflow: hidden;
+      span {
+        display: flex;
+        display: inline-table;
+        overflow: hidden;
+        align-items: center;
+      }
+      .num {
+        color: #1c77ac;
+      }
+    }
+  }
+  .disconnect {
+    color: #d3d3d3;
+  }
+
+  .el-tree--highlight-current
+    .el-tree-node.is-current
+    > .el-tree-node__content {
+    // 设置颜色
+    color: #fff;
+    background: #169e8c;
+    .custom-tree-node {
+      color: #fff;
+      //overflow: hidden;
+      span {
+        display: flex;
+        //overflow: hidden;
+        align-items: center;
+        .num {
+          color: #fff;
+        }
+        .iconfont {
+          //width: 30px;
+          display: inline-table;
+        }
+      }
+    }
+  }
+}
+.el-table thead {
+  color: #333;
+  th {
+    font-weight: 400;
+  }
+}
+.el-table {
+  color: #666;
+}
+</style>

src/views/iceWeather/weather/indexywbak.vue

@@ -0,0 +1,914 @@
+<template>
+  <div class="weatherBox">
+    <div class="weatherContain">
+      <leftTree ref="sideTree"></leftTree>
+      <div class="rightTable">
+        <div class="dataBox">
+          <div class="fatherTableShowBox" v-if="!childFlag">
+            <el-table
+              :data="tableData"
+              style="width: 100%"
+              v-loading="loading"
+              height="calc(100% - 40px)"
+            >
+              <el-table-column prop="lineName" label="线路"> </el-table-column>
+              <el-table-column prop="towerName" label="杆塔"> </el-table-column>
+              <el-table-column prop="cmdid" label="终端"> </el-table-column>
+
+              <el-table-column prop="updateTime" label="时间">
+                <template slot-scope="scope">
+                  <span v-if="scope.row.lastWeathers !== null">
+                    {{
+                      $moment(scope.row.lastWeathers.updateTime * 1000).format(
+                        "YYYY-MM-DD HH:mm:ss"
+                      )
+                    }}</span
+                  >
+                  <span v-else> - </span>
+                </template>
+              </el-table-column>
+              <el-table-column label="温度(℃)">
+                <template slot-scope="scope">
+                  <span v-if="scope.row.lastWeathers !== null">{{
+                    scope.row.lastWeathers.airTemperature.toFixed(1)
+                  }}</span>
+                  <span v-else> - </span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="humidity" label="湿度(%RH)">
+                <template slot-scope="scope">
+                  <span v-if="scope.row.lastWeathers !== null"
+                    ><span
+                      v-if="
+                        scope.row.lastWeathers.humidity != 65535 &&
+                        scope.row.lastWeathers.humidity != 255
+                      "
+                    >
+                      {{ scope.row.lastWeathers.humidity.toFixed(1) }}</span
+                    ><span v-else> - </span></span
+                  >
+                  <span v-else> - </span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="maxWindSpeed" label="最大风速(m/s)">
+                <template slot-scope="scope">
+                  <span v-if="scope.row.lastWeathers !== null">{{
+                    scope.row.lastWeathers.maxWindSpeed.toFixed(1)
+                  }}</span>
+                  <span v-else> - </span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="windDirection" label="瞬时风向(°)">
+                <template slot-scope="scope">
+                  <span
+                    v-if="
+                      scope.row.lastWeathers !== null &&
+                      scope.row.lastWeathers.windDirection !== null
+                    "
+                    >{{ scope.row.lastWeathers.windDirection.toFixed(1) }}</span
+                  >
+                  <span v-else> - </span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="precipitation" label="雨量(mm/hour)">
+                <template slot-scope="scope">
+                  <span
+                    v-if="
+                      scope.row.lastWeathers !== null &&
+                      scope.row.lastWeathers.precipitation != 255
+                    "
+                    >{{ scope.row.lastWeathers.precipitation.toFixed(1) }}</span
+                  >
+                  <span v-else> - </span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="airPressure" label="气压(hPa(百帕))">
+                <template slot-scope="scope">
+                  <span
+                    v-if="
+                      scope.row.lastWeathers !== null &&
+                      scope.row.lastWeathers.airPressure != 255
+                    "
+                    >{{ scope.row.lastWeathers.airPressure.toFixed(1) }}</span
+                  >
+                  <span v-else> - </span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="radiationIntensity" label="日照(W/m2)">
+                <template slot-scope="scope">
+                  <span v-if="scope.row.lastWeathers !== null"
+                    ><span
+                      v-if="
+                        scope.row.lastWeathers.radiationIntensity != 255 &&
+                        scope.row.lastWeathers.radiationIntensity != 65535
+                      "
+                    >
+                      {{
+                        scope.row.lastWeathers.radiationIntensity.toFixed(0)
+                      }}</span
+                    ><span v-else> - </span></span
+                  >
+                  <span v-else> - </span>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作">
+                <template slot-scope="scope">
+                  <el-button
+                    type="text"
+                    @click="moreDataClick(scope.row)"
+                    v-if="scope.row.lastWeathers !== null"
+                    >更多历史数据</el-button
+                  >
+                  <span v-else> 没有数据</span>
+                </template>
+              </el-table-column>
+            </el-table>
+            <div class="pageNation">
+              <el-pagination
+                @current-change="handleCurrentChange"
+                @size-change="handleSizeChange"
+                :current-page="page"
+                :page-size="pageSize"
+                layout="sizes, prev, pager, next, jumper,total"
+                :total="total"
+              >
+              </el-pagination>
+            </div>
+          </div>
+          <div class="childBox" v-else>
+            <div class="searchBox" ref="searchref">
+              <el-form
+                :inline="true"
+                :model="formdata"
+                class="demo-form-inline"
+              >
+                <el-form-item label="开始日期">
+                  <el-date-picker
+                    v-model="formdata.starttime"
+                    type="date"
+                    placeholder="开始日期"
+                  >
+                  </el-date-picker>
+                </el-form-item>
+                <el-form-item label="结束日期">
+                  <el-date-picker
+                    @change="changedate"
+                    v-model="formdata.endtime"
+                    type="date"
+                    placeholder="结束日期"
+                    class="ml10"
+                  >
+                  </el-date-picker>
+                </el-form-item>
+                <el-form-item>
+                  <el-button type="primary" @click="onSubmit">查询</el-button>
+                </el-form-item>
+              </el-form>
+            </div>
+            <div class="termalBox">
+              <p>
+                <span class="text"
+                  >线路:{{ childMsg.lineName || childMsg.lineName }}</span
+                >
+                <span class="text"
+                  >杆塔:{{ childMsg.towerName || childMsg.name }}</span
+                >
+                <span class="text">终端:{{ childMsg.cmdid }}</span>
+              </p>
+              <div class="gropBtn">
+                <el-button type="text" @click="onWdLine" icon="el-icon-odometer"
+                  >温度趋势</el-button
+                >
+                <el-button
+                  type="text"
+                  @click="onSdLine"
+                  icon="el-icon-heavy-rain"
+                  >湿度趋势</el-button
+                >
+              </div>
+            </div>
+            <!-- <div class="echartsBox">
+              <div class="btnbox">
+                <el-button type="primary" @click="onWdLine"
+                  >温度变化趋势</el-button
+                >
+                <el-button type="primary" @click="onSdLine"
+                  >湿度变化趋势</el-button
+                >
+                <el-button type="primary" @click="onHidden">隐藏图表</el-button>
+              </div>
+              <div id="wDechart" class="chartClass" v-show="wdFlag"></div>
+              <div id="sDechart" class="chartClass" v-show="sdFlag"></div>
+            </div> -->
+
+            <div class="childTableShowBox">
+              <el-table
+                :data="childTableDate"
+                style="width: 100%"
+                v-loading="loading"
+                height="calc(100% - 2px)"
+              >
+                <el-table-column prop="updateTime" label="时间" width="138px">
+                  <template slot-scope="scope">
+                    <span v-if="scope.row.updateTime">
+                      {{
+                        $moment(scope.row.updateTime * 1000).format(
+                          "YYYY-MM-DD HH:mm:ss"
+                        )
+                      }}</span
+                    >
+                    <span v-else> - </span>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="airTemperature" label="温度(℃)">
+                  <template slot-scope="scope">
+                    <span
+                      v-if="
+                        scope.row.airTemperature !== null &&
+                        scope.row.airTemperature != 255
+                      "
+                      >{{ scope.row.airTemperature.toFixed(1) }}</span
+                    >
+                    <span v-else> - </span>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="humidity" label="湿度(%RH)">
+                  <template slot-scope="scope">
+                    <span
+                      v-if="
+                        scope.row.humidity !== null && scope.row.humidity != 255
+                      "
+                      >{{ scope.row.humidity.toFixed(1) }}</span
+                    >
+                    <span v-else> - </span>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="maxWindSpeed" label="瞬时风速(m/s)">
+                  <template slot-scope="scope">
+                    <span
+                      v-if="
+                        scope.row.maxWindSpeed !== null &&
+                        scope.row.maxWindSpeed != 255
+                      "
+                      >{{ scope.row.maxWindSpeed.toFixed(1) }}</span
+                    >
+                    <span v-else> - </span>
+                  </template></el-table-column
+                >
+                <el-table-column prop="windDirection" label="瞬时风向(°)">
+                  <template slot-scope="scope">
+                    <span
+                      v-if="
+                        scope.row.windDirection !== null &&
+                        scope.row.windDirection != 255
+                      "
+                      >{{ scope.row.windDirection.toFixed(1) }}</span
+                    >
+                    <span v-else> - </span>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="precipitation" label="雨量(mm/hour)">
+                  <template slot-scope="scope">
+                    <span
+                      v-if="
+                        scope.row.precipitation !== null &&
+                        scope.row.precipitation != 255
+                      "
+                      >{{ scope.row.precipitation.toFixed(1) }}</span
+                    >
+                    <span v-else> - </span>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="airPressure" label="气压(hPa(百帕))">
+                  <template slot-scope="scope">
+                    <span
+                      v-if="
+                        scope.row.airPressure !== null &&
+                        scope.row.airPressure != 255
+                      "
+                      >{{ scope.row.airPressure.toFixed(1) }}</span
+                    >
+                    <span v-else> - </span>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="radiationIntensity" label="日照(W/m2)">
+                  <template slot-scope="scope">
+                    <span
+                      v-if="
+                        scope.row.radiationIntensity !== null &&
+                        scope.row.radiationIntensity != 255
+                      "
+                      >{{ scope.row.radiationIntensity.toFixed(1) }}</span
+                    >
+                    <span v-else> - </span>
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  prop="avgWindDir1min"
+                  label="1分钟平均风速(m/s)"
+                ></el-table-column>
+                <el-table-column
+                  prop="avgWindSpeed1min"
+                  label="1分钟平均风向(°)"
+                >
+                  <template slot-scope="scope">
+                    <span
+                      v-if="
+                        scope.row.avgWindSpeed1min !== null &&
+                        scope.row.avgWindSpeed1min != 255
+                      "
+                      >{{ scope.row.avgWindSpeed1min.toFixed(1) }}</span
+                    >
+                    <span v-else> - </span>
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  prop="avgWindSpeed10min"
+                  label="10分钟平均风速(m/s)"
+                >
+                  <template slot-scope="scope">
+                    <span> {{ scope.row.avgWindSpeed10min.toFixed(1) }} </span>
+                  </template>
+                </el-table-column>
+                <el-table-column
+                  prop="avgWindDir10min"
+                  label="10分钟平均风向(°)"
+                >
+                  <template slot-scope="scope">
+                    <span v-if="scope.row.avgWindDir10min !== 65535">
+                      {{ scope.row.avgWindDir10min.toFixed(1) }}</span
+                    >
+                    <span v-else> - </span>
+                  </template>
+                </el-table-column>
+                <el-table-column prop="maxWindSpeed" label="10分钟最大风速(m/s)"
+                  ><template slot-scope="scope">
+                    <span> {{ scope.row.maxWindSpeed.toFixed(1) }} </span>
+                  </template></el-table-column
+                >
+              </el-table>
+            </div>
+            <div class="pageNation">
+              <el-pagination
+                @current-change="handlechildCurrentChange"
+                @size-change="handlechildSizeChange"
+                :current-page="childpage"
+                :page-size="childpageSize"
+                layout="sizes, prev, pager, next, jumper,total"
+                :total="childtotal"
+              >
+              </el-pagination>
+            </div>
+            <el-dialog title="温度折线图" :visible.sync="wdFlag">
+              <div id="wDechart" class="chartClass"></div>
+            </el-dialog>
+            <el-dialog title="湿度折线图" :visible.sync="sdFlag">
+              <div id="sDechart" class="chartClass"></div>
+            </el-dialog>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import leftTree from "../components/leftTree";
+import { weatherJoggle, weatherListJoggle } from "@/utils/api/iceApi";
+export default {
+  name: "weather",
+  components: {
+    leftTree,
+  },
+  data() {
+    return {
+      loading: false,
+      childFlag: false,
+      tableData: [],
+      childTableDate: [],
+      formdata: {},
+      page: 1, // 当前页数
+      pageSize: 20, // 每页数量
+      total: 0, //总条数
+
+      paramsData: "",
+      childpage: 1, // 当前页数
+      childpageSize: 20, // 每页数量
+      childtotal: 0, //总条数
+      childParma: "",
+      childMsg: "",
+      echartsData: "", //echarts数据
+      wdFlag: false,
+      sdFlag: false,
+    };
+  },
+  created() {
+    var that = this;
+    document.onkeydown = function (e) {
+      var key = window.event.keyCode;
+      if (key === 13) {
+        that.onSubmit(); // 触发事件
+      }
+    };
+  },
+  watch: {
+    endtime(newVal) {
+      if (newVal) {
+        const date = new Date(newVal);
+        date.setHours(23);
+        date.setMinutes(59);
+        date.setSeconds(59);
+        this.formdata.endtime = date.getTime();
+      }
+    },
+  },
+  mounted() {
+    //this.getWeatherData();
+  },
+  methods: {
+    getCurrentData(data) {
+      console.log("执行父组件", data);
+      this.paramsData = data;
+      let weatherParams;
+      console.log(data);
+      if (data.dyValue) {
+        console.log("电压-公司");
+        weatherParams = {
+          devType: "3",
+          dyId: data.id,
+          pageNum: 1,
+          pageSize: this.pageSize,
+        };
+        this.getWeatherData(weatherParams);
+      } else if (data.bsManufacturer) {
+        console.log("线路-电压");
+        weatherParams = {
+          devType: "3",
+          lineId: data.id,
+          pageNum: 1,
+          pageSize: this.pageSize,
+        };
+        this.getWeatherData(weatherParams);
+      } else {
+        console.log("装置-杆塔");
+        // weatherParams = {
+        //   pageNum: 1,
+        //   pageSize: this.pageSize,
+        //   towerId: data.towerid,
+        // };
+        this.childpage = 1;
+        this.moreDataClick(data);
+        // this.getWeatherData(weatherParams);
+      }
+      //this.getAllData(data);
+    },
+    getWeatherData(data) {
+      console.log(data);
+      this.childFlag = false;
+      this.loading = true;
+      weatherJoggle(data)
+        .then((res) => {
+          console.log(res);
+          this.tableData = res.data.list;
+          this.total = res.data.total;
+          this.loading = false;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+
+    //点击分页
+    handleCurrentChange(val) {
+      this.page = val;
+      let data = this.paramsData;
+      let weatherParams;
+      this.tableData = [];
+      if (data.dyValue) {
+        console.log("电压-公司");
+        weatherParams = {
+          devType: "3",
+          dyId: data.id,
+          pageNum: this.page,
+          pageSize: this.pageSize,
+        };
+        this.getWeatherData(weatherParams);
+      } else if (data.bsManufacturer) {
+        console.log("线路-电压");
+        weatherParams = {
+          devType: "3",
+          lineId: data.id,
+          pageNum: this.page,
+          pageSize: this.pageSize,
+        };
+        this.getWeatherData(weatherParams);
+      } else {
+        console.log("装置-杆塔");
+        weatherParams = {
+          pageNum: this.page,
+          pageSize: this.pageSize,
+          towerId: data.towerid,
+        };
+        this.getWeatherData(weatherParams);
+      }
+      //this.getCurrentData(this.paramsData);
+    },
+    //每页条数
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.tableData = [];
+      let data = this.paramsData;
+      let weatherParams;
+      this.tableData = [];
+      if (data.dyValue) {
+        console.log("电压-公司");
+        weatherParams = {
+          devType: "3",
+          dyId: data.id,
+          pageNum: this.page,
+          pageSize: this.pageSize,
+        };
+        this.getWeatherData(weatherParams);
+      } else if (data.bsManufacturer) {
+        console.log("线路-电压");
+        weatherParams = {
+          devType: "3",
+          lineId: data.id,
+          pageNum: this.page,
+          pageSize: this.pageSize,
+        };
+        this.getWeatherData(weatherParams);
+      } else {
+        console.log("装置-杆塔");
+        weatherParams = {
+          pageNum: this.page,
+          pageSize: this.pageSize,
+          towerId: data.towerid,
+        };
+        this.getWeatherData(weatherParams);
+      }
+    },
+    //点击查看更多历史数据
+    moreDataClick(row) {
+      this.childFlag = true;
+      console.log(row);
+      this.$set(
+        this.formdata,
+        "starttime",
+        new Date(new Date().toLocaleDateString()).getTime()
+      );
+      const currentDate = new Date(); // 获取当前时间
+      currentDate.setHours(23); // 设置小时为23
+      currentDate.setMinutes(59); // 设置分钟为59
+      currentDate.setSeconds(59); // 设置秒数为59
+      this.$set(this.formdata, "endtime", currentDate.getTime());
+
+      this.childParma = row;
+      this.getchildWeatherData(row);
+    },
+
+    //查询时间
+    onSubmit() {
+      this.getchildWeatherData(this.childParma);
+    },
+    getchildWeatherData(row) {
+      this.loading = true;
+      this.childMsg = row;
+      console.log("我是子数据", row);
+      const sTime = Math.floor(this.formdata.starttime / 1000);
+      const eTime = Math.floor(this.formdata.endtime / 1000);
+      weatherListJoggle({
+        // lineId: row.lineId,
+        termId: row.id,
+        towerId: row.towerId,
+        start: sTime,
+        end: eTime,
+        pageNum: this.childpage,
+        pageSize: this.childpageSize,
+      })
+        .then((res) => {
+          console.log(res);
+          this.childTableDate = res.data.list;
+          this.childtotal = res.data.total;
+          this.loading = false;
+          //获取温度折线图
+          this.getAllData(row);
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    getAllData(row) {
+      const sTime = Math.floor(this.formdata.starttime / 1000);
+      const eTime = Math.floor(this.formdata.endtime / 1000);
+      weatherListJoggle({
+        // lineId: row.lineId,
+        termId: row.id,
+        towerId: row.towerId,
+        start: sTime,
+        end: eTime,
+        pageNum: 1,
+        pageSize: 1000,
+      })
+        .then((res) => {
+          console.log(res);
+          this.echartsData = res.data.list;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    onWdLine() {
+      this.wdFlag = true;
+      this.sdFlag = false;
+      //获取温度折线图
+      this.getEchart4(this.echartsData);
+    },
+    onSdLine() {
+      this.wdFlag = false;
+      this.sdFlag = true;
+      this.getEchart5(this.echartsData);
+    },
+    onHidden() {
+      this.wdFlag = false;
+      this.sdFlag = false;
+    },
+    //获取当天告警分类统计
+    getEchart4(wd) {
+      this.$nextTick(() => {
+        this.$echarts.init(document.getElementById("wDechart"));
+        this.mywDechart = this.$echarts.init(
+          document.getElementById("wDechart")
+        );
+        console.log(wd);
+        var xData = [];
+        var yData = [];
+        xData = wd.map((item) =>
+          this.$moment(item.updateTime * 1000).format("YYYY-MM-DD HH:mm:ss")
+        );
+        yData = wd.map((item) => item.airTemperature);
+        let option = {
+          tooltip: {
+            trigger: "axis",
+          },
+          grid: {
+            //left: "6%", //图表距离容器左侧多少距离
+            //right: "6%", //图表距离容器右侧侧多少距离
+            bottom: "15%", //图表距离容器上面多少距离
+            //top: "2%", //图表距离容器下面多少距离
+          },
+          title: {
+            text: "温度变化趋势",
+            x: "center", //设置标题位置居中
+            textStyle: {
+              //设置主标题的文字风格
+              color: "#333", //字体颜色
+              fontSize: 16, //文字大小
+              fontWeight: "normal",
+            },
+          },
+          toolbox: {
+            show: true,
+            feature: {
+              dataView: { readOnly: false },
+              magicType: { type: ["line", "bar"] },
+              restore: {},
+              saveAsImage: {},
+            },
+          },
+          dataZoom: [
+            {
+              show: true,
+              realtime: true,
+              start: 0,
+              end: 100,
+            },
+            {
+              type: "inside",
+              realtime: true,
+              start: 0,
+              end: 100,
+            },
+          ],
+          xAxis: {
+            name: "时间", // 坐标轴名称
+            type: "category",
+            boundaryGap: false,
+            data: xData,
+          },
+          yAxis: {
+            name: "温度", // 坐标轴名称
+            type: "value",
+            axisLabel: {
+              formatter: "{value} °C",
+            },
+          },
+          series: [
+            {
+              name: "温度",
+              symbol: "none",
+              type: "line",
+              data: yData,
+            },
+          ],
+        };
+        this.mywDechart.setOption(option);
+        window.addEventListener("resize", () => {
+          this.mywDechart.resize();
+        });
+      });
+    },
+    getEchart5(sd) {
+      this.$nextTick(() => {
+        this.$echarts.init(document.getElementById("sDechart"));
+        this.mysDechart = this.$echarts.init(
+          document.getElementById("sDechart")
+        );
+        console.log(sd);
+        var xData = [];
+        var yData = [];
+        xData = sd.map((item) =>
+          this.$moment(item.updateTime * 1000).format("YYYY-MM-DD HH:mm:ss")
+        );
+        yData = sd.map((item) => item.humidity);
+        let option = {
+          tooltip: {
+            trigger: "axis",
+          },
+          grid: {
+            //left: "6%", //图表距离容器左侧多少距离
+            //right: "6%", //图表距离容器右侧侧多少距离
+            bottom: "15%", //图表距离容器上面多少距离
+            //top: "2%", //图表距离容器下面多少距离
+          },
+          title: {
+            text: "湿度变化趋势",
+            x: "center", //设置标题位置居中
+            textStyle: {
+              //设置主标题的文字风格
+              color: "#333", //字体颜色
+              fontSize: 16, //文字大小
+              fontWeight: "normal",
+            },
+          },
+          toolbox: {
+            show: true,
+            feature: {
+              dataView: { readOnly: false },
+              magicType: { type: ["line", "bar"] },
+              restore: {},
+              saveAsImage: {},
+            },
+          },
+          dataZoom: [
+            {
+              show: true,
+              realtime: true,
+              start: 0,
+              end: 100,
+            },
+            {
+              type: "inside",
+              realtime: true,
+              start: 0,
+              end: 100,
+            },
+          ],
+          xAxis: {
+            name: "时间", // 坐标轴名称
+            type: "category",
+            boundaryGap: false,
+            data: xData,
+          },
+          yAxis: {
+            name: "湿度", // 坐标轴名称
+            type: "value",
+            axisLabel: {
+              formatter: "{value} %RH",
+            },
+          },
+          series: [
+            {
+              name: "湿度",
+              symbol: "none",
+              type: "line",
+              data: yData,
+            },
+          ],
+        };
+        this.mysDechart.setOption(option);
+        window.addEventListener("resize", () => {
+          this.mysDechart.resize();
+        });
+      });
+    },
+    changedate() {
+      console.log(new Date(this.formdata.endtime));
+      const currentDate = new Date(this.formdata.endtime); // 获取当前时间
+      currentDate.setHours(23); // 设置小时为23
+      currentDate.setMinutes(59); // 设置分钟为59
+      currentDate.setSeconds(59); // 设置秒数为59
+      this.formdata.endtime = currentDate;
+      console.log("结束时间", this.formdata.endtime);
+    },
+    //点击child分页
+    handlechildCurrentChange(val) {
+      this.childpage = val;
+      this.childTableDate = [];
+      this.getchildWeatherData(this.childParma);
+    },
+    //每页条数child分页
+    handlechildSizeChange(val) {
+      this.childpageSize = val;
+      this.childTableDate = [];
+      this.getchildWeatherData(this.childParma);
+    },
+  },
+};
+</script>
+<style lang="less">
+.weatherBox {
+  width: calc(100% - 24px);
+  height: calc(100% - 24px);
+  padding: 12px 12px;
+  background: #fff;
+
+  .weatherContain {
+    display: flex;
+    height: 100%;
+    box-sizing: border-box;
+    background: #fff;
+    border: 1px solid #ddd;
+    border-radius: 4px;
+  }
+  .rightTable {
+    display: flex;
+    width: 100%;
+    height: 100%;
+    flex: 1;
+    overflow: auto;
+    border-left: 1px solid #ddd;
+    .el-table .el-table__cell {
+      text-align: center;
+      -webkit-user-select: text;
+      -moz-user-select: text;
+      -ms-user-select: text;
+      user-select: text;
+    }
+    .dataBox {
+      width: calc(100% - 24px);
+      height: calc(100% - 24px);
+      padding: 12px 12px;
+      background: #fff;
+    }
+    .fatherTableShowBox {
+      height: calc(100% - 0px);
+    }
+    .childBox {
+      height: 100%;
+      .chartClass {
+        height: 450px;
+        width: 100%;
+      }
+      // .echartsBox {
+      //   display: flex;
+      //   flex-direction: column;
+      //   align-items: center;
+
+      //   .btnbox {
+      //     display: flex;
+      //     margin-bottom: 8px;
+      //     .el-button--primary {
+      //       width: auto;
+      //     }
+      //   }
+
+      // }
+      .childTableShowBox {
+        h3 {
+          font-size: 16px;
+          font-weight: normal;
+          margin-bottom: 8px;
+          text-align: center;
+          color: #666;
+          margin-top: 16px;
+        }
+        height: calc(100% - 124px);
+      }
+      .termalBox {
+        margin-bottom: 4px;
+        display: flex;
+        align-items: center;
+        line-height: 32px;
+        p {
+          .text {
+            margin-right: 12px;
+          }
+        }
+        .gropBtn {
+          //margin-left: auto;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/lineInformation/components/addLineDialog.vue

@@ -19,8 +19,8 @@
           autocomplete="off"
         ></el-input>
       </el-form-item>
-      <el-form-item label="DY等级：" prop="dyLevelid">
-        <el-select v-model="formdata.dyLevelid" placeholder="请选择电压等级">
+      <el-form-item label="DY等级：" prop="dyLevelId">
+        <el-select v-model="formdata.dyLevelId" placeholder="请选择电压等级">
           <el-option
             v-for="items in dyOptions"
             :key="items.id"
@@ -32,6 +32,12 @@
       <el-form-item label="线路名称：" prop="name">
         <el-input v-model="formdata.name" autocomplete="off"></el-input>
       </el-form-item>
+      <el-form-item label="上图数量:" prop="photoCount">
+        <el-input v-model="formdata.photoCount" autocomplete="off"></el-input>
+      </el-form-item>
+      <el-form-item label="正常上图率：" prop="photoRate">
+        <el-input v-model="formdata.photoRate" autocomplete="off"></el-input>
+      </el-form-item>
     </el-form>
     <div slot="footer" class="dialog-footer">
       <el-button @click="isShow = false">取 消</el-button>
@@ -60,7 +66,7 @@ export default {
         bsManufacturer: [
           { required: true, message: "请输入公司名称", trigger: "blur" },
         ],
-        dyLevelid: [
+        dyLevelId: [
           { required: true, message: "请选择DY等级", trigger: "change" },
         ],
 
@@ -154,7 +160,7 @@ export default {
   created() {
     getdyListJoggle().then((res) => {
       console.log(res);
-      this.dyOptions = res.data.list;
+      this.dyOptions = res.data;
       console.log(this.dyOptions);
     });
   },

src/views/lineInformation/index.vue

@@ -9,6 +9,17 @@
       </div>
       <div class="searchBox">
         <el-form :inline="true" :model="formdata" class="demo-form-inline">
+          <el-form-item label="电压等级" class="dybox">
+            <el-select v-model="formdata.dyId">
+              <el-option
+                v-for="item in dyOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+
           <el-form-item>
             <el-input
               v-model="formdata.search"
@@ -48,7 +59,7 @@
           </el-table-column>
 
           <el-table-column
-            prop="dyLevelname"
+            prop="dyLevelName"
             label="电压等级名称"
             show-overflow-tooltip
             min-width="120"
@@ -79,7 +90,10 @@
               {{ scope.row.status == 1 ? "已启用" : "未启用" }}</template
             >
           </el-table-column>
-
+          <el-table-column prop="photoCount" label="上图数量" min-width="120">
+          </el-table-column>
+          <el-table-column prop="photoRate" label="正常上图率" min-width="120">
+          </el-table-column>
           <el-table-column label="操作" width="200">
             <template slot-scope="scope">
               <el-button
@@ -123,10 +137,15 @@
   </div>
 </template>
 <script>
-import { getLineListJoggle, deleteLineJoggle } from "@/utils/api/index";
+import {
+  getLineListJoggle,
+  getSearchInfo,
+  deleteLineJoggle,
+} from "@/utils/api/index";
 import addLineDialog from "./components/addLineDialog.vue";
 import addTowerDialog from "./components/addTowerDialog.vue";
 export default {
+  name: "lineInformation",
   components: {
     addLineDialog,
     addTowerDialog,
@@ -141,8 +160,11 @@ export default {
       total: 0, //总条数
       loading: true,
       formdata: {
+        dyId: -1,
+
         search: "",
       },
+      dyOptions: [{ id: -1, name: "全部" }], //电压数据
     };
   },
   created() {
@@ -158,12 +180,23 @@ export default {
     // console.log(this.formdata.search);
   },
   mounted() {
+    this.getSearchdy();
     this.lineList();
   },
   methods: {
     getRowKeys(row) {
       return row.id;
     },
+    //获取电压信息
+    getSearchdy() {
+      getSearchInfo({ type: 1 })
+        .then((res) => {
+          this.dyOptions = this.dyOptions.concat(res.data.list);
+          this.formdata.dyId = this.dyOptions[0].id;
+        })
+        .catch((err) => {});
+    },
+
     //获取线路列表数据
     lineList() {
       this.loading = true;
@@ -192,7 +225,11 @@ export default {
     },
     //重置
     onReset() {
-      this.formdata = {};
+      this.formdata = {
+        dyId: -1,
+
+        search: "",
+      };
       this.page = 1;
       this.pageSize = 20;
       this.lineList();
@@ -221,9 +258,7 @@ export default {
     //删除数据
     handleDelete(data) {
       let deleteArr = [];
-      deleteArr.push({
-        id: data.id,
-      });
+      deleteArr.push(data.id);
       this.$confirm("确定要删除记录吗,同时删除关联关系?", "提示", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
@@ -231,7 +266,22 @@ export default {
       })
         .then(() => {
           deleteLineJoggle({ list: deleteArr }).then((res) => {
-            this.lineList(); //刷新
+            if (res.code == 200) {
+              this.$message({
+                duration: 1500,
+                showClose: true,
+                type: "success",
+                message: "删除成功!",
+              });
+              this.lineList(); //刷新
+            } else {
+              this.$message({
+                duration: 1500,
+                showClose: true,
+                type: "error",
+                message: "删除失败!",
+              });
+            }
           });
           this.$message({
             duration: 1500,

src/views/login/index.vue

@@ -49,6 +49,7 @@ import { mapMutations } from "vuex";
 import { loginJoggle } from "@/utils/api/index";
 
 export default {
+  name: "login",
   components: {},
   data: function () {
     return {
@@ -78,7 +79,8 @@ export default {
           loginJoggle(this.userInfo)
             .then((res) => {
               if (res.code == 200) {
-                this.$store.commit("SET_TOKEN", res.data.sessionId); //将token保存在vuex中
+                console.log(res.data);
+                this.$store.commit("SET_TOKEN", res.data.token); //将token保存在vuex中
                 this.$store.commit("SET_USERINFO", res.data); //将用户信息保存在vuex中
                 this.$router.push("/stritl");
                 this.$message({

src/views/otherCommon/index.vue

@@ -0,0 +1,285 @@
+<template>
+  <div class="otherCommon">
+    <div class="setWater">
+      <h4>termid 转换</h4>
+      <div class="waterForm">
+        <div class="cmdidBox">
+          <h5>装置编号</h5>
+          <el-input
+            type="textarea"
+            :rows="16"
+            placeholder="请输入装置编号"
+            v-model="cmdidtextarea"
+          >
+          </el-input>
+        </div>
+        <div class="leftWaterBox">
+          <h5>新装置编号</h5>
+          <el-input
+            type="textarea"
+            :rows="16"
+            placeholder="请输入左侧水印"
+            v-model="newCmdidText"
+          >
+          </el-input>
+        </div>
+      </div>
+      <el-button type="primary" @click="handleSure">确 定</el-button>
+      <el-button type="primary" @click="copyShare">复 制</el-button>
+      <el-button class="mlspan" type="text"
+        ><i>{{ issueCommands.length }}</i
+        >条命令</el-button
+      >
+      <div class="commandsBox" id="copy-content">
+        <div class="aaa" v-for="item in issueCommands" v-html="item"></div>
+      </div>
+    </div>
+    <!-- 上位机转换 -->
+    <div class="setWater">
+      <h4>上位机转换</h4>
+      <div class="waterForm">
+        <div class="cmdidBox">
+          <h5>装置编号</h5>
+          <el-input
+            type="textarea"
+            :rows="16"
+            placeholder="请输入装置编号"
+            v-model="cmdidCmatextarea"
+          >
+          </el-input>
+        </div>
+      </div>
+      <el-button type="primary" @click="handleSureCma">确 定</el-button>
+      <el-button type="primary" @click="copyCmaShare">复 制</el-button>
+      <el-button class="mlspan" type="text"
+        ><i>{{ cmaissueCommands.length }}</i
+        >条命令</el-button
+      >
+      <div class="commandsBox" id="copy-content2">
+        <div class="aaa" v-for="item in cmaissueCommands" v-html="item"></div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: "otherCommon",
+  data() {
+    return {
+      cmdidtextarea: "", //输入的值
+      cmdidArr: [],
+      newCmdidText: "", //输入的值
+      newCmdidArr: [],
+      issueCommands: [], //打印出来下发命令
+
+      cmdidCmatextarea: "",
+      cmdidCmaArr: [],
+      cmaissueCommands: [], //打印出来下发命令
+    };
+  },
+  created() {},
+  methods: {
+    handleSure() {
+      if (this.cmdidtextarea !== "") {
+        this.cmdidArr = [...this.cmdidtextarea.trim().split("\n")]; //装置编号
+      } else {
+        this.$message({
+          showClose: true,
+          message: "请输入装置编号",
+          type: "warning",
+        });
+        return;
+      }
+      if (this.newCmdidText !== "") {
+        this.newCmdidArr = [...this.newCmdidText.trim().split("\n")]; //左侧水印
+      } else {
+        this.$message({
+          showClose: true,
+          message: "请输入新装置编号",
+          type: "warning",
+        });
+        return;
+      }
+      console.log(this.cmdidArr);
+      console.log(this.newCmdidArr);
+      this.issueCommands = [];
+      this.getnewID();
+    },
+    getnewID() {
+      //.\bin\xympadmn.exe --server=61.169.135.150 --port=6891 --act=termid --cmdid=XYIGA10C241000036 --rf=1 --newcmdid=12M10010107183656
+
+      for (let i = 0; i < this.cmdidArr.length; i++) {
+        var command =
+          ".\\bin\\xympadmn.exe --server=61.169.135.150 --port=6891 --act=termid --cmdid=" +
+          this.cmdidArr[i] +
+          " --rf=1" +
+          " --newcmdid=" +
+          this.newCmdidArr[i];
+
+        this.issueCommands.push(command); //把命令push
+      }
+      console.log(this.issueCommands);
+    },
+    copyShare() {
+      let div = document.getElementById("copy-content");
+      let range = "";
+      if (document.body.createTextRange) {
+        //兼容ie
+        range = document.body.createTextRange();
+        range.moveToElementText(div);
+        range.select();
+      } else if (window.getSelection) {
+        // 兼容非IE，比如Firefox/chrome
+        let selection = window.getSelection();
+        range = document.createRange();
+        range.selectNodeContents(div);
+        selection.removeAllRanges();
+        selection.addRange(range);
+      }
+      document.execCommand("Copy"); // 执行浏览器复制命令
+      console.log("已复制好，可贴粘");
+    },
+
+    //cma信息批量
+
+    handleSureCma() {
+      if (this.cmdidCmatextarea !== "") {
+        this.cmdidCmaArr = [...this.cmdidCmatextarea.trim().split("\n")]; //装置编号
+      } else {
+        this.$message({
+          showClose: true,
+          message: "请输入装置编号",
+          type: "warning",
+        });
+        return;
+      }
+      console.log(this.cmdidCmaArr);
+      this.cmaissueCommands = [];
+      this.getnewCma();
+    },
+    getnewCma() {
+      //.\bin\xympadmn.exe --server=61.169.135.150 --port=6891 --act=termid --cmdid=XYIGA10C241000036 --rf=1 --newcmdid=12M10010107183656
+      //.\bin\xympadmn.exe --server=61.169.135.150 --port=6891 --act=cma --cmdid=12M10010107183755 --ip=220.248.250.22 --cmaport=18096 --domain=
+      for (let i = 0; i < this.cmdidCmaArr.length; i++) {
+        var command =
+          ".\\bin\\xympadmn.exe --server=61.169.135.150 --port=6891 --act=cma --cmdid=" +
+          this.cmdidCmaArr[i] +
+          " --ip=220.248.250.22 --cmaport=18096 --domain=";
+
+        this.cmaissueCommands.push(command); //把命令push
+      }
+      console.log(this.cmaissueCommands);
+    },
+    copyCmaShare() {
+      let div = document.getElementById("copy-content2");
+      let range = "";
+      if (document.body.createTextRange) {
+        //兼容ie
+        range = document.body.createTextRange();
+        range.moveToElementText(div);
+        range.select();
+      } else if (window.getSelection) {
+        // 兼容非IE，比如Firefox/chrome
+        let selection = window.getSelection();
+        range = document.createRange();
+        range.selectNodeContents(div);
+        selection.removeAllRanges();
+        selection.addRange(range);
+      }
+      document.execCommand("Copy"); // 执行浏览器复制命令
+      console.log("已复制好，可贴粘");
+    },
+  },
+};
+</script>
+<style lang="less">
+.otherCommon {
+  width: calc(100% - 24px);
+  height: calc(100% - 24px);
+  padding: 12px 12px;
+  background: #fff;
+  display: flex;
+  justify-content: space-between;
+  .setWater {
+    width: 48%;
+    border: 1px solid #dddddd;
+    height: calc(100% - 24px);
+    padding: 12px;
+    border-radius: 4px;
+
+    .waterForm {
+      width: 100%;
+      height: 50%;
+      margin-top: 16px;
+      // background: #fcc;
+      display: flex;
+      .channelBox {
+        width: 150px;
+        border: 1px solid #dddddd;
+        padding: 12px;
+        border-radius: 4px;
+        margin-right: 8px;
+        .groupCheck {
+          display: flex;
+          flex-direction: column;
+          margin-top: 12px;
+          .el-checkbox {
+            height: 32px;
+            line-height: 32px;
+          }
+        }
+      }
+      .cmdidBox {
+        width: 250px;
+        border: 1px solid #dddddd;
+        padding: 12px;
+        border-radius: 4px;
+        margin-right: 8px;
+        .el-textarea {
+          margin-top: 2px;
+        }
+      }
+      .leftWaterBox {
+        margin-right: 8px;
+      }
+      .leftWaterBox,
+      .rghtWaterBox {
+        flex: 1;
+        border: 1px solid #dddddd;
+        padding: 12px;
+        border-radius: 4px;
+        .el-textarea {
+          margin-top: 2px;
+        }
+      }
+    }
+    .el-button {
+      margin-top: 4px;
+    }
+    .commandsBox {
+      width: auto;
+      height: calc(50% - 106px);
+      margin-top: 8px;
+      border: 1px solid #fcc;
+      overflow: auto;
+      padding: 8px;
+      border-radius: 4px;
+    }
+    .mlspan {
+      //   margin-left: 24px;
+      //   height: 32px;
+      //   line-height: 32px;
+      //   margin-top: 4px;
+      //   display: inline-block;
+      font-size: 14px;
+      color: #000;
+      cursor: default;
+      i {
+        color: #169e8c;
+        font-weight: bold;
+        font-style: normal;
+      }
+    }
+  }
+}
+</style>

src/views/photoTotal/index.vue

@@ -0,0 +1,547 @@
+<template>
+  <div class="realTimeSearchTotal">
+    <div class="searchMain">
+      <div class="searchBox" ref="searchref">
+        <el-form :inline="true" :model="formdata" class="demo-form-inline">
+          <el-form-item label="电压等级">
+            <el-select v-model="formdata.dyid" @change="getSearchxl">
+              <el-option
+                v-for="item in dyOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              >
+                {{ item.name }}
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="线路名称">
+            <el-select
+              v-model="formdata.lineid"
+              @change="getSearchgt"
+              filterable
+            >
+              <el-option
+                v-for="item in xlOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="杆塔名称">
+            <el-select
+              v-model="formdata.towerid"
+              @change="getSearchzz"
+              filterable
+            >
+              <el-option
+                v-for="item in gtOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="装置名称">
+            <el-select
+              v-model="formdata.termid"
+              @change="getSearchtd"
+              filterable
+            >
+              <el-option
+                v-for="item in zzOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="通道">
+            <el-select v-model="formdata.channelid">
+              <el-option
+                v-for="item in tdOptions"
+                :key="item.id"
+                :label="
+                  item.alias !== null && item.alias !== ''
+                    ? item.alias
+                    : item.name
+                "
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+          <el-form-item label="开始日期">
+            <el-date-picker
+              v-model="formdata.starttime"
+              type="datetime"
+              placeholder="开始日期"
+              value-format="timestamp"
+              :picker-options="pickerOptions"
+              default-time="00:00:00"
+            >
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item label="结束日期">
+            <el-date-picker
+              v-model="formdata.endtime"
+              type="datetime"
+              default-time="23:59:59"
+              placeholder="结束日期"
+              value-format="timestamp"
+              :picker-options="pickerOptions"
+              class="ml10"
+            >
+            </el-date-picker>
+          </el-form-item>
+          <el-form-item>
+            <el-input
+              v-model="formdata.search"
+              placeholder="请输入线路/杆塔/设备名称"
+              clearable
+            ></el-input>
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="onSubmit">查询</el-button>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="pictureBox" v-loading="loading">
+        <el-table :data="picList" style="width: 100%" height="calc(100% - 0px)">
+          <el-table-column prop="cmdid" label="装置编号" width="180">
+          </el-table-column>
+          <el-table-column prop="total" label="图片总数" width="180">
+          </el-table-column>
+          <el-table-column prop="wrongCount" label="异常时间点" width="180">
+          </el-table-column>
+          <el-table-column prop="channels" label="异常数据列表">
+            <template slot-scope="scope">
+              <div v-for="channelItem in scope.row.channels">
+                <span v-for="presetItem in channelItem.presets">
+                  <p
+                    v-for="wrongHour in presetItem.hours"
+                    v-if="wrongHour.wrong == true"
+                  >
+                    通道{{ channelItem.channelId }}-预置位{{
+                      presetItem.presetId
+                    }}
+                    -<span>
+                      {{ wrongHour.hour }}-<span v-if="wrongHour.total > 2"
+                        >多{{ wrongHour.total - 2 }}</span
+                      ><span v-else="wrongHour.total < 2"
+                        >少{{ 2 - wrongHour.total }}</span
+                      ></span
+                    >
+                  </p>
+                </span>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </div>
+
+      <div class="pageNation" v-if="picList.length !== 0">
+        <el-pagination
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+          :current-page="page"
+          :page-size="pageSize"
+          :page-sizes="[20, 50, 100, 200]"
+          layout="sizes, prev, pager, next, jumper,total"
+          :total="total"
+          background
+        >
+        </el-pagination>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getSearchInfo, getPhotoStatApi } from "@/utils/api/index";
+import defaultImage from "../../assets/img/nodatapic2.jpg";
+export default {
+  name: "realTimeSearch",
+  data() {
+    return {
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now(); // 禁用大于今天的日期
+        },
+      },
+
+      picList: [],
+      dyOptions: [{ id: -1, name: "全部" }], //电压数据
+      xlOptions: [{ id: -1, name: "全部" }], //线路数据
+      gtOptions: [{ id: -1, name: "全部" }], //杆塔数据
+      zzOptions: [{ id: -1, name: "全部" }], //装置数据
+      tdOptions: [{ id: -1, name: "全部", alias: null }], //通道数据
+      formdata: {
+        dyid: -1,
+        lineid: -1,
+        towerid: -1,
+        channelid: -1,
+        termid: -1,
+        search: "",
+      },
+      tdTermid: "",
+      page: 1, // 当前页数
+      pageSize: 20, // 每页数量
+      total: 0, //总条数
+      loading: false,
+      signtype: 0, //0第一次查询
+      channels: [
+        { id: 1, name: "通道 1" },
+        { id: 5, name: "通道 5" },
+        { id: 7, name: "通道 7" },
+      ],
+      presets: [
+        { id: 1, name: "预置位1" },
+        { id: 255, name: "默认预置位" },
+      ],
+    };
+  },
+  created() {
+    var that = this;
+    document.onkeydown = function (e) {
+      var key = window.event.keyCode;
+      if (key === 13) {
+        that.onSubmit(); // 触发事件
+      }
+    };
+  },
+  mounted() {
+    this.$set(this.formdata, "endtime", new Date().getTime());
+    if (JSON.stringify(this.$route.query) === "{}") {
+      this.$set(
+        this.formdata,
+        "starttime",
+        new Date(new Date().toLocaleDateString()).getTime()
+      );
+
+      this.getSearchdy();
+    } else {
+      this.getSearchdy();
+      this.formdata.dyid = this.$route.query.dyId;
+      this.formdata.lineid = this.$route.query.lineId;
+      this.formdata.towerid = this.$route.query.towerId;
+      this.formdata.channelid = this.$route.query.channelId;
+      this.formdata.termid = this.$route.query.termId;
+      this.$set(this.formdata, "starttime", Number(this.$route.query.date));
+      this.getPicData();
+    }
+  },
+  methods: {
+    setDefaultImage(e) {
+      e.target.src = defaultImage;
+    },
+    //获取电压信息
+    getSearchdy() {
+      getSearchInfo({ type: 1 })
+        .then((res) => {
+          this.dyOptions = this.dyOptions.concat(res.data.list);
+          console.log(this.dyOptions);
+          if (JSON.stringify(this.$route.query) === "{}") {
+            this.formdata.dyid = this.dyOptions[0].id;
+          } else {
+            this.formdata.dyid = Number(this.$route.query.dyId);
+          }
+          this.getSearchxl();
+        })
+        .catch((err) => {});
+    },
+    //获取线路数据
+    getSearchxl() {
+      getSearchInfo({ type: 2, id: this.formdata.dyid })
+        .then((res) => {
+          this.xlOptions = [{ id: -1, name: "全部" }];
+          this.xlOptions = this.xlOptions.concat(res.data.list);
+
+          if (JSON.stringify(this.$route.query) === "{}") {
+            this.formdata.lineid = this.xlOptions[0].id;
+          } else {
+            this.formdata.lineid = Number(this.$route.query.lineId);
+          }
+          this.getSearchgt();
+        })
+        .catch((err) => {});
+    },
+    //获取杆塔数据
+    getSearchgt() {
+      getSearchInfo({ type: 3, id: this.formdata.lineid })
+        .then((res) => {
+          this.gtOptions = [{ id: -1, name: "全部" }];
+          this.gtOptions = this.gtOptions.concat(res.data.list);
+          // this.formdata.towerid = this.gtOptions[0].id;
+          if (JSON.stringify(this.$route.query) === "{}") {
+            this.formdata.towerid = this.gtOptions[0].id;
+          } else {
+            this.formdata.towerid = Number(this.$route.query.towerId);
+          }
+
+          this.getSearchzz();
+        })
+        .catch((err) => {});
+    },
+    //获取装置数据
+    getSearchzz() {
+      getSearchInfo({ type: 4, id: this.formdata.towerid })
+        .then((res) => {
+          this.zzOptions = [{ id: -1, name: "全部" }];
+          this.zzOptions = this.zzOptions.concat(res.data.list);
+          // this.formdata.termid = this.zzOptions[0].id;
+          console.log("切换了杆塔");
+          // console.log(this.formdata.termid);
+          // console.log(this.zzOptions[0].id);
+          // this.formdata.termid = this.zzOptions[0].id;
+          // console.log(this.formdata.termid);
+          if (JSON.stringify(this.$route.query) === "{}") {
+            this.formdata.termid = this.zzOptions[0].id;
+          } else {
+            this.formdata.termid = Number(this.$route.query.termId);
+          }
+
+          this.getSearchtd();
+        })
+        .catch((err) => {});
+    },
+    //获取通道数据
+    getSearchtd() {
+      getSearchInfo({ type: 5, id: this.formdata.termid })
+        .then((res) => {
+          this.tdOptions = [{ id: -1, name: "全部", alias: null }];
+          this.tdOptions = this.tdOptions.concat(res.data.list);
+
+          if (JSON.stringify(this.$route.query) === "{}") {
+            this.formdata.channelid = this.tdOptions[0].id;
+          } else {
+            this.formdata.channelid = Number(this.$route.query.channelId);
+          }
+
+          //this.getPicData();
+        })
+        .catch((err) => {});
+    },
+    getSearchtdAlone() {
+      getSearchInfo({ type: 5, id: this.tdTermid })
+        .then((res) => {
+          this.tdOptions = [{ id: -1, name: "全部", alias: null }];
+          this.tdOptions = this.tdOptions.concat(res.data.list);
+        })
+        .catch((err) => {});
+    },
+    //获取图片列表
+    getPicData() {
+      this.loading = true;
+      this.$set(this.formdata, "pageindex", this.page);
+      this.$set(this.formdata, "pagesize", this.pageSize);
+      console.log(this.formdata);
+      getPhotoStatApi(this.formdata)
+        .then((res) => {
+          // this.picList = [];
+          this.picList = res.data;
+          // this.total = res.data.total;
+          // this.tdTermid = res.data.list[0].termid;
+          // this.getSearchtdAlone();
+          // console.log(this.$route.query);
+          this.loading = false;
+        })
+        .catch((err) => {
+          this.loading = false;
+          console.log(err);
+        });
+    },
+    //查询
+    onSubmit() {
+      if (this.formdata.starttime > this.formdata.endtime) {
+        return this.$message({
+          duration: 1500,
+          showClose: true,
+          message: "开始日期不能大于结束日期",
+          type: "warning",
+        });
+      }
+      this.page = 1;
+      this.getPicData();
+    },
+    processData() {
+      this.picList = this.rawData.map((device) => {
+        const abnormalInfo = [];
+
+        device.channels.forEach((channel) => {
+          channel.presets.forEach((preset) => {
+            preset.hours.forEach((hour) => {
+              if (hour.wrong) {
+                const time = hour.hour.split(" ")[1] + ":00";
+                const expected = hour.base;
+                const actual = hour.timeList.length;
+
+                if (actual > expected) {
+                  abnormalInfo.push(
+                    `通道${channel.channelId}在${time}多${
+                      actual - expected
+                    }条数据（共${actual}条，预期${expected}条）`
+                  );
+                } else if (actual < expected) {
+                  abnormalInfo.push(
+                    `通道${channel.channelId}在${time}缺${
+                      expected - actual
+                    }条数据（共${actual}条，预期${expected}条）`
+                  );
+                }
+              }
+            });
+          });
+        });
+
+        return {
+          cmdid: device.cmdid,
+          abnormalInfo,
+        };
+      });
+    },
+    //点击分页
+    handleCurrentChange(val) {
+      this.page = val;
+      //this.picList = [];
+      this.getPicData();
+    },
+    //每页条数
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.getPicData();
+    },
+  },
+};
+</script>
+<style lang="less">
+.realTimeSearchTotal {
+  width: calc(100% - 24px);
+  height: calc(100% - 24px);
+  padding: 12px 12px;
+  background: #fff;
+  .searchMain {
+    border: 1px solid #dddddd;
+    height: calc(100% - 22px);
+    padding: 12px;
+    border-radius: 4px;
+    .ml10 {
+      margin-left: 10px;
+    }
+  }
+  .pictureBox {
+    display: flex;
+    // justify-content: space-around;
+    flex-wrap: wrap;
+    height: calc(100% - 138px);
+    max-height: calc(100% - 138px);
+
+    border: 1px solid #eee;
+    .picShowBox {
+      height: 100%;
+      overflow: auto;
+    }
+
+    .imgList {
+      width: calc((100% - 104px) / 4);
+      position: relative;
+      display: inline-block;
+      margin: 8px;
+      position: relative;
+      padding: 4px;
+      border-radius: 3px;
+      background: #fff;
+      height: 200px;
+
+      .el-card__body {
+        padding: 0px;
+        height: 100%;
+      }
+      .bigpic {
+        width: 100%;
+        height: 100%;
+        //background-size: 100% 100%;
+        position: relative;
+
+        .el-image {
+          width: 100%;
+          height: 100%;
+
+          .el-image__placeholder {
+            background: url(../../assets/img/nopicbg.png) no-repeat center;
+            background-size: 20% 20%;
+          }
+          img {
+            cursor: pointer;
+            width: 100%;
+            height: 200px;
+          }
+        }
+        &:hover {
+          .deleteBox {
+            display: block;
+          }
+        }
+      }
+      .caption {
+        position: absolute;
+        bottom: 0px;
+        background: #169e8ca1;
+        width: calc(100% - 8px);
+        padding: 4px;
+        color: #333;
+        .infoTop {
+          font-size: 16px;
+          color: #fff;
+          font-weight: normal;
+          margin-top: 2px;
+          padding-left: 5px;
+          padding-right: 5px;
+        }
+        .infoBottom {
+          color: #fff;
+          font-size: 12px;
+          font-weight: normal;
+          margin-top: 6px;
+          padding-left: 5px;
+          padding-right: 5px;
+        }
+      }
+      .deleteBox {
+        position: absolute;
+        right: 4px;
+        top: 4px;
+        z-index: 2;
+        display: none;
+        .el-button {
+          width: auto;
+          background: rgba(0, 0, 0, 0.5);
+          border: 1px solid transparent;
+          color: #fff;
+          font-size: 16px;
+          padding: 3px;
+        }
+        &:hover {
+          .el-button {
+            background: #f56c6c;
+            //color: #f56c6c;
+          }
+        }
+      }
+    }
+    .el-loading-mask {
+      background-color: rgba(255, 255, 255, 0.4);
+    }
+    .noPicBox {
+      display: flex;
+      width: 100%;
+      height: calc(100% - 86px);
+      overflow: auto;
+      .el-empty {
+        margin: auto;
+      }
+    }
+  }
+}
+</style>

src/views/photographicDevice/components/addLineDialog.vue

@@ -127,7 +127,7 @@ export default {
   created() {
     getdyListJoggle().then((res) => {
       console.log(res);
-      this.dyOptions = res.data.list;
+      this.dyOptions = res.data;
       console.log(this.dyOptions);
     });
   },

src/views/photographicDevice/components/addPhotoDialog.vue

@@ -13,11 +13,25 @@
       :rules="rules"
       :model="formInfo"
     >
+      <el-form-item label="电压等级：" prop="dyId">
+        <el-select
+          v-model="formInfo.dyId"
+          placeholder="请选择"
+          @change="getSearchxl"
+        >
+          <el-option
+            v-for="item in dyOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          ></el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item label="线路名称：" prop="lineId">
         <el-select
           v-model="formInfo.lineId"
           placeholder="请选择"
-          @change="getTowerchange"
+          @change="getSearchgt"
         >
           <el-option
             v-for="item in lineOptions"
@@ -39,8 +53,18 @@
           </el-option>
         </el-select>
       </el-form-item>
-      <el-form-item label="装置ID：" prop="cmdId">
-        <el-input v-model="formInfo.cmdId" autocomplete="on"></el-input>
+      <el-form-item label="装置ID：" prop="cmdid">
+        <el-input v-model="formInfo.cmdid" autocomplete="on"></el-input>
+      </el-form-item>
+      <el-form-item label="装置类型：" prop="devType">
+        <el-select v-model="formInfo.devType" placeholder="请选择">
+          <el-option
+            v-for="item in devTypeOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          ></el-option>
+        </el-select>
       </el-form-item>
       <el-form-item label="云台选择：" prop="hasPan">
         <el-select v-model="formInfo.hasPan" placeholder="请选择">
@@ -55,7 +79,7 @@
       <el-form-item label="装置名称：" prop="equipName">
         <el-input v-model="formInfo.equipName" auto-complete="on"></el-input>
       </el-form-item>
-      <el-form-item label="SIM卡：" prop="sim">
+      <!-- <el-form-item label="SIM卡：" prop="sim">
         <el-input v-model="formInfo.sim" auto-complete="on"></el-input>
       </el-form-item>
       <el-form-item label="网络类型：" prop="netType">
@@ -68,6 +92,9 @@
           ></el-option>
         </el-select>
       </el-form-item>
+      <el-form-item label="ICCID：" prop="iccid">
+        <el-input v-model="formInfo.iccid" auto-complete="on"></el-input>
+      </el-form-item> -->
 
       <el-form-item label="装置型号：" prop="model">
         <el-input v-model="formInfo.model" auto-complete="on"></el-input>
@@ -102,11 +129,20 @@
           value-format="timestamp"
         ></el-date-picker>
       </el-form-item>
-      <!-- <el-form-item label="状态：" prop="status">
-        <el-select v-model="formInfo.statusId" placeholder="请选择">
-          <el-option v-for="item in statusOptions" :key="item.id" :label="item.name" :value="item.id"></el-option>
+      <el-form-item
+        v-if="photoDialogTitle == '修改'"
+        label="离线预警："
+        prop="isfavor"
+      >
+        <el-select v-model="formInfo.isfavor" placeholder="请选择">
+          <el-option
+            v-for="item in isfavorOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          ></el-option>
         </el-select>
-      </el-form-item> -->
+      </el-form-item>
       <el-divider></el-divider>
       <h4>添加通道</h4>
       <div class="addchannel" ref="channelBoxref">
@@ -135,6 +171,16 @@
               placeholder="请输入通道昵称"
             ></el-input>
           </el-form-item>
+          <el-form-item label="是否云台：">
+            <el-select v-model="val.type">
+              <el-option
+                v-for="item in ytTypeOption"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </el-form-item>
           <div class="btngrop">
             <el-button
               v-if="index !== 0"
@@ -179,8 +225,8 @@ import {
   addTerminalJoggle,
   updateTerminalJoggle,
   getAllChannelListJoggle,
-  getLineAndGtInfo,
   getProtocolList,
+  getSearchInfo,
 } from "@/utils/api/index";
 export default {
   props: {
@@ -195,9 +241,9 @@ export default {
 
   data() {
     let validCmid = (rule, value, callback) => {
-      let reg = /^[0-9A-Za-z_/\\/-]{17}$/;
+      let reg = /^([0-9A-Za-z_\/\\-]{17}|[0-9A-Za-z_\/\\-]{6})$/;
       if (!reg.test(value)) {
-        callback(new Error("装置id为17位编码"));
+        callback(new Error("装置id为17位编码或者6位编码"));
       } else {
         callback();
       }
@@ -207,20 +253,45 @@ export default {
       formInfo: {},
       channelOptions: [], //所有通道列表
       filterOption: [], //筛选后的通道列表
+
       lineOptions: [], //线路
       toweridOptions: [], //杆塔
+      dyOptions: [], //电压
+      //装置类型
+      devTypeOptions: [
+        {
+          id: "1",
+          name: "微拍",
+        },
+        {
+          id: "2",
+          name: "覆冰拉力",
+        },
+        {
+          id: "3",
+          name: "微气象",
+        },
+        {
+          id: "23",
+          name: "覆冰、微气象",
+        },
+        {
+          id: "123",
+          name: "微拍、覆冰、微气象",
+        },
+      ],
       networkOptions: [
         {
           id: 1,
-          name: "移动",
+          name: "大汉移动",
         },
         {
           id: 2,
-          name: "联通",
+          name: "公田移动",
         },
         {
-          id: 3,
-          name: "电信",
+          id: -1,
+          name: "无绑定",
         },
       ], //网络类型
       statusOptions: [
@@ -247,9 +318,30 @@ export default {
           name: "是",
         },
       ],
+      ytTypeOption: [
+        {
+          id: 0,
+          name: "默认",
+        },
+        {
+          id: 1,
+          name: "云台",
+        },
+      ],
+      //监测状态是否在线
+      isfavorOptions: [
+        {
+          id: 1,
+          name: "是",
+        },
+        {
+          id: 0,
+          name: "否",
+        },
+      ],
       protocolOptions: [], //规约版本
       rules: {
-        cmdId: [
+        cmdid: [
           { required: true, message: "请输入装置ID", trigger: "blur" },
           { validator: validCmid, trigger: "blur" },
         ],
@@ -275,25 +367,28 @@ export default {
     },
     //判断
     getdataform(val) {
-      this.getLine();
+      this.getSearchdy();
       this.getChannel();
       if (val == null) {
         return (this.formInfo = {
+          dyId: "",
           lineId: "",
           towerId: "",
-          cmdId: "",
+          cmdid: "",
           equipName: "",
+          devType: this.devTypeOptions[0].id,
           hasPan: this.hasPanOptions[0].id,
           sim: "",
           netType: this.networkOptions[0].id,
-          model: "",
-          bsManufacturer: "",
+          model: "MSRDT-1-WP",
+          bsManufacturer: "上海欣影",
           protocol: this.protocolOptions[0].id,
           workingDate: new Date().getTime(),
           list: [
             {
               id: "",
               alias: "",
+              type: 0,
             },
           ],
         });
@@ -304,6 +399,7 @@ export default {
         val.list.push({
           id: "",
           alias: "",
+          type: 0,
         });
       }
 
@@ -314,7 +410,8 @@ export default {
         "workingDate",
         new Date(this.formInfo.workingDate).getTime()
       );
-      console.log(this.formInfo.workingDate);
+
+      console.log(this.formInfo);
     },
     //通道号值改变
     changeHandle() {
@@ -328,6 +425,7 @@ export default {
       this.formInfo.list.push({
         id: "",
         alias: "",
+        type: 0,
       });
       this.filterOption = this.channelOptions.filter(
         (val) => !this.formInfo.list.some((item) => item.id === val.id)
@@ -373,7 +471,7 @@ export default {
             //   displayName: this.formInfo.cmdId,
             // };
             this.$set(this.formInfo, "workingDate", new Date().getTime());
-            this.$set(this.formInfo, "displayName", this.formInfo.cmdId);
+            this.$set(this.formInfo, "displayName", this.formInfo.cmdid);
             console.log(this.formInfo);
             addTerminalJoggle(this.formInfo)
               .then((res) => {
@@ -395,8 +493,10 @@ export default {
                 });
               });
           } else {
-            console.log(this.formInfo);
-
+            if (this.formInfo.list[0].id == "") {
+              this.$set(this.formInfo, "list", []);
+            }
+            console.log("修改aaaaaaaaaaaaaaa", this.formInfo);
             updateTerminalJoggle(this.formInfo)
               .then((res) => {
                 this.isShow = false;
@@ -413,49 +513,53 @@ export default {
       });
     },
 
-    //获取所有线路
-    getLine() {
-      getLineAndGtInfo({ type: 1 }).then((res) => {
-        this.lineOptions = res.data.list;
-        if (res.data.list.length == 0) {
-          this.lineOptions = [];
-          this.formInfo.lineId = "";
-        } else {
+    //获取电压信息
+    getSearchdy() {
+      getSearchInfo({ type: 1 })
+        .then((res) => {
+          this.dyOptions = res.data.list;
+          if (res.data.list.length == 0) {
+            this.dyOptions = [];
+            this.formInfo.dyId = "";
+          } else {
+            this.dyOptions = res.data.list;
+            if (this.photoDialogTitle == "新增") {
+              // this.formInfo.lineId = res.data.list[0].id;
+              this.$set(this.formInfo, "dyId", res.data.list[0].id);
+            }
+          }
+
+          this.getSearchxl();
+        })
+        .catch((err) => {});
+    },
+    //获取线路数据
+    getSearchxl() {
+      getSearchInfo({ type: 2, id: this.formInfo.dyId })
+        .then((res) => {
           this.lineOptions = res.data.list;
           if (this.photoDialogTitle == "新增") {
             // this.formInfo.lineId = res.data.list[0].id;
             this.$set(this.formInfo, "lineId", res.data.list[0].id);
           }
-        }
-        // this.dyOptions = res.data.list;
-        // this.formdata.dyid = res.data.list == [] ? "" : res.data.list[0].id;
-        this.getTower();
-      });
+          this.getSearchgt();
+        })
+        .catch((err) => {});
     },
-    //获取所有杆塔
-    getTower() {
-      getLineAndGtInfo({ type: 2, id: this.formInfo.lineId })
+    //获取杆塔数据
+    getSearchgt() {
+      getSearchInfo({ type: 3, id: this.formInfo.lineId })
         .then((res) => {
-          if (res.data.list.length == 0) {
-            this.toweridOptions = [];
-            this.formInfo.towerId = "";
-          } else {
-            this.toweridOptions = res.data.list;
-            if (this.photoDialogTitle == "新增" || this.photoDialogtype == 1) {
-              // this.formInfo.towerId = res.data.list[0].id;
-              this.$set(this.formInfo, "towerId", res.data.list[0].id);
-              this.photoDialogtype = 0;
-            }
+          this.toweridOptions = res.data.list;
+
+          if (this.photoDialogTitle == "新增") {
+            // this.formInfo.lineId = res.data.list[0].id;
+            this.$set(this.formInfo, "towerId", res.data.list[0].id);
           }
         })
         .catch((err) => {});
     },
-    getTowerchange() {
-      if (this.photoDialogTitle == "修改") {
-        this.photoDialogtype = 1;
-      }
-      this.getTower();
-    },
+
     //获取所有通道
     getChannel() {
       getAllChannelListJoggle()
@@ -522,7 +626,10 @@ export default {
           //justify-content: space-between;
           padding-right: 6px;
           .el-form-item {
-            width: 310px;
+            width: 202px;
+            // .el-form-item__content {
+            //   width: 100px;
+            // }
           }
           .btngrop {
             margin-bottom: 16px;

src/views/photographicDevice/components/baseInfor.vue

@@ -1,16 +1,32 @@
 <template>
   <el-dialog
     class="baseInforDialog"
-    title="基本信息"
+    title="基本信息报"
     :visible.sync="isShow"
     :close-on-click-modal="false"
-    width="1280px"
+    width="1360px"
   >
+    <div class="zzinfo">
+      <span v-if="rowInfo.protocol == '65280'"> 国网I1 </span>
+      <span v-if="rowInfo.protocol == '65296'"> 陕西 </span>
+      <span v-if="rowInfo.protocol == '65281'"> 安徽 </span>
+      <span v-if="rowInfo.protocol == '65282'"> 江苏 </span>
+      <span v-if="rowInfo.protocol == '65283'"> 湖南 </span>
+      <span v-if="rowInfo.protocol == '65284'"> 浙江 </span>
+      <span v-if="rowInfo.protocol == '65285'"> 河南全景 </span>
+      <span v-if="rowInfo.protocol == '65286'"> 河南郑州 </span>
+      <span v-if="rowInfo.protocol == '65290'"> 河南统一视频v2020 </span>
+      <span v-if="rowInfo.protocol == '65298'"> 宁夏 </span>
+      <span v-if="rowInfo.protocol == '2'"> 南网 </span>
+      <span>{{rowInfo.protocol}}</span>
+    </div>
     <el-form :inline="true" :model="formdata" class="demo-form-inline">
       <el-form-item label="开始日期">
         <el-date-picker
+          @change="changestartdate"
           v-model="formdata.starttime"
           type="datetime"
+          :picker-options="pickerOptions"
           placeholder="开始日期"
           value-format="timestamp"
         >
@@ -18,9 +34,10 @@
       </el-form-item>
       <el-form-item label="结束日期">
         <el-date-picker
+          @change="changeenddate"
           v-model="formdata.endtime"
           type="datetime"
-          default-time="23:59:59"
+          :picker-options="pickerOptions"
           placeholder="结束日期"
           value-format="timestamp"
           class="ml10"
@@ -29,7 +46,7 @@
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="onSubmit">查询</el-button>
-        <el-button type="primary">导出</el-button>
+        <el-button type="primary" @click="exportFault">导出</el-button>
       </el-form-item>
     </el-form>
     <el-table
@@ -38,6 +55,7 @@
       stripe
       tooltip-effect="dark"
       style="width: 100%"
+      height="442px"
       v-loading="loading"
     >
       <template slot="empty">
@@ -49,59 +67,49 @@
         </template>
       </el-table-column>
       <el-table-column
-        prop="name"
-        label="采集时间"
-        min-width="120"
-        show-overflow-tooltip
-      ></el-table-column>
-      <el-table-column
-        prop="name"
-        label="设备名称"
-        min-width="80"
-        show-overflow-tooltip
-      ></el-table-column>
-      <el-table-column
-        prop="name"
-        label="设备编号"
-        min-width="120"
+        prop="cmdid"
+        label="装置编号"
+        min-width="160"
         show-overflow-tooltip
       ></el-table-column>
+      <el-table-column prop="updateTimeStr" label="采集时间" min-width="140">
+      </el-table-column>
+
+      <el-table-column prop="equipName" label="装置名称" min-width="140">
+      </el-table-column>
+      <el-table-column prop="model" label="装置型号" show-overflow-tooltip>
+      </el-table-column>
       <el-table-column
-        prop="name"
-        label="装置名称"
-        min-width="80"
+        prop="bsId"
+        label="出厂编号"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="装置型号"
-        min-width="80"
+        prop="version"
+        label="基本信息版本号"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="装置版本号"
-        min-width="80"
+        prop="protocolVersion"
+        label="通信协议版本号"
         show-overflow-tooltip
       ></el-table-column>
-      <el-table-column
-        prop="name"
-        label="生产厂家"
-        min-width="100"
+      <!-- <el-table-column
+        prop="protocolVersion"
+        label="规约版本号（V1.3）"
         show-overflow-tooltip
-      ></el-table-column>
+      ></el-table-column> -->
+
+      <el-table-column prop="bsManu" label="生产厂家"> </el-table-column>
       <el-table-column
-        prop="name"
+        prop="productionDate"
         label="生产日期"
-        min-width="120"
         show-overflow-tooltip
-      ></el-table-column>
-      <el-table-column
-        prop="name"
-        label="出厂编号"
-        min-width="100"
-        show-overflow-tooltip
-      ></el-table-column>
+      >
+        <template slot-scope="scope">
+          {{ $moment(scope.row.productionDate).format("YYYY-MM-DD") }}
+        </template>
+      </el-table-column>
     </el-table>
     <div class="pageNation">
       <el-pagination
@@ -116,36 +124,97 @@
       </el-pagination>
     </div>
     <div slot="footer" class="dialog-footer">
-      <el-button @click="isShow = false">取 消</el-button>
+      <el-button @click="hide">取 消</el-button>
     </div>
   </el-dialog>
 </template>
 <script>
-import { getLineListJoggle } from "@/utils/api/index";
+import {
+  getTermBasicInfoHistoryApi,
+  getTermBasicInfoHistoryApiExcel,
+} from "@/utils/api/index";
 export default {
   data() {
     return {
       isShow: false,
       formdata: {},
-      listData: [
-        {
-          name: "测试",
-        },
-        {
-          name: "测试2",
-        },
-      ],
+      rowInfo: "",
+      listData: [],
       loading: false,
-      seltermid: "", //装置id
-      selcmdId: "", //cmdId
-      requestId: "",
       page: 1, // 当前页数
-      pageSize: 20, // 每页数量
+      pageSize: 10, // 每页数量
       total: 0, //总条数
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now(); // 禁用大于今天的日期
+        },
+      },
     };
   },
+  watch: {
+    endtime(newVal) {
+      if (newVal) {
+        const date = new Date(newVal);
+        date.setHours(23);
+        date.setMinutes(59);
+        date.setSeconds(59);
+        this.formdata.endtime = date;
+      }
+    },
+  },
+  created() {},
   mounted() {},
   methods: {
+    getTime() {
+      const thirtyDaysAgo = new Date();
+      thirtyDaysAgo.setHours(0); // 设置小时为23
+      thirtyDaysAgo.setMinutes(0); // 设置分钟为59
+      thirtyDaysAgo.setSeconds(0); // 设置秒数为59
+      console.log(
+        new Date(thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30))
+      );
+      const startTimeNew = new Date(
+        thirtyDaysAgo.setDate(thirtyDaysAgo.getDate())
+      ).getTime();
+      this.$set(this.formdata, "starttime", startTimeNew);
+      console.log("开始时间", this.formdata.starttime);
+      const currentDate = new Date(); // 获取当前时间
+      currentDate.setHours(23); // 设置小时为23
+      currentDate.setMinutes(59); // 设置分钟为59
+      currentDate.setSeconds(59); // 设置秒数为59
+      this.$set(this.formdata, "endtime", currentDate.getTime());
+      console.log("结束时间", this.formdata.endtime);
+      this.getfaultinfo();
+    },
+    changestartdate(val) {
+      console.log(val);
+      if (val == null) {
+        console.log(new Date());
+        const startDate = new Date();
+        startDate.setHours(0); // 设置小时为23
+        startDate.setMinutes(0); // 设置分钟为59
+        startDate.setSeconds(0); // 设置秒数为59
+        this.formdata.starttime = startDate;
+        console.log(this.formdata.starttime);
+      } else {
+        this.formdata.starttime = val;
+      }
+    },
+    //结束日期
+    changeenddate(val) {
+      if (val == null) {
+        console.log(new Date());
+        const endDate = new Date();
+        endDate.setHours(23); // 设置小时为23
+        endDate.setMinutes(59); // 设置分钟为59
+        endDate.setSeconds(59); // 设置秒数为59
+        this.formdata.endtime = endDate;
+        console.log(this.formdata.endtime);
+      } else {
+        this.formdata.endtime = val;
+        console.log(val);
+      }
+    },
     //查询
     onSubmit() {
       if (this.formdata.starttime > this.formdata.endtime) {
@@ -156,45 +225,60 @@ export default {
           type: "warning",
         });
       }
-      this.getlistnr();
+      this.getfaultinfo();
+    },
+    //导出
+    exportFault() {
+      window.location.href =
+        "/api/getTermBasicInfoHistoryApiExcel?termid=" + this.rowInfo.id;
     },
     //获取数据
-    getlistnr(val) {
-      console.log(val);
-      this.seltermid = val.id;
-      this.selcmdId = val.cmdid;
+    getfaultinfo() {
       this.loading = true;
-      getLineListJoggle({
+      getTermBasicInfoHistoryApi({
+        termid: this.rowInfo.id,
+        // starttime: this.formdata.starttime,
+        // endtime: this.formdata.endtime,
         pageindex: this.page,
         pagesize: this.pageSize,
       }).then((res) => {
         this.listData = res.data.list;
         this.total = res.data.total;
-        this.loading = false;
+        this.$nextTick(() => {
+          this.loading = false;
+        });
       });
     },
     //点击分页
     handleCurrentChange(val) {
       this.page = val;
-      this.getlistnr();
+      this.getfaultinfo();
     },
     //每页条数
     handleSizeChange(val) {
       this.pageSize = val;
-      this.getlistnr();
+      this.getfaultinfo();
     },
-    display() {
+    display(row) {
+      console.log(row);
+      this.rowInfo = row;
       this.isShow = true;
+      this.getTime();
     },
     hide() {
       this.isShow = false;
+      this.formdata = {};
     },
   },
 };
 </script>
-<<<<<<< HEAD
 <style lang="less">
 .baseInforDialog {
+  .zzinfo {
+    position: absolute;
+    top: 22px;
+    left: 126px;
+  }
   .pageNation {
     justify-content: flex-start;
     margin-top: 16px;
@@ -207,6 +291,3 @@ export default {
   }
 }
 </style>
-=======
-<style lang="less" scoped></style>
->>>>>>> hn1.0

src/views/photographicDevice/components/faultInfomation.vue

@@ -0,0 +1,266 @@
+<template>
+  <el-dialog
+    class="faultInfo"
+    title="故障信息报"
+    :visible.sync="isShow"
+    :close-on-click-modal="false"
+    width="1000px"
+  >
+    <div class="zzinfo">
+      <span v-if="rowInfo.protocol == '65280'"> 国网I1 </span>
+      <span v-if="rowInfo.protocol == '65296'"> 陕西 </span>
+      <span v-if="rowInfo.protocol == '65281'"> 安徽 </span>
+      <span v-if="rowInfo.protocol == '65282'"> 江苏 </span>
+      <span v-if="rowInfo.protocol == '65283'"> 湖南 </span>
+      <span v-if="rowInfo.protocol == '65284'"> 浙江 </span>
+      <span v-if="rowInfo.protocol == '65285'"> 河南全景 </span>
+      <span v-if="rowInfo.protocol == '65286'"> 河南郑州 </span>
+      <span v-if="rowInfo.protocol == '65290'"> 河南统一视频v2020 </span>
+      <span v-if="rowInfo.protocol == '65298'"> 宁夏 </span>
+      <span v-if="rowInfo.protocol == '2'"> 南网 </span>
+      <span>{{rowInfo.protocol}}</span>
+    </div>
+    <el-form :inline="true" :model="formdata" class="demo-form-inline">
+      <el-form-item label="开始日期">
+        <el-date-picker
+          @change="changestartdate"
+          v-model="formdata.starttime"
+          type="datetime"
+          :picker-options="pickerOptions"
+          placeholder="开始日期"
+          value-format="timestamp"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item label="结束日期">
+        <el-date-picker
+          @change="changeenddate"
+          v-model="formdata.endtime"
+          type="datetime"
+          :picker-options="pickerOptions"
+          placeholder="结束日期"
+          value-format="timestamp"
+          class="ml10"
+        >
+        </el-date-picker>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="onSubmit">查询</el-button>
+        <el-button type="primary" @click="exportFault">导出</el-button>
+      </el-form-item>
+    </el-form>
+    <el-table
+      ref="multipleTable"
+      :data="listData"
+      stripe
+      tooltip-effect="dark"
+      style="width: 100%"
+      height="442px"
+      v-loading="loading"
+    >
+      <template slot="empty">
+        <el-empty :image-size="160" description="暂无数据"></el-empty>
+      </template>
+      <el-table-column min-width="45" label="序号">
+        <template slot-scope="scope">
+          <span>{{ (page - 1) * pageSize + scope.$index + 1 }}</span>
+        </template>
+      </el-table-column>
+      <el-table-column
+        prop="cmdid"
+        label="装置编号"
+        min-width="120"
+        show-overflow-tooltip
+      ></el-table-column>
+      <el-table-column
+        prop="faultTime"
+        label="采集时间"
+        min-width="120"
+        show-overflow-tooltip
+      ></el-table-column>
+      <el-table-column
+        prop="msg"
+        label="故障信息"
+        min-width="120"
+        show-overflow-tooltip
+      ></el-table-column>
+    </el-table>
+    <div class="pageNation">
+      <el-pagination
+        @current-change="handleCurrentChange"
+        @size-change="handleSizeChange"
+        :current-page="page"
+        :page-size="pageSize"
+        layout="sizes, prev, pager, next, jumper,total"
+        :total="total"
+        background
+      >
+      </el-pagination>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="hide">取 消</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+import { getTermFaultsApi, getTermFaultsExcel } from "@/utils/api/index";
+export default {
+  data() {
+    return {
+      isShow: false,
+      formdata: {},
+      rowInfo: "",
+      listData: [],
+      loading: false,
+      page: 1, // 当前页数
+      pageSize: 10, // 每页数量
+      total: 0, //总条数
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now(); // 禁用大于今天的日期
+        },
+      },
+    };
+  },
+  watch: {
+    endtime(newVal) {
+      if (newVal) {
+        const date = new Date(newVal);
+        date.setHours(23);
+        date.setMinutes(59);
+        date.setSeconds(59);
+        this.formdata.endtime = date;
+      }
+    },
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    getTime() {
+      const thirtyDaysAgo = new Date();
+      thirtyDaysAgo.setHours(0); // 设置小时为23
+      thirtyDaysAgo.setMinutes(0); // 设置分钟为59
+      thirtyDaysAgo.setSeconds(0); // 设置秒数为59
+      console.log(
+        new Date(thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30))
+      );
+
+      const startTimeNew = new Date(
+        thirtyDaysAgo.setDate(thirtyDaysAgo.getDate())
+      ).getTime();
+      this.$set(this.formdata, "starttime", startTimeNew);
+      console.log("开始时间", this.formdata.starttime);
+      const currentDate = new Date(); // 获取当前时间
+      currentDate.setHours(23); // 设置小时为23
+      currentDate.setMinutes(59); // 设置分钟为59
+      currentDate.setSeconds(59); // 设置秒数为59
+      this.$set(this.formdata, "endtime", currentDate.getTime());
+      console.log("结束时间", this.formdata.endtime);
+
+      this.getfaultinfo();
+    },
+    changestartdate(val) {
+      console.log(val);
+      if (val == null) {
+        console.log(new Date());
+        const startDate = new Date();
+        startDate.setHours(0); // 设置小时为23
+        startDate.setMinutes(0); // 设置分钟为59
+        startDate.setSeconds(0); // 设置秒数为59
+        this.formdata.starttime = startDate;
+        console.log(this.formdata.starttime);
+      } else {
+        this.formdata.starttime = val;
+      }
+    },
+    //结束日期
+    changeenddate(val) {
+      if (val == null) {
+        console.log(new Date());
+        const endDate = new Date();
+        endDate.setHours(23); // 设置小时为23
+        endDate.setMinutes(59); // 设置分钟为59
+        endDate.setSeconds(59); // 设置秒数为59
+        this.formdata.endtime = endDate;
+        console.log(this.formdata.endtime);
+      } else {
+        this.formdata.endtime = val;
+        console.log(val);
+      }
+    },
+    //查询
+    onSubmit() {
+      if (this.formdata.starttime > this.formdata.endtime) {
+        return this.$message({
+          duration: 1500,
+          showClose: true,
+          message: "开始日期不能大于结束日期",
+          type: "warning",
+        });
+      }
+      this.getfaultinfo();
+    },
+    //导出
+    exportFault() {
+      window.location.href =
+        "/api/getTermFaultsExcel?termid=" + this.rowInfo.id;
+    },
+    //获取数据
+    getfaultinfo() {
+      this.loading = true;
+      getTermFaultsApi({
+        termid: this.rowInfo.id,
+        starttime: this.formdata.starttime,
+        endtime: this.formdata.endtime,
+        pageindex: this.page,
+        pagesize: this.pageSize,
+      }).then((res) => {
+        this.listData = res.data.list;
+        this.total = res.data.total;
+        this.$nextTick(() => {
+          this.loading = false;
+        });
+      });
+    },
+    //点击分页
+    handleCurrentChange(val) {
+      this.page = val;
+      this.getfaultinfo();
+    },
+    //每页条数
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.getfaultinfo();
+    },
+    display(row) {
+      console.log(row);
+      this.rowInfo = row;
+      this.isShow = true;
+      this.getTime();
+    },
+    hide() {
+      this.isShow = false;
+      this.formdata = {};
+    },
+  },
+};
+</script>
+<style lang="less">
+.faultInfo {
+  .zzinfo {
+    position: absolute;
+    top: 22px;
+    left: 126px;
+  }
+  .pageNation {
+    justify-content: flex-start;
+    margin-top: 16px;
+    .el-pagination {
+      padding: 0px;
+      .el-select .el-input {
+        margin-left: 0px;
+      }
+    }
+  }
+}
+</style>

src/views/photographicDevice/components/gpsPosition.vue

@@ -7,17 +7,6 @@
     width="662px"
     @close="handleclose"
   >
-    <!-- <div class="gpsbox" v-loading="loading">
-      <p>
-        <span>经度：</span><span>{{ infornr.longitude }}</span>
-      </p>
-      <p>
-        <span>纬度：</span><span>{{ infornr.latitude }}</span>
-      </p>
-      <p>
-        <span>半径：</span><span>{{ infornr.radius }}</span>
-      </p>
-    </div> -->
     <div class="gpsbox" v-loading="loading">
       <el-descriptions :column="1" border>
         <el-descriptions-item>

src/views/photographicDevice/components/gpsSite.vue

@@ -4,13 +4,29 @@
     title="GPS位置数据"
     :visible.sync="isShow"
     :close-on-click-modal="false"
-    width="1280px"
+    width="1000px"
   >
+    <div class="zzinfo">
+      <span v-if="rowInfo.protocol == '65280'"> 国网I1 </span>
+      <span v-if="rowInfo.protocol == '65296'"> 陕西 </span>
+      <span v-if="rowInfo.protocol == '65281'"> 安徽 </span>
+      <span v-if="rowInfo.protocol == '65282'"> 江苏 </span>
+      <span v-if="rowInfo.protocol == '65283'"> 湖南 </span>
+      <span v-if="rowInfo.protocol == '65284'"> 浙江 </span>
+      <span v-if="rowInfo.protocol == '65285'"> 河南全景 </span>
+      <span v-if="rowInfo.protocol == '65286'"> 河南郑州 </span>
+      <span v-if="rowInfo.protocol == '65290'"> 河南统一视频v2020 </span>
+      <span v-if="rowInfo.protocol == '65298'"> 宁夏 </span>
+      <span v-if="rowInfo.protocol == '2'"> 南网 </span>
+      <span>{{rowInfo.protocol}}</span>
+    </div>
     <el-form :inline="true" :model="formdata" class="demo-form-inline">
       <el-form-item label="开始日期">
         <el-date-picker
+          @change="changestartdate"
           v-model="formdata.starttime"
           type="datetime"
+          :picker-options="pickerOptions"
           placeholder="开始日期"
           value-format="timestamp"
         >
@@ -18,9 +34,10 @@
       </el-form-item>
       <el-form-item label="结束日期">
         <el-date-picker
+          @change="changeenddate"
           v-model="formdata.endtime"
           type="datetime"
-          default-time="23:59:59"
+          :picker-options="pickerOptions"
           placeholder="结束日期"
           value-format="timestamp"
           class="ml10"
@@ -29,7 +46,7 @@
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="onSubmit">查询</el-button>
-        <el-button type="primary">导出</el-button>
+        <el-button type="primary" @click="exportFault">导出</el-button>
       </el-form-item>
     </el-form>
     <el-table
@@ -39,6 +56,7 @@
       tooltip-effect="dark"
       style="width: 100%"
       v-loading="loading"
+      height="442px"
     >
       <template slot="empty">
         <el-empty :image-size="160" description="暂无数据"></el-empty>
@@ -49,39 +67,29 @@
         </template>
       </el-table-column>
       <el-table-column
-        prop="name"
-        label="采集时间"
-        min-width="120"
-        show-overflow-tooltip
-      ></el-table-column>
-      <el-table-column
-        prop="name"
-        label="设备名称"
-        min-width="80"
+        prop="cmdid"
+        label="装置编号"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="设备编号"
-        min-width="120"
+        prop="updateTimeStr"
+        label="采集时间"
         show-overflow-tooltip
       ></el-table-column>
+
       <el-table-column
-        prop="name"
+        prop="radius"
         label="半径"
-        min-width="80"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="维度"
-        min-width="80"
+        prop="latitude"
+        label="纬度"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
+        prop="longitude"
         label="经度"
-        min-width="80"
         show-overflow-tooltip
       ></el-table-column>
     </el-table>
@@ -98,36 +106,99 @@
       </el-pagination>
     </div>
     <div slot="footer" class="dialog-footer">
-      <el-button @click="isShow = false">取 消</el-button>
+      <el-button @click="hide">取 消</el-button>
     </div>
   </el-dialog>
 </template>
 <script>
-import { getLineListJoggle } from "@/utils/api/index";
+import {
+  getTermGpsHistoryApi,
+  getTermGpsHistoryExcel,
+} from "@/utils/api/index";
 export default {
   data() {
     return {
       isShow: false,
       formdata: {},
-      listData: [
-        {
-          name: "测试",
-        },
-        {
-          name: "测试2",
-        },
-      ],
+      rowInfo: "",
+      listData: [],
       loading: false,
-      seltermid: "", //装置id
-      selcmdId: "", //cmdId
-      requestId: "",
       page: 1, // 当前页数
-      pageSize: 20, // 每页数量
+      pageSize: 10, // 每页数量
       total: 0, //总条数
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now(); // 禁用大于今天的日期
+        },
+      },
     };
   },
+  watch: {
+    endtime(newVal) {
+      if (newVal) {
+        const date = new Date(newVal);
+        date.setHours(23);
+        date.setMinutes(59);
+        date.setSeconds(59);
+        this.formdata.endtime = date;
+      }
+    },
+  },
+  created() {},
   mounted() {},
   methods: {
+    getTime() {
+      const thirtyDaysAgo = new Date();
+      thirtyDaysAgo.setHours(0); // 设置小时为23
+      thirtyDaysAgo.setMinutes(0); // 设置分钟为59
+      thirtyDaysAgo.setSeconds(0); // 设置秒数为59
+      console.log(
+        new Date(thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30))
+      );
+
+      const startTimeNew = new Date(
+        thirtyDaysAgo.setDate(thirtyDaysAgo.getDate())
+      ).getTime();
+      this.$set(this.formdata, "starttime", startTimeNew);
+      console.log("开始时间", this.formdata.starttime);
+      const currentDate = new Date(); // 获取当前时间
+      currentDate.setHours(23); // 设置小时为23
+      currentDate.setMinutes(59); // 设置分钟为59
+      currentDate.setSeconds(59); // 设置秒数为59
+      this.$set(this.formdata, "endtime", currentDate.getTime());
+      console.log("结束时间", this.formdata.endtime);
+
+      this.getfaultinfo();
+    },
+    changestartdate(val) {
+      console.log(val);
+      if (val == null) {
+        console.log(new Date());
+        const startDate = new Date();
+        startDate.setHours(0); // 设置小时为23
+        startDate.setMinutes(0); // 设置分钟为59
+        startDate.setSeconds(0); // 设置秒数为59
+        this.formdata.starttime = startDate;
+        console.log(this.formdata.starttime);
+      } else {
+        this.formdata.starttime = val;
+      }
+    },
+    //结束日期
+    changeenddate(val) {
+      if (val == null) {
+        console.log(new Date());
+        const endDate = new Date();
+        endDate.setHours(23); // 设置小时为23
+        endDate.setMinutes(59); // 设置分钟为59
+        endDate.setSeconds(59); // 设置秒数为59
+        this.formdata.endtime = endDate;
+        console.log(this.formdata.endtime);
+      } else {
+        this.formdata.endtime = val;
+        console.log(val);
+      }
+    },
     //查询
     onSubmit() {
       if (this.formdata.starttime > this.formdata.endtime) {
@@ -138,45 +209,60 @@ export default {
           type: "warning",
         });
       }
-      this.getlistnr();
+      this.getfaultinfo();
+    },
+    //导出
+    exportFault() {
+      window.location.href =
+        "/api/getTermGpsHistoryExcel?termid=" + this.rowInfo.id;
     },
     //获取数据
-    getlistnr(val) {
-      console.log(val);
-      this.seltermid = val.id;
-      this.selcmdId = val.cmdid;
+    getfaultinfo() {
       this.loading = true;
-      getLineListJoggle({
+      getTermGpsHistoryApi({
+        termid: this.rowInfo.id,
+        // starttime: this.formdata.starttime,
+        // endtime: this.formdata.endtime,
         pageindex: this.page,
         pagesize: this.pageSize,
       }).then((res) => {
         this.listData = res.data.list;
         this.total = res.data.total;
-        this.loading = false;
+        this.$nextTick(() => {
+          this.loading = false;
+        });
       });
     },
     //点击分页
     handleCurrentChange(val) {
       this.page = val;
-      this.getlistnr();
+      this.getfaultinfo();
     },
     //每页条数
     handleSizeChange(val) {
       this.pageSize = val;
-      this.getlistnr();
+      this.getfaultinfo();
     },
-    display() {
+    display(row) {
+      console.log(row);
+      this.rowInfo = row;
       this.isShow = true;
+      this.getTime();
     },
     hide() {
       this.isShow = false;
+      this.formdata = {};
     },
   },
 };
 </script>
-<<<<<<< HEAD
 <style lang="less">
 .gpsSiteDialog {
+  .zzinfo {
+    position: absolute;
+    top: 22px;
+    left: 126px;
+  }
   .pageNation {
     justify-content: flex-start;
     margin-top: 16px;
@@ -189,6 +275,3 @@ export default {
   }
 }
 </style>
-=======
-<style lang="less" scoped></style>
->>>>>>> hn1.0

src/views/photographicDevice/components/iccidChangeDialog.vue

@@ -0,0 +1,189 @@
+<template>
+  <el-dialog
+    class="changeIccicDialog"
+    title="修改ICCID"
+    :visible.sync="isShow"
+    :close-on-click-modal="false"
+    width="680px"
+  >
+    <el-form
+      label-position="left"
+      label-width="92px"
+      ref="formLineInfo"
+      :model="formdata"
+    >
+      <div class="left">
+        <el-form-item label="网络类型：" prop="type1">
+          <el-select v-model="formdata.type1" placeholder="请选择">
+            <el-option
+              v-for="item in networkOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="ICCID1：" prop="iccid1">
+          <el-input placeholder="请输入iccid1" v-model="formdata.iccid1">
+          </el-input>
+        </el-form-item>
+        <el-form-item label="imsi1：" prop="imsi1">
+          <el-input placeholder="请输入imsi1" v-model="formdata.imsi1">
+          </el-input>
+        </el-form-item>
+        <el-form-item label="msisdn1：" prop="msisdn1">
+          <el-input placeholder="请输入msisdn1" v-model="formdata.msisdn1">
+          </el-input>
+        </el-form-item>
+        <el-form-item label="sim1：" prop="sim1">
+          <el-input placeholder="请输入sim1" v-model="formdata.sim1">
+          </el-input>
+        </el-form-item>
+      </div>
+      <div class="right">
+        <el-form-item label="网络类型：" prop="type2">
+          <el-select v-model="formdata.type2" placeholder="请选择">
+            <el-option
+              v-for="item in networkOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="ICCID2：" prop="iccid2">
+          <el-input placeholder="请输入iccid2" v-model="formdata.iccid2">
+          </el-input>
+        </el-form-item>
+        <el-form-item label="imsi2：" prop="imsi2">
+          <el-input placeholder="请输入imsi2" v-model="formdata.imsi2">
+          </el-input>
+        </el-form-item>
+        <el-form-item label="msisdn2：" prop="msisdn2">
+          <el-input placeholder="请输入msisdn2" v-model="formdata.msisdn2">
+          </el-input>
+        </el-form-item>
+        <el-form-item label="sim2：" prop="sim2">
+          <el-input placeholder="请输入sim2" v-model="formdata.sim2">
+          </el-input>
+        </el-form-item>
+      </div>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="isShow = false">取 消</el-button>
+      <el-button type="primary" @click="submitForm()">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+import { getSimcardApi, updateSimcardApi } from "@/utils/api/index";
+
+export default {
+  props: {},
+
+  data() {
+    return {
+      isShow: false,
+      termInfo: "",
+      formdata: {},
+      networkOptions: [
+        {
+          id: -1,
+          name: "未绑定",
+        },
+        {
+          id: 1,
+          name: "大汉移动",
+        },
+        {
+          id: 2,
+          name: "公田移动rabchase",
+        },
+        {
+          id: 3,
+          name: "公田m2m10086",
+        },
+        {
+          id: 4,
+          name: "安徽",
+        },
+      ], //网络类型
+    };
+  },
+  computed: {},
+  methods: {
+    getsimCard() {
+      getSimcardApi({
+        termId: this.termInfo.id,
+      })
+        .then((res) => {
+          console.log(res);
+          if (res.code == 200 && res.data !== null) {
+            this.formdata = res.data;
+          } else {
+            this.formdata = {};
+          }
+        })
+        .catch((err) => {});
+    },
+    // 保存确定操作
+    submitForm() {
+      console.log(this.formdata);
+
+      this.$refs.formLineInfo.validate((valid) => {
+        if (valid) {
+          console.log(this.formdata);
+
+          this.formdata.termId = this.termInfo.id;
+
+          updateSimcardApi(this.formdata)
+            .then((res) => {
+              console.log(res);
+              if (res.code == 200) {
+                this.isShow = false;
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: "修改成功",
+                  type: "success",
+                });
+              } else {
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: res.msg,
+                  type: "error",
+                });
+              }
+            })
+            .catch((err) => {});
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    display(val) {
+      console.log(val);
+      this.termInfo = val;
+      this.isShow = true;
+      this.getsimCard();
+    },
+    hide() {
+      this.isShow = false;
+      this.formdata = {};
+    },
+  },
+};
+</script>
+<style lang="less">
+.changeIccicDialog {
+  .el-form {
+    display: flex;
+    justify-content: space-between;
+  }
+  .el-select {
+    width: 100%;
+  }
+}
+</style>

src/views/photographicDevice/components/iccidDialog.vue

@@ -0,0 +1,135 @@
+<template>
+  <el-dialog
+    class="iccidDialog"
+    title="导入ICCID"
+    :visible.sync="isShow"
+    :close-on-click-modal="false"
+    width="420px"
+  >
+    <el-form
+      label-position="left"
+      label-width="92px"
+      ref="formLineInfo"
+      :model="formdata"
+    >
+      <el-form-item label="网络类型：" prop="netType">
+        <el-select v-model="formdata.netType" placeholder="请选择">
+          <el-option
+            v-for="item in networkOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          ></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="ICCID：" prop="iccid">
+        <el-input
+          type="textarea"
+          :rows="10"
+          placeholder="请输入iccid"
+          v-model="formdata.iccid"
+        >
+        </el-input>
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="isShow = false">取 消</el-button>
+      <el-button type="primary" @click="submitForm()">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+import { importiccidApi } from "@/utils/api/index";
+
+export default {
+  props: {},
+
+  data() {
+    return {
+      isShow: false,
+      formdata: {},
+      networkOptions: [
+        {
+          id: -1,
+          name: "未绑定",
+        },
+        {
+          id: 1,
+          name: "大汉移动",
+        },
+        {
+          id: 2,
+          name: "公田移动rabchase",
+        },
+        {
+          id: 3,
+          name: "公田m2m10086",
+        },
+        {
+          id: 4,
+          name: "安徽",
+        },
+      ], //网络类型
+    };
+  },
+  computed: {
+    // 计算属性，将 cmdidArr 字符串转换为数组
+    iccidArrList() {
+      // 使用 split 方法按换行符分割字符串，并返回数组
+      return this.formdata.iccid.split(/\r\n|\n|\r/).filter(Boolean);
+    },
+  },
+  methods: {
+    // 保存确定操作
+    submitForm() {
+      console.log(this.formdata);
+      console.log(this.iccidArrList);
+      this.$refs.formLineInfo.validate((valid) => {
+        if (valid) {
+          console.log(this.formdata);
+          importiccidApi({
+            iccidList: this.iccidArrList,
+            type: this.formdata.netType,
+          })
+            .then((res) => {
+              console.log(res);
+              if (res.code == 200) {
+                this.isShow = false;
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: "导入成功",
+                  type: "success",
+                });
+              } else {
+                this.$message({
+                  duration: 1500,
+                  showClose: true,
+                  message: res.msg,
+                  type: "error",
+                });
+              }
+            })
+            .catch((err) => {});
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    display() {
+      this.isShow = true;
+    },
+    hide() {
+      this.isShow = false;
+    },
+  },
+};
+</script>
+<style lang="less">
+.iccidDialog {
+  .el-select {
+    width: 100%;
+  }
+}
+</style>

src/views/photographicDevice/components/imageCapture.vue

@@ -90,6 +90,9 @@
           @click="imageSearch()"
           >查询</el-button
         >
+        <p class="looktime" v-if="lookTime && showLookTime">
+          {{ $moment(lookTime * 1000).format("YYYY-MM-DD HH:mm:ss") }}
+        </p>
         <!-- <el-button
           class="searchImage"
           :loading="searchloading"
@@ -717,7 +720,90 @@ export default {
           id: 20,
           name: "",
         },
-      ], //河南
+      ], //河南统一
+      nxratiolist: [
+        {
+          id: 1,
+          name: "320X240",
+        },
+        {
+          id: 2,
+          name: "640X480",
+        },
+        {
+          id: 3,
+          name: "704X576",
+        },
+        {
+          id: 4,
+          name: "800X600 ",
+        },
+        {
+          id: 5,
+          name: "1024X768",
+        },
+        {
+          id: 6,
+          name: "1280X1024 ",
+        },
+        {
+          id: 7,
+          name: "1280X720",
+        },
+        {
+          id: 8,
+          name: "1920X1080",
+        },
+        {
+          id: 9,
+          name: "2560X1440",
+        },
+        {
+          id: 10,
+          name: "3840X2160",
+        },
+        {
+          id: 11,
+          name: "2560X1920 ",
+        },
+        {
+          id: 12,
+          name: "3264X2448",
+        },
+        {
+          id: 13,
+          name: "4224X3136",
+        },
+        {
+          id: 14,
+          name: "",
+        },
+        {
+          id: 15,
+          name: "",
+        },
+        {
+          id: 16,
+          name: "",
+        },
+        {
+          id: 17,
+          name: "",
+        },
+        {
+          id: 18,
+          name: "",
+        },
+        {
+          id: 19,
+          name: "",
+        },
+        {
+          id: 20,
+          name: "",
+        },
+      ], //宁夏
+      //
       selaccess: "", //选中的通道
       capturenr: {}, //查询后的内容
       setForm: {}, //设置参数
@@ -744,6 +830,8 @@ export default {
       timer: null,
       i: 0,
       onlinestatus: "",
+      lookTime: "",
+      showLookTime: false,
     };
   },
   mounted() {},
@@ -751,6 +839,7 @@ export default {
     handleClick(tab, event) {
       console.log(tab, event);
       this.capturenr = {};
+      this.lookTime = "";
     },
     //获取设备通道
     getSingleAccess(val) {
@@ -796,14 +885,21 @@ export default {
         case 65284:
           this.ratiolist = this.zhejiangratiolist;
           break;
+        case 65290:
+          this.ratiolist = this.henanratiolist;
+          break;
+        //宁夏
+        case 65298:
+          this.ratiolist = this.nxratiolist;
+          break;
       }
 
       if (val.protocol == 65281) {
-        this.$set(this.setForm, "resolution", this.ratiolist[12].id);
+        this.$set(this.setForm, "resolution", this.ratiolist[5].id);
         this.$set(this.setForm, "luminance", 50);
         this.$set(this.setForm, "contrast", 50);
         this.$set(this.setForm, "saturation", 50);
-      } else if (val.protocol == 65285) {
+      } else if (val.protocol == 65285 || val.protocol == 65290) {
         this.$set(this.setForm, "resolution", this.ratiolist[7].id);
         this.$set(this.setForm, "luminance", 50);
         this.$set(this.setForm, "contrast", 50);
@@ -826,10 +922,18 @@ export default {
             name: "act",
             value: "imgparams",
           },
+          {
+            name: "udp",
+            value: 1,
+          },
           {
             name: "flag",
             value: 0,
           },
+          {
+            name: "rf",
+            value: 255,
+          },
           {
             name: "channel",
             value: this.selaccess,
@@ -875,10 +979,18 @@ export default {
             name: "act",
             value: "imgparams",
           },
+          {
+            name: "udp",
+            value: 1,
+          },
           {
             name: "flag",
             value: 1,
           },
+          {
+            name: "rf",
+            value: 255,
+          },
           {
             name: "channel",
             value: this.setForm.channelId,
@@ -922,6 +1034,8 @@ export default {
         .then((res) => {
           console.log(res);
           this.requestid = res.data.requestId;
+          this.showLookTime = false;
+          // this.lookTime = res.data.date;
           //this.getinfo1();
           clearInterval(this.timer);
           this.timer = window.setInterval(() => {
@@ -950,6 +1064,9 @@ export default {
               message: "信息已更新",
               type: "success",
             });
+            this.lookTime = res.data.requestTime;
+
+            this.showLookTime = true;
           } else if (this.i > 9) {
             window.clearInterval(this.timer);
             this.timer = null;
@@ -977,6 +1094,8 @@ export default {
       this.setForm = {};
       this.searchloading = false;
       this.setloading = false;
+      this.lookTime = "";
+      this.showLookTime = false;
     },
   },
 };
@@ -1008,6 +1127,10 @@ export default {
   .searchImage {
     margin-left: 110px;
   }
+  .looktime {
+    margin-top: 6px;
+    margin-left: 110px;
+  }
   .flexno {
     display: flex;
     height: 32px;

src/views/photographicDevice/components/pictureTags.vue

@@ -46,7 +46,7 @@
               <el-option
                 v-for="item in picoptions"
                 :key="item.id"
-                :label="item.name"
+                :label="item.channelName"
                 :value="item.id"
               >
               </el-option>
@@ -147,8 +147,9 @@ export default {
       this.isShow = true;
       this.pictureData = val; //获取当前列表数据
       this.picoptions = val.list; //获取所有通道
+      console.log("asdasdadadad", this.picoptions);
       this.channelId = val.list[0].id;
-      this.picvalue = val.list[0].name; //获取第一个通道
+      this.picvalue = val.list[0].channelName; //获取第一个通道
       this.termId = val.id; //装置id
       this.getcanvansPic(val, this.channelId);
     },
@@ -169,7 +170,8 @@ export default {
         .then((res) => {
           console.log(res);
           this.markId = res.data.markId;
-
+          this.color = res.data.color !== null ? res.data.color : "#f00";
+          this.num = res.data.boderWidth !== null ? res.data.boderWidth : 2;
           if (res.data.path !== null) {
             this.picsrc = res.data.path;
             if (res.data.list.length !== 0) {

src/views/photographicDevice/components/runStatus.vue

@@ -1,16 +1,32 @@
 <template>
   <el-dialog
     class="runStatusDialog"
-    title="装置运行状态"
+    title="运行状态报"
     :visible.sync="isShow"
     :close-on-click-modal="false"
-    width="1280px"
+    width="1360px"
   >
+    <div class="zzinfo">
+      <span v-if="rowInfo.protocol == '65280'"> 国网I1 </span>
+      <span v-if="rowInfo.protocol == '65296'"> 陕西 </span>
+      <span v-if="rowInfo.protocol == '65281'"> 安徽 </span>
+      <span v-if="rowInfo.protocol == '65282'"> 江苏 </span>
+      <span v-if="rowInfo.protocol == '65283'"> 湖南 </span>
+      <span v-if="rowInfo.protocol == '65284'"> 浙江 </span>
+      <span v-if="rowInfo.protocol == '65285'"> 河南全景 </span>
+      <span v-if="rowInfo.protocol == '65286'"> 河南郑州 </span>
+      <span v-if="rowInfo.protocol == '65290'"> 河南统一视频v2020 </span>
+      <span v-if="rowInfo.protocol == '65298'"> 宁夏 </span>
+      <span v-if="rowInfo.protocol == '2'"> 南网 </span>
+        <span>{{rowInfo.protocol}}</span>
+    </div>
     <el-form :inline="true" :model="formdata" class="demo-form-inline">
       <el-form-item label="开始日期">
         <el-date-picker
+          @change="changestartdate"
           v-model="formdata.starttime"
           type="datetime"
+          :picker-options="pickerOptions"
           placeholder="开始日期"
           value-format="timestamp"
         >
@@ -18,9 +34,10 @@
       </el-form-item>
       <el-form-item label="结束日期">
         <el-date-picker
+          @change="changeenddate"
           v-model="formdata.endtime"
           type="datetime"
-          default-time="23:59:59"
+          :picker-options="pickerOptions"
           placeholder="结束日期"
           value-format="timestamp"
           class="ml10"
@@ -29,7 +46,7 @@
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="onSubmit">查询</el-button>
-        <el-button type="primary">导出</el-button>
+        <el-button type="primary" @click="exportFault">导出</el-button>
       </el-form-item>
     </el-form>
     <el-table
@@ -38,6 +55,7 @@
       stripe
       tooltip-effect="dark"
       style="width: 100%"
+      height="442px"
       v-loading="loading"
     >
       <template slot="empty">
@@ -49,45 +67,36 @@
         </template>
       </el-table-column>
       <el-table-column
-        prop="name"
-        label="采集时间"
-        min-width="120"
+        prop="cmdid"
+        label="装置编号"
+        min-width="160"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="设备名称"
-        min-width="80"
-        show-overflow-tooltip
-      ></el-table-column>
+        prop="rsUpdateTimeStr"
+        label="装置上次启动时间"
+        min-width="140"
+      >
+      </el-table-column>
       <el-table-column
-        prop="name"
-        label="设备编号"
-        min-width="120"
+        prop="signalStrength2g"
+        label="2G信号强度"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
+        prop="signalStrength4g"
         label="4G信号强度"
-        min-width="80"
         show-overflow-tooltip
       ></el-table-column>
+
       <el-table-column
-        prop="name"
-        label="2G信号强度"
-        min-width="80"
+        prop="remainingRam"
+        label="剩余运行内存（M）"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="剩余运行内存"
-        min-width="80"
-        show-overflow-tooltip
-      ></el-table-column>
-      <el-table-column
-        prop="name"
-        label="剩余存储内存"
-        min-width="100"
+        prop="remainingRom"
+        label="剩余存储内存（M）"
         show-overflow-tooltip
       ></el-table-column>
     </el-table>
@@ -104,36 +113,97 @@
       </el-pagination>
     </div>
     <div slot="footer" class="dialog-footer">
-      <el-button @click="isShow = false">取 消</el-button>
+      <el-button @click="hide">取 消</el-button>
     </div>
   </el-dialog>
 </template>
 <script>
-import { getLineListJoggle } from "@/utils/api/index";
+import {
+  getTermRunningHistoryApi,
+  getTermRunningHistoryExcel,
+} from "@/utils/api/index";
 export default {
   data() {
     return {
       isShow: false,
       formdata: {},
-      listData: [
-        {
-          name: "测试",
-        },
-        {
-          name: "测试2",
-        },
-      ],
+      rowInfo: "",
+      listData: [],
       loading: false,
-      seltermid: "", //装置id
-      selcmdId: "", //cmdId
-      requestId: "",
       page: 1, // 当前页数
-      pageSize: 20, // 每页数量
+      pageSize: 10, // 每页数量
       total: 0, //总条数
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now(); // 禁用大于今天的日期
+        },
+      },
     };
   },
+  watch: {
+    endtime(newVal) {
+      if (newVal) {
+        const date = new Date(newVal);
+        date.setHours(23);
+        date.setMinutes(59);
+        date.setSeconds(59);
+        this.formdata.endtime = date;
+      }
+    },
+  },
+  created() {},
   mounted() {},
   methods: {
+    getTime() {
+      const thirtyDaysAgo = new Date();
+      thirtyDaysAgo.setHours(0); // 设置小时为23
+      thirtyDaysAgo.setMinutes(0); // 设置分钟为59
+      thirtyDaysAgo.setSeconds(0); // 设置秒数为59
+      console.log(
+        new Date(thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30))
+      );
+      const startTimeNew = new Date(
+        thirtyDaysAgo.setDate(thirtyDaysAgo.getDate())
+      ).getTime();
+      this.$set(this.formdata, "starttime", startTimeNew);
+      console.log("开始时间", this.formdata.starttime);
+      const currentDate = new Date(); // 获取当前时间
+      currentDate.setHours(23); // 设置小时为23
+      currentDate.setMinutes(59); // 设置分钟为59
+      currentDate.setSeconds(59); // 设置秒数为59
+      this.$set(this.formdata, "endtime", currentDate.getTime());
+      console.log("结束时间", this.formdata.endtime);
+      this.getfaultinfo();
+    },
+    changestartdate(val) {
+      console.log(val);
+      if (val == null) {
+        console.log(new Date());
+        const startDate = new Date();
+        startDate.setHours(0); // 设置小时为23
+        startDate.setMinutes(0); // 设置分钟为59
+        startDate.setSeconds(0); // 设置秒数为59
+        this.formdata.starttime = startDate;
+        console.log(this.formdata.starttime);
+      } else {
+        this.formdata.starttime = val;
+      }
+    },
+    //结束日期
+    changeenddate(val) {
+      if (val == null) {
+        console.log(new Date());
+        const endDate = new Date();
+        endDate.setHours(23); // 设置小时为23
+        endDate.setMinutes(59); // 设置分钟为59
+        endDate.setSeconds(59); // 设置秒数为59
+        this.formdata.endtime = endDate;
+        console.log(this.formdata.endtime);
+      } else {
+        this.formdata.endtime = val;
+        console.log(val);
+      }
+    },
     //查询
     onSubmit() {
       if (this.formdata.starttime > this.formdata.endtime) {
@@ -144,44 +214,60 @@ export default {
           type: "warning",
         });
       }
-      this.getlistnr();
+      this.getfaultinfo();
+    },
+    //导出
+    exportFault() {
+      window.location.href =
+        "/api/getTermRunningHistoryExcel?termid=" + this.rowInfo.id;
     },
     //获取数据
-    getlistnr(val) {
-      console.log(val);
-      this.seltermid = val.id;
-      this.selcmdId = val.cmdid;
+    getfaultinfo() {
       this.loading = true;
-      getLineListJoggle({
+      getTermRunningHistoryApi({
+        termid: this.rowInfo.id,
+        // starttime: this.formdata.starttime,
+        // endtime: this.formdata.endtime,
         pageindex: this.page,
         pagesize: this.pageSize,
       }).then((res) => {
         this.listData = res.data.list;
         this.total = res.data.total;
-        this.loading = false;
+        this.$nextTick(() => {
+          this.loading = false;
+        });
       });
     },
     //点击分页
     handleCurrentChange(val) {
       this.page = val;
-      this.getlistnr();
+      this.getfaultinfo();
     },
     //每页条数
     handleSizeChange(val) {
       this.pageSize = val;
-      this.getlistnr();
+      this.getfaultinfo();
     },
-    display() {
+    display(row) {
+      console.log(row);
+      this.rowInfo = row;
       this.isShow = true;
+      this.getTime();
     },
     hide() {
       this.isShow = false;
+      this.formdata = {};
     },
   },
 };
 </script>
 <style lang="less">
 .runStatusDialog {
+  .zzinfo {
+    position: absolute;
+    top: 22px;
+    left: 126px;
+  }
   .pageNation {
     justify-content: flex-start;
     margin-top: 16px;

src/views/photographicDevice/components/towerDialog.vue

@@ -13,6 +13,20 @@
       :rules="rules"
       :model="formdata"
     >
+      <el-form-item label="电压等级：" prop="dyId">
+        <el-select
+          v-model="formdata.dyId"
+          placeholder="请选择"
+          @change="getSearchxl"
+        >
+          <el-option
+            v-for="item in dyOptions"
+            :key="item.id"
+            :label="item.name"
+            :value="item.id"
+          ></el-option>
+        </el-select>
+      </el-form-item>
       <el-form-item label="线路名称：" prop="lineId">
         <el-select v-model="formdata.lineId" placeholder="请选择">
           <el-option
@@ -44,15 +58,17 @@
   </el-dialog>
 </template>
 <script>
-import { getLineListApi, addTowerApi, updateTowerApi } from "@/utils/api/index";
+import { updateTowerApi, getSearchInfo } from "@/utils/api/index";
 
 export default {
   data() {
     return {
       isShow: false,
       lineOptions: [],
+      dyOptions: [],
       formdata: {},
       rules: {
+        dyId: [{ required: true, message: "请选择电压", trigger: "blur" }],
         towerName: [
           { required: true, message: "请输入杆塔名称", trigger: "blur" },
         ],
@@ -66,17 +82,26 @@ export default {
       },
     };
   },
-  mounted() {
-    this.getLineListdata();
-  },
+  mounted() {},
   methods: {
-    getLineListdata() {
-      getLineListApi({ pageindex: 1, pagesize: 100 })
+    //获取电压信息
+    getSearchdy() {
+      getSearchInfo({ type: 1 })
+        .then((res) => {
+          this.dyOptions = res.data.list;
+          this.getSearchxl();
+        })
+        .catch((err) => {});
+    },
+    //获取线路数据
+    getSearchxl() {
+      getSearchInfo({ type: 2, id: this.formdata.dyId })
         .then((res) => {
           this.lineOptions = res.data.list;
         })
         .catch((err) => {});
     },
+
     //判断
     getdataform(val) {
       //this.formdata = val;
@@ -123,6 +148,7 @@ export default {
     },
     display() {
       this.isShow = true;
+      this.getSearchdy();
     },
     hide() {
       this.isShow = false;

src/views/photographicDevice/components/videoCapture.vue

@@ -81,6 +81,9 @@
           @click="videoSearch()"
           >查询</el-button
         >
+        <p class="looktime" v-if="lookTime && showLookTime">
+          {{ $moment(lookTime * 1000).format("YYYY-MM-DD HH:mm:ss") }}
+        </p>
       </div>
     </el-tab-pane>
     <el-tab-pane label="设置参数" name="2">
@@ -203,6 +206,32 @@ export default {
           name: "VGA",
         },
       ], //分辨率
+      zzratiolist: [
+        {
+          id: 1,
+          name: "QVGA",
+        },
+        {
+          id: 2,
+          name: "VGA",
+        },
+        {
+          id: 3,
+          name: "480p;",
+        },
+        {
+          id: 4,
+          name: "720P",
+        },
+        {
+          id: 5,
+          name: "1080P",
+        },
+        {
+          id: 6,
+          name: "其它",
+        },
+      ], //分辨率
       selaccess: "", //选中的通道
       capturenr: {}, //查询后的内容
       setForm: {
@@ -224,6 +253,8 @@ export default {
       selcmdId: "", //cmdId
       requestId: "",
       onlinestatus: "",
+      lookTime: "",
+      showLookTime: false,
     };
   },
   mounted() {},
@@ -231,6 +262,7 @@ export default {
     handleClick(tab, event) {
       console.log(tab, event);
       this.capturenr = {};
+      this.lookTime = "";
     },
     //获取设备通道
     getSingleAccess(val) {
@@ -253,7 +285,8 @@ export default {
     getRatio() {
       getResolutionRatio({ type: 1 })
         .then((res) => {
-          this.ratiolist = this.hnratiolist;
+          //this.ratiolist = this.hnratiolist;
+          this.ratiolist = this.zzratiolist;
           this.$set(this.setForm, "videoFormat", this.ratiolist[0].id);
         })
         .catch((err) => {});
@@ -269,6 +302,10 @@ export default {
             name: "act",
             value: "videoparams",
           },
+          {
+            name: "udp",
+            value: 1,
+          },
           {
             name: "flag",
             value: 0,
@@ -309,6 +346,10 @@ export default {
             name: "act",
             value: "videoparams",
           },
+          {
+            name: "udp",
+            value: 1,
+          },
           {
             name: "flag",
             value: 1,
@@ -348,6 +389,7 @@ export default {
         .then((res) => {
           console.log(res);
           this.requestid = res.data.requestId;
+          this.showLookTime = false;
           //this.getinfo1();
 
           clearInterval(this.timer);
@@ -381,6 +423,8 @@ export default {
               message: "信息已更新",
               type: "success",
             });
+            this.lookTime = res.data.requestTime;
+            this.showLookTime = true;
           } else if (this.i > 9) {
             window.clearInterval(this.timer);
             this.timer = null;
@@ -409,6 +453,8 @@ export default {
       this.setForm = {};
       this.searchloading = false;
       this.setloading = false;
+      this.lookTime = "";
+      this.showLookTime = false;
     },
   },
 };
@@ -440,6 +486,10 @@ export default {
   .searchImage {
     margin-left: 110px;
   }
+  .looktime {
+    margin-top: 6px;
+    margin-left: 110px;
+  }
   .flexno {
     display: flex;
     height: 32px;

src/views/photographicDevice/components/workStatus.vue

@@ -1,16 +1,32 @@
 <template>
   <el-dialog
-    class="workStatus"
-    title="工作状态"
+    class="workStatusBox"
+    title="工作状态报"
     :visible.sync="isShow"
     :close-on-click-modal="false"
-    width="1280px"
+    width="1360px"
   >
+    <div class="zzinfo">
+      <span v-if="rowInfo.protocol == '65280'"> 国网I1 </span>
+      <span v-if="rowInfo.protocol == '65296'"> 陕西 </span>
+      <span v-if="rowInfo.protocol == '65281'"> 安徽 </span>
+      <span v-if="rowInfo.protocol == '65282'"> 江苏 </span>
+      <span v-if="rowInfo.protocol == '65283'"> 湖南 </span>
+      <span v-if="rowInfo.protocol == '65284'"> 浙江 </span>
+      <span v-if="rowInfo.protocol == '65285'"> 河南全景 </span>
+      <span v-if="rowInfo.protocol == '65286'"> 河南郑州 </span>
+      <span v-if="rowInfo.protocol == '65290'"> 河南统一视频v2020 </span>
+      <span v-if="rowInfo.protocol == '65298'"> 宁夏 </span>
+      <span v-if="rowInfo.protocol == '2'"> 南网 </span>
+      <span>{{ rowInfo.protocol }}</span>
+    </div>
     <el-form :inline="true" :model="formdata" class="demo-form-inline">
       <el-form-item label="开始日期">
         <el-date-picker
+          @change="changestartdate"
           v-model="formdata.starttime"
           type="datetime"
+          :picker-options="pickerOptions"
           placeholder="开始日期"
           value-format="timestamp"
         >
@@ -18,9 +34,10 @@
       </el-form-item>
       <el-form-item label="结束日期">
         <el-date-picker
+          @change="changeenddate"
           v-model="formdata.endtime"
           type="datetime"
-          default-time="23:59:59"
+          :picker-options="pickerOptions"
           placeholder="结束日期"
           value-format="timestamp"
           class="ml10"
@@ -29,7 +46,7 @@
       </el-form-item>
       <el-form-item>
         <el-button type="primary" @click="onSubmit">查询</el-button>
-        <el-button type="primary">导出</el-button>
+        <el-button type="primary" @click="exportFault">导出</el-button>
       </el-form-item>
     </el-form>
     <el-table
@@ -38,6 +55,7 @@
       stripe
       tooltip-effect="dark"
       style="width: 100%"
+      height="466px"
       v-loading="loading"
     >
       <template slot="empty">
@@ -49,73 +67,93 @@
         </template>
       </el-table-column>
       <el-table-column
-        prop="name"
-        label="采集时间"
-        min-width="120"
+        prop="cmdid"
+        label="装置编号"
+        min-width="160"
         show-overflow-tooltip
       ></el-table-column>
+      <el-table-column prop="wsUpdateTimeStr" label="采集时间" min-width="140">
+      </el-table-column>
       <el-table-column
-        prop="name"
-        label="设备名称"
-        min-width="80"
+        prop="batteryVoltage"
+        label="电池电压(V)"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="设备编号"
-        min-width="120"
+        prop="opTemperature"
+        label="工作温度（℃）"
         show-overflow-tooltip
       ></el-table-column>
+
       <el-table-column
-        prop="name"
-        label="电源电压"
-        min-width="80"
+        prop="batteryCapacity"
+        label="电池电量（%）"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="工作温度"
-        min-width="80"
+        prop="floatingChargeStr"
+        label="浮充状态"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="电池电量"
-        min-width="80"
+        prop="totalWorkingTime"
+        label="工作总时间(小时)"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="浮充状态"
-        min-width="100"
+        prop="workingTime"
+        label="连续工作时间(小时)"
         show-overflow-tooltip
-      >
-        <template slot-scope="scope">{{
-          scope.row.name == 0 ? "充电" : "放电"
-        }}</template>
-      </el-table-column>
+      ></el-table-column>
       <el-table-column
-        prop="name"
-        label="工作总时间"
-        min-width="120"
+        prop="connectionStr"
+        label="网络连接状态"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="连续工作时间"
-        min-width="100"
+        prop="gprsStr"
+        label="GPRS信号强度"
         show-overflow-tooltip
       ></el-table-column>
       <el-table-column
-        prop="name"
-        label="网络连接状态"
-        min-width="100"
+        prop="recvFlowStr"
+        label="当月接收流量（M）"
         show-overflow-tooltip
       >
-        <template slot-scope="scope">{{
-          scope.row.name == 0 ? "已连接" : "未连接"
-        }}</template>
+        <template slot-scope="scope">
+          <span>{{ (scope.row.recvFlowStr / 1024).toFixed(2) }}</span>
+        </template>
       </el-table-column>
+      <el-table-column
+        prop="sendFlowStr"
+        label="当月发送流量(M)"
+        show-overflow-tooltip
+      >
+        <template slot-scope="scope">
+          <span>{{ (scope.row.sendFlowStr / 1024).toFixed(2) }}</span>
+        </template></el-table-column
+      >
+      <!-- <el-table-column
+        prop="recvFlowStr"
+        label="当月发送流量(M)"
+        show-overflow-tooltip
+      ></el-table-column>
+      <el-table-column
+        prop="sendFlowStr"
+        label="当月接收流量（M）"
+        show-overflow-tooltip
+      ></el-table-column> -->
+
+      <el-table-column
+        prop="protocolVersion"
+        label="通信协议版本"
+        show-overflow-tooltip
+      ></el-table-column>
+      <!-- <el-table-column
+        prop="protocolVersion"
+        label="GPRS信号强度"
+        show-overflow-tooltip
+      ></el-table-column> -->
     </el-table>
     <div class="pageNation">
       <el-pagination
@@ -130,36 +168,97 @@
       </el-pagination>
     </div>
     <div slot="footer" class="dialog-footer">
-      <el-button @click="isShow = false">取 消</el-button>
+      <el-button @click="hide">取 消</el-button>
     </div>
   </el-dialog>
 </template>
 <script>
-import { getLineListJoggle } from "@/utils/api/index";
+import {
+  getWorkingStatusHistoryApi,
+  getWorkingStatusHistoryExcel,
+} from "@/utils/api/index";
 export default {
   data() {
     return {
       isShow: false,
       formdata: {},
-      listData: [
-        {
-          name: "测试",
-        },
-        {
-          name: "测试2",
-        },
-      ],
+      rowInfo: "",
+      listData: [],
       loading: false,
-      seltermid: "", //装置id
-      selcmdId: "", //cmdId
-      requestId: "",
       page: 1, // 当前页数
-      pageSize: 20, // 每页数量
+      pageSize: 10, // 每页数量
       total: 0, //总条数
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now(); // 禁用大于今天的日期
+        },
+      },
     };
   },
+  watch: {
+    endtime(newVal) {
+      if (newVal) {
+        const date = new Date(newVal);
+        date.setHours(23);
+        date.setMinutes(59);
+        date.setSeconds(59);
+        this.formdata.endtime = date;
+      }
+    },
+  },
+  created() {},
   mounted() {},
   methods: {
+    getTime() {
+      const thirtyDaysAgo = new Date();
+      thirtyDaysAgo.setHours(0); // 设置小时为23
+      thirtyDaysAgo.setMinutes(0); // 设置分钟为59
+      thirtyDaysAgo.setSeconds(0); // 设置秒数为59
+      console.log(
+        new Date(thirtyDaysAgo.setDate(thirtyDaysAgo.getDate() - 30))
+      );
+      const startTimeNew = new Date(
+        thirtyDaysAgo.setDate(thirtyDaysAgo.getDate())
+      ).getTime();
+      this.$set(this.formdata, "starttime", startTimeNew);
+      console.log("开始时间", this.formdata.starttime);
+      const currentDate = new Date(); // 获取当前时间
+      currentDate.setHours(23); // 设置小时为23
+      currentDate.setMinutes(59); // 设置分钟为59
+      currentDate.setSeconds(59); // 设置秒数为59
+      this.$set(this.formdata, "endtime", currentDate.getTime());
+      console.log("结束时间", this.formdata.endtime);
+      this.getfaultinfo();
+    },
+    changestartdate(val) {
+      console.log(val);
+      if (val == null) {
+        console.log(new Date());
+        const startDate = new Date();
+        startDate.setHours(0); // 设置小时为23
+        startDate.setMinutes(0); // 设置分钟为59
+        startDate.setSeconds(0); // 设置秒数为59
+        this.formdata.starttime = startDate;
+        console.log(this.formdata.starttime);
+      } else {
+        this.formdata.starttime = val;
+      }
+    },
+    //结束日期
+    changeenddate(val) {
+      if (val == null) {
+        console.log(new Date());
+        const endDate = new Date();
+        endDate.setHours(23); // 设置小时为23
+        endDate.setMinutes(59); // 设置分钟为59
+        endDate.setSeconds(59); // 设置秒数为59
+        this.formdata.endtime = endDate;
+        console.log(this.formdata.endtime);
+      } else {
+        this.formdata.endtime = val;
+        console.log(val);
+      }
+    },
     //查询
     onSubmit() {
       if (this.formdata.starttime > this.formdata.endtime) {
@@ -170,45 +269,66 @@ export default {
           type: "warning",
         });
       }
-      this.getlistnr();
+      this.getfaultinfo();
+    },
+    //导出
+    exportFault() {
+      window.location.href =
+        "/api/getWorkingStatusHistoryExcel?termid=" + this.rowInfo.id;
     },
     //获取数据
-    getlistnr(val) {
-      console.log(val);
-      this.seltermid = val.id;
-      this.selcmdId = val.cmdid;
+    getfaultinfo() {
       this.loading = true;
-      getLineListJoggle({
+      getWorkingStatusHistoryApi({
+        termid: this.rowInfo.id,
+        starttime: this.formdata.starttime,
+        endtime: this.formdata.endtime,
         pageindex: this.page,
         pagesize: this.pageSize,
       }).then((res) => {
-        this.listData = res.data.list;
-        this.total = res.data.total;
-        this.loading = false;
+        if (res.code == 200) {
+          this.listData = res.data.list;
+          this.total = res.data.total;
+          this.$nextTick(() => {
+            this.loading = false;
+          });
+        } else {
+          this.$nextTick(() => {
+            this.loading = false;
+          });
+        }
       });
     },
     //点击分页
     handleCurrentChange(val) {
       this.page = val;
-      this.getlistnr();
+      this.getfaultinfo();
     },
     //每页条数
     handleSizeChange(val) {
       this.pageSize = val;
-      this.getlistnr();
+      this.getfaultinfo();
     },
-    display() {
+    display(row) {
+      console.log(row);
+      this.rowInfo = row;
       this.isShow = true;
+      this.getTime();
     },
     hide() {
       this.isShow = false;
+      this.formdata = {};
     },
   },
 };
 </script>
-<<<<<<< HEAD
 <style lang="less">
-.workStatus {
+.workStatusBox {
+  .zzinfo {
+    position: absolute;
+    top: 22px;
+    left: 126px;
+  }
   .pageNation {
     justify-content: flex-start;
     margin-top: 16px;
@@ -221,6 +341,3 @@ export default {
   }
 }
 </style>
-=======
-<style lang="less" scoped></style>
->>>>>>> hn1.0

src/views/photographicDevice/index.vue

@@ -16,6 +16,13 @@
             @click="handleExport()"
             >导出</el-button
           >
+          <el-button
+            class="iccidbtn"
+            type="primary"
+            icon="el-icon-document"
+            @click="handleICCID()"
+            >导入ICCID</el-button
+          >
         </div>
       </div>
       <div class="searchBox">
@@ -64,6 +71,16 @@
               ></el-option>
             </el-select>
           </el-form-item>
+          <el-form-item label="规约" class="isonLineClass">
+            <el-select v-model="formdata.protocol" filterable>
+              <el-option
+                v-for="item in protocolOptions"
+                :key="item.id"
+                :label="item.name"
+                :value="item.id"
+              ></el-option>
+            </el-select>
+          </el-form-item>
           <el-form-item>
             <el-input
               v-model="formdata.search"
@@ -91,6 +108,11 @@
           highlight-current-row
           :row-key="getRowKeys"
         >
+          <el-table-column label="序号">
+            <template slot-scope="scope">
+              <span>{{ (page - 1) * pageSize + scope.$index + 1 }}</span>
+            </template>
+          </el-table-column>
           <el-table-column prop="dyName" label="电压等级" show-overflow-tooltip>
           </el-table-column>
 
@@ -121,6 +143,7 @@
               }}</el-link>
             </template>
           </el-table-column>
+
           <el-table-column
             prop="equipName"
             label="设备名称"
@@ -129,13 +152,26 @@
           >
           </el-table-column>
           <el-table-column
-            prop="cmdId"
+            prop="cmdid"
             label="设备编号"
             show-overflow-tooltip
             min-width="150"
           >
           </el-table-column>
-
+          <el-table-column
+            prop="devType"
+            label="设备类型"
+            show-overflow-tooltip
+            min-width="150"
+          >
+            <template slot-scope="scope">
+              <span v-if="scope.row.devType == 1">微拍</span>
+              <span v-if="scope.row.devType == 2">覆冰拉力</span>
+              <span v-if="scope.row.devType == 3">微气象</span>
+              <span v-if="scope.row.devType == 23">覆冰和微气象</span>
+              <span v-if="scope.row.devType == 123">微拍、覆冰、微气象</span>
+            </template>
+          </el-table-column>
           <el-table-column
             prop="protocolName"
             label="规约名称"
@@ -143,13 +179,36 @@
             min-width="90"
           />
           <el-table-column
-            prop="isonline"
+            prop="onlinestatus"
             label="是否在线"
             show-overflow-tooltip
           >
             <template slot-scope="scope">
-              {{ scope.row.isonline ? "在线" : "离线" }}</template
-            >
+              <!-- {{ scope.row.onlinestatus ? "在线" : "离线" }} -->
+              <span style="color: #169e8c" v-if="scope.row.onlinestatus == 1"
+                >在线</span
+              >
+              <span
+                style="color: #f56c6c"
+                v-else-if="scope.row.onlinestatus == 0"
+                >离线</span
+              >
+              <!-- <span style="color: #e6a23c" v-else>休眠</span> -->
+            </template>
+          </el-table-column>
+          <el-table-column
+            prop="isfavor"
+            label="监测离线"
+            show-overflow-tooltip
+          >
+            <template slot-scope="scope">
+              <span style="color: #169e8c" v-if="scope.row.isfavor == 1"
+                >是</span
+              >
+              <span style="color: #f56c6c" v-else-if="scope.row.isfavor == 0"
+                >否</span
+              >
+            </template>
           </el-table-column>
           <el-table-column
             prop="hasPan"
@@ -161,20 +220,21 @@
             >
           </el-table-column>
 
-          <el-table-column prop="sim" label="SIM卡号" show-overflow-tooltip>
-          </el-table-column>
           <el-table-column
             prop="netType"
             label="网络类型"
             show-overflow-tooltip
           >
             <template slot-scope="scope">
-              <span v-if="scope.row.netType == 1"> 移动</span>
-              <span v-if="scope.row.netType == 2"> 联通</span>
-              <span v-if="scope.row.netType == 3"> 电信</span>
+              <span v-if="scope.row.netType == 1"> 大汉移动</span>
+              <span v-if="scope.row.netType == 2"> 公田移动</span>
+              <span v-if="scope.row.netType == -1"> 无绑定</span>
             </template>
           </el-table-column>
-
+          <!-- <el-table-column prop="iccid" label="iccid" show-overflow-tooltip>
+          </el-table-column>
+          <el-table-column prop="sim" label="SIM卡号" show-overflow-tooltip>
+          </el-table-column> -->
           <el-table-column prop="model" label="装置型号" show-overflow-tooltip>
           </el-table-column>
           <el-table-column
@@ -196,12 +256,7 @@
               }}</template
             >
           </el-table-column>
-          <el-table-column
-            prop="status"
-            label="装置状态"
-            show-overflow-tooltip
-            v-if="roleUser != 2"
-          >
+          <el-table-column prop="status" label="装置状态" show-overflow-tooltip>
             <template slot-scope="scope">
               {{ scope.row.status == 1 ? "运行中" : "已删除" }}
             </template>
@@ -209,8 +264,8 @@
           <el-table-column
             fixed="right"
             label="操作"
-            width="340"
-            v-if="roleUser != 2"
+            width="380"
+            v-if="roleUser == 0"
           >
             <template slot-scope="scope">
               <el-dropdown
@@ -234,8 +289,12 @@
                     >运行状态</el-dropdown-item
                   >
                   <el-dropdown-item command="GPS">GPS位置</el-dropdown-item>
+                  <el-dropdown-item command="faultInfo"
+                    >故障信息报</el-dropdown-item
+                  >
                 </el-dropdown-menu>
               </el-dropdown>
+
               <el-button
                 @click.native.stop="handleParameterSet(scope.row)"
                 type="text"
@@ -247,23 +306,20 @@
                 >修改</el-button
               >
               <el-button
+                @click.native.stop="handlexgiccid(scope.row)"
                 type="text"
-                @click.native.stop="handlepicture(scope.row)"
-                >图片标记</el-button
+                >修改ICCID</el-button
               >
               <el-button
                 type="text"
-                class="deleteText"
-                @click.native.stop="handleDelete(scope.row)"
-                v-if="scope.row.status == 1"
-                >关闭</el-button
+                @click.native.stop="handlepicture(scope.row)"
+                >图片标记</el-button
               >
               <el-button
                 type="text"
                 class="deleteText"
                 @click.native.stop="handleDelete(scope.row)"
-                v-if="scope.row.status == 0"
-                >打开</el-button
+                >删除</el-button
               >
             </template>
           </el-table-column>
@@ -275,10 +331,17 @@
                 >修改</el-button
               >
               <el-button
+                v-if="notes !== '覆冰用户使用'"
                 type="text"
                 @click.native.stop="handlepicture(scope.row)"
                 >图片标记</el-button
               >
+              <el-button
+                v-if="notes == '覆冰用户使用'"
+                @click.native.stop="handleParameterSet(scope.row)"
+                type="text"
+                >参数配置</el-button
+              >
               <el-button
                 type="text"
                 class="deleteText"
@@ -314,9 +377,14 @@
     <workStatus ref="workStatus_ref"></workStatus>
     <runStatus ref="runStatus_ref"></runStatus>
     <gpsSite ref="gpsSite_ref"></gpsSite>
+    <faultInfomation ref="fultInfo_ref"></faultInfomation>
     <!-- 新增线路 -->
     <add-lineDialog ref="addlineDialogref"></add-lineDialog>
     <towerDialog ref="towerDialogref"></towerDialog>
+    <!-- 导入iccid -->
+    <iccidDialog ref="iccidref"></iccidDialog>
+    <!-- 修改iccid -->
+    <iccidChangeDialog ref="xgiccidref"></iccidChangeDialog>
   </div>
 </template>
 <script>
@@ -325,6 +393,7 @@ import {
   deleteTerminalJoggle,
   getSearchInfo,
   getTerminalListExcel,
+  getProtocolList,
 } from "@/utils/api/index";
 import moment from "moment";
 import addPhotoDialog from "./components/addPhotoDialog.vue";
@@ -336,9 +405,13 @@ import baseInfor from "./components/baseInfor.vue";
 import workStatus from "./components/workStatus.vue";
 import runStatus from "./components/runStatus.vue";
 import gpsSite from "./components/gpsSite.vue";
+import faultInfomation from "./components/faultInfomation.vue";
 import addLineDialog from "./components/addLineDialog.vue";
 import towerDialog from "./components/towerDialog.vue";
+import iccidDialog from "./components/iccidDialog.vue";
+import iccidChangeDialog from "./components/iccidChangeDialog.vue";
 export default {
+  name: "photographicDevice",
   components: {
     addPhotoDialog,
     pictureTags,
@@ -350,6 +423,9 @@ export default {
     gpsSite,
     addLineDialog,
     towerDialog,
+    faultInfomation,
+    iccidDialog,
+    iccidChangeDialog,
   },
   data() {
     return {
@@ -361,12 +437,14 @@ export default {
         { id: 1, name: "在线" },
         { id: 0, name: "离线" },
       ],
+      protocolOptions: [{ id: -1, name: "全部" }], //规约数据
       formdata: {
         dyId: -1,
         lineId: -1,
         towerId: -1,
         search: "",
         isonline: -1,
+        protocol: -1,
       },
       roleUser: "",
       terminalTableData: [], //表格数据
@@ -391,6 +469,7 @@ export default {
         },
       ],
       gpsvalue: "1",
+      notes: localStorage.getItem("notes"),
     };
   },
   created() {
@@ -409,6 +488,7 @@ export default {
   },
   mounted() {
     this.getSearchdy();
+    this.getProtocol();
     this.terminalList();
   },
   methods: {
@@ -463,7 +543,17 @@ export default {
         })
         .catch((err) => {});
     },
-
+    getProtocol() {
+      //获取规约版本
+      getProtocolList()
+        .then((res) => {
+          console.log(res);
+          this.protocolOptions = [{ id: -1, name: "全部" }];
+          this.protocolOptions = this.protocolOptions.concat(res.data.list);
+          this.formdata.protocol = this.protocolOptions[0].id;
+        })
+        .catch((err) => {});
+    },
     //查询
     onSubmit() {
       this.page = 1;
@@ -472,7 +562,12 @@ export default {
     //重置
     onReset() {
       this.formdata = {
+        dyId: -1,
+        lineId: -1,
+        towerId: -1,
+        search: "",
         isonline: -1,
+        protocol: -1,
       };
 
       this.getSearchdy();
@@ -489,9 +584,11 @@ export default {
       getTerminalJoggle(this.formdata)
         .then((res) => {
           console.log(res);
-          this.terminalTableData = res.data.list;
-          this.total = res.data.total;
-          this.loading = false;
+          if (res.code == 200) {
+            this.loading = false;
+            this.terminalTableData = res.data.list;
+            this.total = res.data.total;
+          }
         })
         .catch((err) => {
           console.log(err); //代码错误、请求失败捕获
@@ -549,16 +646,19 @@ export default {
       console.log(command, row);
       switch (command) {
         case "info":
-          this.$refs.baseInfor_ref.display();
+          this.$refs.baseInfor_ref.display(row);
           break;
         case "workStatus":
-          this.$refs.workStatus_ref.display();
+          this.$refs.workStatus_ref.display(row);
           break;
         case "runStatus":
-          this.$refs.runStatus_ref.display();
+          this.$refs.runStatus_ref.display(row);
           break;
         case "GPS":
-          this.$refs.gpsSite_ref.display();
+          this.$refs.gpsSite_ref.display(row);
+          break;
+        case "faultInfo":
+          this.$refs.fultInfo_ref.display(row);
           break;
         default:
           break;
@@ -584,11 +684,9 @@ export default {
     //删除数据
     handleDelete(data) {
       console.log(data);
-      this.deleteArr.push({
-        termid: data.id,
-      });
+      this.deleteArr.push(data.id);
       console.log(this.deleteArr);
-      this.$confirm("确定要关闭该装置?", "提示", {
+      this.$confirm("确定要删除该装置?", "提示", {
         confirmButtonText: "确定",
         cancelButtonText: "取消",
         type: "warning",
@@ -597,12 +695,13 @@ export default {
           // 行设置向后台请求删除数据
           deleteTerminalJoggle({ list: this.deleteArr }).then((res) => {
             console.log(res);
+            this.deleteArr = [];
             this.terminalList(); //刷新
           });
           this.$message({
             duration: 1500,
             type: "success",
-            message: "关闭成功!",
+            message: "删除成功!",
             showClose: true,
           });
         })
@@ -615,6 +714,43 @@ export default {
           // });
         });
     },
+    // //打开该装置
+    // handleOpen(data) {
+    //   console.log(data);
+    //   this.deleteArr.push({
+    //     termid: data.id,
+    //   });
+    //   console.log(this.deleteArr);
+    //   this.$confirm("确定要打开该装置?", "提示", {
+    //     confirmButtonText: "确定",
+    //     cancelButtonText: "取消",
+    //     type: "success",
+    //   })
+    //     .then(() => {
+    //       // 行设置向后台请求删除数据
+    //       deleteTerminalJoggle({ list: this.deleteArr, type: 1 }).then(
+    //         (res) => {
+    //           console.log(res);
+    //           this.deleteArr = [];
+    //           this.terminalList(); //刷新
+    //         }
+    //       );
+    //       this.$message({
+    //         duration: 1500,
+    //         type: "success",
+    //         message: "打开成功!",
+    //         showClose: true,
+    //       });
+    //     })
+    //     .catch(() => {
+    //       // this.$message({
+    //       //   duration: 1500,
+    //       //   type: "info",
+    //       //   message: "已取消删除",
+    //       //   showClose: true,
+    //       // });
+    //     });
+    // },
     //点击分页
     handleCurrentChange(val) {
       this.page = val;
@@ -625,6 +761,14 @@ export default {
       this.pageSize = val;
       this.terminalList();
     },
+    //导入ICCID
+    handleICCID() {
+      this.$refs.iccidref.display();
+    },
+    //修改iccic
+    handlexgiccid(val) {
+      this.$refs.xgiccidref.display(val);
+    },
   },
 };
 </script>
@@ -666,6 +810,9 @@ export default {
     display: flex;
     justify-content: space-between;
     align-items: center;
+    .iccidbtn {
+      width: auto;
+    }
   }
   .searchBox {
     margin-top: 8px;

src/views/pictureRotation/index.vue

@@ -22,7 +22,7 @@
           <el-button type="primary" @click="setbtn">设置</el-button>
         </div>
       </div>
-      <div class="imageCenter" v-loading="loading" v-cloak>
+      <div class="imageCenter" v-loading="loading">
         <el-row
           v-for="i in rowNum"
           :key="'row-' + i"
@@ -31,7 +31,7 @@
           <el-col
             :span="24 / colNum"
             v-for="(item, index) in picList"
-            v-if="index < colNum * i && index >= colNum * (i - 1)"
+            v-show="index < colNum * i && index >= colNum * (i - 1)"
             :key="'col-' + index"
           >
             <div class="imgList" @click="handleShowHistory(item)">
@@ -39,7 +39,7 @@
                 v-if="item.path !== null && item.path.indexOf('videos') == -1"
                 class="bigpic"
               >
-                <img :src="item.path + '!1366x768'" @error="setDefaultImage" />
+                <img :src="item.path" @error="setDefaultImage" />
               </div>
               <div
                 class="bigpic"
@@ -93,15 +93,18 @@
             ></el-option>
           </el-select>
         </el-form-item>
-        <el-form-item label="画面布局" class="layoutBox">
-          <!-- <el-select v-model="selLayout" placeholder="s请选择">
+        <el-form-item label="选择通道">
+          <el-select v-model="channelVal" placeholder="请选择">
             <el-option
-              v-for="item in layoutOptions"
+              v-for="item in channelOption"
               :key="item.value"
-              :label="item.label"
+              :label="item.name"
               :value="item.value"
             ></el-option>
-          </el-select> -->
+          </el-select>
+        </el-form-item>
+
+        <el-form-item label="画面布局" class="layoutBox">
           <div class="selectGroup">
             <div class="rowbox">
               <el-radio-group v-model="rowradio" class="radio1">
@@ -134,27 +137,6 @@
       </div>
     </el-dialog>
     <morePicPreveiw ref="morePicPreveiw_ref"></morePicPreveiw>
-    <!-- <el-dialog
-      title="历史图片"
-      :visible.sync="historyPicdialog"
-      width="1366px"
-      :close-on-click-modal="false"
-      class="showDialogHistoryPic"
-    >
-      <div class="title">
-        {{ picInfoData.linename }}-{{ picInfoData.towername }}-（{{
-          picInfoData.alias !== null && picInfoData.alias !== ""
-            ? picInfoData.alias
-            : picInfoData.channnelname
-        }}） {{ $moment(picInfoData.photoTime).format("YYYY-MM-DD ") }}
-      </div>
-      <carouselChart
-        ref="carouselpic"
-        :terminalPhoto="terminalPhoto"
-        v-if="terminalPhoto.length > 0"
-        v-loading="historyPicLoading"
-      ></carouselChart>
-    </el-dialog> -->
   </div>
 </template>
 <script>
@@ -163,6 +145,7 @@ import { getPictureList, getTerminalPhotoListJoggle } from "@/utils/api/index";
 import morePicPreveiw from "../realTimeMonitor/components/morePicPreveiw";
 import defaultImage from "../../assets/img/nodatapic2.jpg";
 export default {
+  name: "pictureRotation",
   components: {
     morePicPreveiw,
   },
@@ -222,6 +205,12 @@ export default {
       rowradio: "4",
       colradio: "4",
       selLayout: 1,
+      channelVal: -1, //默认全部
+      channelOption: [
+        { name: "全部", value: -1 },
+        { name: "通道一", value: 1 },
+        { name: "通道二", value: 2 },
+      ],
       options: [
         {
           value: "选项1",
@@ -241,6 +230,7 @@ export default {
       nopicPath: require("@/assets/img/nopic.jpg"),
     };
   },
+
   methods: {
     setDefaultImage(e) {
       e.target.src = defaultImage;
@@ -304,17 +294,25 @@ export default {
       this.colradio = parseInt(localStorage.getItem("col"))
         ? parseInt(localStorage.getItem("col"))
         : 4;
+      this.channelVal = parseInt(localStorage.getItem("channelNum"))
+        ? parseInt(localStorage.getItem("channelNum"))
+        : -1;
     },
     submitForm() {
       localStorage.setItem("totalTime", this.selSpeed);
       localStorage.setItem("row", this.rowradio);
       localStorage.setItem("col", this.colradio);
+      localStorage.setItem("channelNum", this.channelVal);
       this.rowNum = parseInt(localStorage.getItem("row"))
         ? parseInt(localStorage.getItem("row"))
         : 4;
       this.colNum = parseInt(localStorage.getItem("col"))
         ? parseInt(localStorage.getItem("col"))
         : 4;
+      this.channelVal = parseInt(localStorage.getItem("channelNum"))
+        ? parseInt(localStorage.getItem("channelNum"))
+        : -1;
+      this.page = 1;
       this.pageSize = this.rowradio * this.colradio;
       this.setdialog = false;
       this.$message.success("设置成功");
@@ -329,12 +327,17 @@ export default {
     },
     //请求数据接口方法
     getPicData() {
-      this.loading = true;
-      this.picList = [];
-      getPictureList({
+      //this.loading = true;
+      console.log(this.picList);
+      //this.picList = [];
+      const params = {
         pageindex: this.page,
         pagesize: this.rowNum * this.colNum,
-      })
+      };
+      if (this.channelVal !== -1) {
+        params.channelid = this.channelVal;
+      }
+      getPictureList(params)
         .then((res) => {
           this.picList = res.data.list;
           this.totalPage = res.data.totalpage;
@@ -401,6 +404,11 @@ export default {
       ? parseInt(localStorage.getItem("col"))
       : 4;
     this.pageSize = this.rowradio * this.colradio;
+
+    this.channelVal = parseInt(localStorage.getItem("channelNum"))
+      ? parseInt(localStorage.getItem("channelNum"))
+      : -1;
+    console.log("我是第一次进来", this.channelVal);
     //this.toggleCountdown();
     this.getPicData();
   },

src/views/realTimeMonitor/components/activeSiderBar.vue

@@ -0,0 +1,315 @@
+<template>
+  <div class="activerealsideBar">
+    <div class="searchBar">
+      <el-input
+        placeholder="输入关键字进行过滤"
+        v-model="filterText"
+        prefix-icon="el-icon-search"
+        clearable
+      >
+      </el-input>
+    </div>
+    <!-- <div class="deviceNum">
+      <el-statistic title="装置在线 / 总数">
+        <template slot="formatter">
+          （<span>{{ onlineNum ? onlineNum : 0 }}</span> /
+          <span>{{ totalNum ? totalNum : 0 }}</span
+          >）
+        </template>
+      </el-statistic>
+    </div> -->
+    <!-- <div class="radioFilter">
+      <el-radio-group v-model="zzradio" @input="getRadio">
+        <el-radio :label="-1">全部</el-radio>
+        <el-radio :label="1">在线</el-radio>
+        <el-radio :label="0">离线</el-radio>
+      </el-radio-group>
+      <el-button
+        class="refresh"
+        @click="getLineTreeStatus"
+        type="text"
+        icon="el-icon-refresh-right"
+        >刷新</el-button
+      >
+    </div> -->
+    <el-tree
+      ref="tree"
+      :data="lineTreeData"
+      :props="defaultProps"
+      node-key="compositeKey"
+      :default-expanded-keys="defaultExpandIds"
+      highlight-current
+      :expand-on-click-node="true"
+      :filter-node-method="filterNode"
+      :current-node-key="currentNodekey"
+      @node-click="handleNodeClick"
+      accordion
+    >
+      <span class="custom-tree-node" slot-scope="{ node, data }">
+        <span
+          :title="
+            node.label + '(' + data.termCount + '/' + data.onlineNum + ')'
+          "
+        >
+          <span
+            v-if="data.title"
+            class="iconfont icon-dianlihangye"
+            style="margin-right: 6px"
+          >
+          </span>
+          <span v-if="!data.title && data.cmdid">
+            <span
+              class="iconfont icon-shexiangtoulixian"
+              v-if="data.onlinestatus == 0"
+              :class="data.onlinestatus == 0 ? 'disconnect' : ''"
+              style="margin-right: 6px"
+            ></span>
+            <span
+              class="iconfont icon-shexiangtou-lixian"
+              v-else
+              :class="data.onlinestatus == 0 ? 'disconnect' : ''"
+              style="margin-right: 6px"
+            ></span>
+          </span>
+          <span :class="data.onlinestatus == 0 ? 'disconnect' : ''"
+            >{{ node.label }}
+
+            <span class="num" v-if="data.title"
+              >({{ data.termCount }} / {{ data.onlineNum }})
+            </span>
+          </span>
+        </span>
+        <!-- <span>
+          {{ node.label }}
+        </span> -->
+      </span>
+    </el-tree>
+  </div>
+</template>
+<script>
+import EventBus from "@/utils/event-bus";
+import { getActivityApi } from "@/utils/api/reportApi";
+export default {
+  data() {
+    return {
+      filterText: "", //查询字段过滤
+
+      lineTreeData: [],
+      defaultExpandIds: [], //默认展开
+
+      defaultProps: {
+        //指定参数格式回显数据
+        children: "terms",
+        label: "name",
+        key: "compositeKey", // 确保这里使用的是 uniqueKey
+      },
+      currentData: {}, //当前选中的数据
+      currentNodekey: "", //默认选中的节点树,
+    };
+  },
+  components: {},
+  watch: {
+    filterText(newVal) {
+      this.handleFilter(); // 当 filterText 发生变化时执行过滤操作
+    },
+  },
+  mounted() {},
+  created() {
+    this.getactiveList(); //获取树状图
+  },
+  methods: {
+    transformData(data) {
+      return data.map((item) => ({
+        ...item, // 复制原始对象
+        name: item.title, // 将 title 改为 name
+        onlineNum: item.terms.reduce((count, term) => {
+          // 如果 term.online 等于 1，则增加计数器
+          return count + (term.onlinestatus === 1 ? 1 : 0);
+        }, 0),
+      }));
+    },
+    getactiveList() {
+      getActivityApi()
+        .then((res) => {
+          console.log(res);
+          console.log(res.data);
+          const dataValue = this.transformData(res.data);
+          this.lineTreeData = this.processData(dataValue);
+          console.log(this.lineTreeData);
+          this.currentData = JSON.parse(localStorage.getItem("currentData"));
+          this.defaultExpandIds = [this.lineTreeData[0].terms[0].compositeKey];
+          this.currentNodekey = this.lineTreeData[0].terms[0].compositeKey;
+          console.log("我是选中的id", this.currentNodekey);
+          this.currentNodeData = this.lineTreeData[0].terms[0];
+          this.$nextTick(() => {
+            this.$refs.tree.setCurrentKey(this.currentNodekey); //一定要加这个选中了否则样式没有出来
+            this.handleNodeClick(this.currentNodeData);
+          });
+        })
+        .catch((err) => {});
+    },
+    processData(data, level = 0) {
+      return data.map((node) => {
+        const compositeKey = `${level}-${node.id}`; // 创建复合标识符
+        node.compositeKey = compositeKey; // 将复合标识符添加到节点属性中
+        if (node.terms) {
+          node.terms = this.processData(node.terms, level + 1); // 递归处理子节点
+        }
+        return node;
+      });
+    },
+    handleFilter() {
+      // 在输入框输入完成后的500毫秒执行过滤节点方法
+      setTimeout(() => {
+        this.$refs.tree.filter(this.filterText);
+      }, 500);
+    },
+    //树状图搜索
+    filterNode(value, data, node) {
+      // 如果什么都没填全部匹配全部返回
+      if (!value) return true;
+      this.searchName = data.name + data.cmdid;
+      //console.log(this.searchName);
+      // 如果传入的value和data中的label相同，匹配成功
+
+      if (this.searchName.indexOf(value) !== -1) {
+        return true;
+      }
+      let nowval = data[this.defaultProps.label].toUpperCase();
+      return nowval.indexOf(value.toUpperCase()) !== -1;
+    },
+
+    //点击当前选中的treenode
+    handleNodeClick(data, node) {
+      console.log(data, node);
+
+      console.log(this.currentNodeKey);
+      if (data.hasOwnProperty("terms")) {
+        this.$nextTick(() => {
+          this.$refs.tree.setCurrentKey(this.currentNodeKey);
+        });
+        return;
+      }
+      // if (data.name == "收藏夹") {
+      //   return;
+      // }
+      // if (data.isfavor == 0 || data.isfavor == null) {
+      //   this.collectFlag = false;
+      // } else {
+      //   this.collectFlag = true;
+      // }
+      this.currentNodeKey = data.compositeKey;
+      this.currentData = data;
+      //this.scrollView();
+      this.$store.commit("currentData", this.currentData); //将currentData保存在vuex中
+      this.$store.commit("termId", this.currentData.id); //将currentData保存在vuex中
+      this.$store.commit("protocol", this.currentData.protocol); //将currentData保存在vuex中
+      this.$store.commit("cmdId", this.currentData.cmdid); //将currentData保存在vuex中
+      this.$parent.getCurrentData();
+    },
+  },
+  beforeRouteLeave(to, from, next) {},
+  deactivated() {},
+  beforeDestroy() {},
+};
+</script>
+<style lang="less">
+.activerealsideBar {
+  width: 312px;
+  display: flex;
+  flex-direction: column;
+  padding: 16px 0px;
+  height: calc(100% - 70px);
+
+  .searchBar {
+    width: 94%;
+    margin: 0 auto;
+    margin-bottom: 8px;
+  }
+  .deviceNum {
+    width: 94%;
+    margin: 0 auto;
+    margin-bottom: 8px;
+    height: 20px;
+    line-height: 20px;
+    font-size: 12px;
+    .el-statistic {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      .head {
+      }
+      .con {
+        color: #169e8c;
+      }
+    }
+  }
+  .radioFilter {
+    width: 94%;
+    margin: 0 auto;
+    margin-bottom: 8px;
+    font-size: 12px;
+    display: flex;
+    justify-content: space-around;
+    .refresh {
+    }
+    .el-radio-group {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .el-radio {
+        margin-right: 16px;
+      }
+    }
+  }
+  .el-tree {
+    overflow-y: scroll;
+    overflow-x: hidden;
+    .el-tree-node__content {
+      height: 32px;
+      font-size: 12px;
+    }
+    .custom-tree-node {
+      color: #333;
+      overflow: hidden;
+      span {
+        display: flex;
+        display: inline-table;
+        overflow: hidden;
+        align-items: center;
+      }
+      .num {
+        color: #169e8c;
+      }
+    }
+  }
+
+  .el-tree--highlight-current
+    .el-tree-node.is-current
+    > .el-tree-node__content {
+    // 设置颜色
+    color: #fff;
+    background: #169e8c;
+    .custom-tree-node {
+      color: #fff;
+      //overflow: hidden;
+      span {
+        display: flex;
+        //overflow: hidden;
+        align-items: center;
+        .num {
+          color: #fff;
+        }
+        .iconfont {
+          //width: 30px;
+          display: inline-table;
+        }
+      }
+    }
+  }
+
+  .disconnect {
+    color: #d3d3d3;
+  }
+}
+</style>

src/views/realTimeMonitor/components/alarmButton.vue

@@ -5,7 +5,11 @@
       <el-button type="primary">
         声光报警<i class="el-icon-arrow-down el-icon--right"></i>
       </el-button>
-      <el-dropdown-menu slot="dropdown" class="gpsdropStyle">
+      <el-dropdown-menu
+        slot="dropdown"
+        class="gpsdropStyle"
+        :append-to-body="false"
+      >
         <el-dropdown-item command="open">开启</el-dropdown-item>
         <el-dropdown-item command="close">关闭</el-dropdown-item>
       </el-dropdown-menu>

src/views/realTimeMonitor/components/cableButton.vue

@@ -5,7 +5,11 @@
       <el-button type="primary">
         线缆显示<i class="el-icon-arrow-down el-icon--right"></i>
       </el-button>
-      <el-dropdown-menu slot="dropdown" class="gpsdropStyle">
+      <el-dropdown-menu
+        slot="dropdown"
+        class="gpsdropStyle"
+        :append-to-body="false"
+      >
         <el-dropdown-item command="open">开启</el-dropdown-item>
         <el-dropdown-item command="close">关闭</el-dropdown-item>
       </el-dropdown-menu>

src/views/realTimeMonitor/components/carouselChartbak.vue

@@ -0,0 +1,999 @@
+<template>
+  <div class="thumb-example">
+    <div class="radioBox" v-if="roleUser == 8 || roleUser == 0">
+      {{ radioPx }} <span v-if="fileSize">({{ fileSize }})</span>
+      <span v-if="protocolInfo == '65280'"> 国网I1 </span>
+      <span v-if="protocolInfo == '65296'"> 陕西 </span>
+      <span v-if="protocolInfo == '65281'"> 安徽 </span>
+      <span v-if="protocolInfo == '65282'"> 江苏</span>
+      <span v-if="protocolInfo == '65283'"> 湖南 </span>
+      <span v-if="protocolInfo == '65284'"> 浙江 </span>
+      <span v-if="protocolInfo == '65285'"> 河南全景</span>
+      <span v-if="protocolInfo == '65286'"> 河南郑州 </span>
+      <span v-if="protocolInfo == '65290'"> 河南统一视频v2020 </span>
+      <span v-if="protocolInfo == '65298'"> 宁夏 </span>
+      <span v-if="protocolInfo == '2'"> 南网 </span>
+      <span>{{ protocolInfo }}</span>
+      <!-- <span>(共{{ terminalPhoto.length }}张)</span> -->
+    </div>
+
+    <div class="topPic">
+      <div
+        class="bigPic"
+        v-if="currentPicPath.indexOf('nopic') !== -1 && currentPicPath"
+      >
+        <el-image :src="currentPicPath"></el-image>
+      </div>
+      <div
+        class="bigPic"
+        v-else-if="currentPicPath && mediaType == 0"
+        v-loading="picLoading"
+      >
+        <!-- :preview-src-list="srcList"  @click="handleBigPicbox(currentPicPath)" -->
+        <el-image
+          :src="currentPicPath + '!1366x768'"
+          @load="loadImage"
+          @error="setDefaultImage"
+          ref="picJpg"
+          id="alarmPic"
+          width="100%"
+          height="100%"
+          :preview-src-list="srcList"
+        >
+          <template slot="error">
+            <img src="../../../assets/img/nodatapic2.jpg" />
+          </template>
+        </el-image>
+        <canvas id="myCanvas" class="myCanvas" ref="myCanvas"></canvas>
+        <canvas id="alarmCanvas" class="alarmCanvas" ref="alarmCanvas"></canvas>
+        <!-- <img :src="currentPicPath + '!1366x768'" @load="loadImage" /> -->
+      </div>
+      <div class="bigPic" v-else-if="currentPicPath && mediaType == 1">
+        <video
+          width="100%"
+          height="100%"
+          :src="currentPicPath"
+          controls="controls"
+          autoplay
+        ></video>
+      </div>
+      <div class="arrow leftArrow" @click="leftClick" v-if="activeSmall > 0">
+        <i class="el-icon-arrow-left"></i>
+      </div>
+      <el-button
+        v-if="mediaType !== 1"
+        class="downBtn"
+        @click.stop="downLoadPic(currentPicPath, currentPicPath)"
+        >下载图片</el-button
+      >
+      <div
+        class="arrow rightArrow"
+        @click="rightClick"
+        v-if="activeSmall !== terminalPhoto.length - 1"
+      >
+        <i class="el-icon-arrow-right"></i>
+      </div>
+    </div>
+    <!--  -->
+
+    <div class="bottomPic">
+      <div class="scrollPicContain">
+        <div
+          class="el-car-item"
+          ref="scrollBox"
+          v-on:wheel="handleScroll"
+          :class="terminalPhoto.length < photoNum ? 'littlePic' : ''"
+        >
+          <div
+            class="smallPic"
+            v-for="(item, index2) in terminalPhoto"
+            :key="index2"
+            @click="changeBigPic(item, index2)"
+            :class="`${activeSmall === index2 ? 'borderActive ' : ''}${
+              photoNum === 10 ? 'moreSmallPic' : ''
+            }`"
+          >
+            <div
+              class="picBox"
+              v-if="
+                item.path.indexOf('nopic') == -1 &&
+                item.path.indexOf('videos') == -1
+              "
+            >
+              <!-- <el-image v-lazy="item.path + '!260x160'"></el-image> -->
+              <img v-lazy="item.path + '!160x60'" />
+              <!--  <img :src="item.path + '!260x160'" />-->
+              <!-- :class="{ alarmSpan: item.isAlarm === 1 }" -->
+              <p class="timeInfo">
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  content="拍照时间"
+                  placement="top-start"
+                >
+                  <span>{{ $moment(item.photoTime).format("HH:mm:ss") }}</span>
+                </el-tooltip>
+
+                (
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  content="图片上传时间"
+                  placement="top-start"
+                >
+                  <span> {{ $moment(item.recvTime).format("HH:mm:ss") }}</span>
+                </el-tooltip>
+                )
+                <span
+                  >--{{
+                    item.alias !== null && item.alias !== ""
+                      ? item.alias
+                      : item.channelName
+                  }}</span
+                >
+                <span class="alarmSpan" v-if="item.isAlarm == 1">(已告警)</span>
+              </p>
+            </div>
+            <div class="picBox" v-else-if="item.mediaType == 1">
+              <!-- <el-image :src="item.thumb + '!260x160'"></el-image> -->
+              <img v-lazy="item.thumb + '!160x60'" />
+              <p class="timeInfo">
+                <i class="el-icon-video-camera"></i>
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  content="拍照时间"
+                  placement="top-start"
+                >
+                  <span>{{ $moment(item.photoTime).format("HH:mm:ss") }}</span>
+                </el-tooltip>
+
+                (
+                <el-tooltip
+                  class="item"
+                  effect="dark"
+                  content="图片上传时间"
+                  placement="top-start"
+                >
+                  <span> {{ $moment(item.recvTime).format("HH:mm:ss") }}</span>
+                </el-tooltip>
+                )
+                <span
+                  >--{{
+                    item.alias !== null && item.alias !== ""
+                      ? item.alias
+                      : item.channelName
+                  }}</span
+                >
+              </p>
+            </div>
+            <div class="picBox" v-else>
+              <!-- <el-image :src="item.path"></el-image> -->
+              <img v-lazy="item.path" />
+            </div>
+          </div>
+        </div>
+        <div class="arrow leftArrow" @click.stop="smallLeftClick" ref="leftRef">
+          <i class="el-icon-arrow-left"></i>
+        </div>
+        <div class="arrow rightArrow" ref="rightRef">
+          <i class="el-icon-arrow-right" @click.stop="smallRightClick"></i>
+        </div>
+      </div>
+    </div>
+
+    <!-- 点击出现大图 -->
+    <!-- <div v-if="showBigpic" class="showPic" @click="closePic($event)">
+      <div class="picboxI">
+        <img
+          id="bigimg2"
+          ref="bigimgref"
+          class="maskPic img"
+          :src="bigImgPath"
+          width="100%"
+          height="100%"
+        />
+
+        <canvas id="bigCanvas2" class="mybigCanvas" ref="myCanvasbig"></canvas>
+      </div>
+      <div class="viewClose" @click="closePic($event)">
+        <i class="el-icon-close"></i>
+      </div>
+    </div> -->
+  </div>
+</template>
+
+<script>
+import defaultImage from "../../../assets/img/nodatapic2.jpg";
+import { getCoordinate, updateMarkEnableStatus } from "@/utils/api/index";
+export default {
+  components: {},
+  props: {
+    terminalPhoto: {
+      type: Array,
+      default: () => [],
+    },
+    photoNum: {
+      type: Number,
+      default: () => [],
+    },
+    protocolInfo: {
+      type: Number,
+    },
+  },
+  data() {
+    return {
+      items: [
+        "Item 1",
+        "Item 2",
+        "Item 3",
+        "Item 4",
+        "Item 5",
+        "Item 6",
+        "Item 7",
+        "Item 8",
+        "Item 9",
+        "Item 10",
+      ],
+      picLoading: true,
+      currentPicPath: "", //大图
+      mediaType: "", //判断图片类型是视频还是图片
+      activeSmall: 0, //索引选中小图,
+      currentPage: 0,
+      srcList: [],
+      radioPx: "",
+      fileSize: "",
+      roleUser: "",
+      localPoints: [], //线缆坐标
+      flagLine: true, //线缆标识
+      canvas: null,
+      ctx: null,
+      imgpic: null,
+      color: "", //线颜色
+      borderwidth: "", //线宽
+      markEnable: "", //是否显示
+      recArrs: [],
+      picDataAlarm: [],
+      labelMarkArrs: [],
+
+      //大图
+      showBigpic: false,
+      picShowFlag: true,
+    };
+  },
+  mounted() {
+    ////console.log(this.terminalPhoto);
+    this.changeBigPic(this.terminalPhoto[0], 0);
+    // console.log(this.terminalPhoto[0].path);
+  },
+  watch: {
+    terminalPhoto: {
+      handler(newVal, oldVal) {
+        this.terminalPhoto = newVal;
+      },
+      immediate: true,
+      deep: true, //deep，默认值是 false，代表是否深度监听。
+    },
+  },
+  computed: {},
+  created() {
+    this.roleUser = localStorage.getItem("role");
+    ////console.log(this.roleUser);
+  },
+
+  methods: {
+    //下载图片
+    async downLoadPic(path, name) {
+      const imgUrl = path;
+      const response = await fetch(imgUrl);
+      const blob = await response.blob();
+      // 创建下载链接
+      const url = window.URL.createObjectURL(blob);
+      const link = document.createElement("a");
+      link.href = url;
+      console.log(name);
+      link.download = name.split("/").pop();
+
+      document.body.appendChild(link);
+      link.click();
+      document.body.removeChild(link);
+      // 释放 Blob URL
+      window.URL.revokeObjectURL(url);
+    },
+
+    //获取线缆绘制显示
+    getPointList(data) {
+      console.log("woshi 线缆绘制", data);
+      getCoordinate({
+        channelId: data.channelId,
+        needPic: "1",
+        termId: data.termId,
+      })
+        .then((res) => {
+          //console.log(res);
+          this.localPoints = res.data.list;
+          this.color = res.data.color;
+          this.borderwidth = res.data.boderWidth;
+          this.markEnable = res.data.markEnable;
+          if (this.markEnable === 1) {
+            this.drawline();
+          }
+        })
+        .catch((err) => {});
+    },
+    //开启绘制线缆
+    openLine() {
+      this.flagLine = true;
+
+      //开启传1
+      updateMarkEnableStatus({
+        status: 1,
+      }).then((res) => {
+        //console.log(res);
+      });
+      this.drawline();
+    },
+    //关闭绘制线缆
+    closeLine() {
+      this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
+      this.flagLine = false;
+
+      //关闭传0
+      updateMarkEnableStatus({
+        status: 0,
+      }).then((res) => {
+        //console.log(res);
+      });
+    },
+    //绘制线缆方法
+    drawline() {
+      this.canvas = this.$refs.myCanvas;
+      this.imgpic = this.$refs.picJpg;
+      this.canvas.width = this.imgpic.imageWidth; //设置画布大小
+      this.canvas.height = this.imgpic.imageHeight; //设置画布大小
+      this.ctx = this.canvas.getContext("2d");
+
+      if (this.flagLine == true) {
+        this.localPoints = this.localPoints;
+      } else {
+        this.localPoints = [];
+      }
+
+      this.ctx.beginPath();
+      //设置线条颜色，必须放在绘制之前
+      this.ctx.strokeStyle = this.color;
+      // 线宽设置，必须放在绘制之前
+      this.ctx.lineWidth = this.borderwidth;
+
+      if (this.localPoints == null) {
+        return;
+      } else {
+        for (var i = 0; i < this.localPoints.length; i++) {
+          this.ctx.moveTo(
+            this.localPoints[i].x1 * this.imgpic.imageWidth,
+            this.localPoints[i].y1 * this.imgpic.imageHeight
+          );
+          this.ctx.lineTo(
+            this.localPoints[i].x2 * this.imgpic.imageWidth,
+            this.localPoints[i].y2 * this.imgpic.imageHeight
+          );
+        }
+        this.ctx.closePath();
+        this.ctx.stroke();
+      }
+
+      // this.ctx.beginPath(); //开始路径
+      // this.ctx.moveTo(100, 100); //三角形，左顶点
+      // this.ctx.lineTo(300, 100); //右顶点
+      // this.ctx.lineTo(300, 300); //底部的点
+      // this.ctx.closePath(); //结束路径
+      // this.ctx.stroke(); //描边路径
+    },
+    //点击大图左右按钮
+    leftClick() {
+      console.log(this.photoNum);
+      this.activeSmall--;
+      this.$refs.scrollBox.scrollLeft -=
+        this.$refs.scrollBox.offsetWidth / this.photoNum;
+      this.changeBigPic(this.terminalPhoto[this.activeSmall], this.activeSmall);
+    },
+    rightClick() {
+      console.log(this.photoNum);
+      this.activeSmall++;
+      this.$refs.scrollBox.scrollLeft +=
+        this.$refs.scrollBox.offsetWidth / this.photoNum;
+      this.changeBigPic(this.terminalPhoto[this.activeSmall], this.activeSmall);
+    },
+    //获取第一张大图
+    changeBigPic(data, i) {
+      // //console.log("鼠标222222222", this.currentPage, this.activeSmall);
+      this.picShowFlag = true;
+      if (this.currentPicPath == "static/img/nopic.0e9cfc7c.jpg") {
+        this.picShowFlag = false;
+      }
+      this.picDataAlarm = data;
+      this.srcList = [];
+      this.localPoints = [];
+      this.activeSmall = i;
+      this.mediaType = data.mediaType;
+      this.currentPicPath = data.path;
+      this.srcList.push(data.path);
+      if (data.width != undefined) {
+        this.radioPx = data.width + "x" + data.height;
+      } else {
+        this.radioPx = "";
+      }
+      if (data.fileSize !== undefined) {
+        const sizeInBytes = data.fileSize;
+        const sizeInMB = sizeInBytes / (1024 * 1024);
+        const sizeInKB = sizeInBytes / 1024;
+
+        if (sizeInMB >= 1) {
+          this.fileSize = `${sizeInMB.toFixed(2)}M`; // 大于等于1MB，以MB为单位，保留两位小数
+        } else {
+          this.fileSize = `${sizeInKB.toFixed(0)}K`; // 小于1MB，以KB为单位，保留两位小数
+        }
+      } else {
+        this.fileSize = ""; // 如果data.fileSize未定义，则设置为空字符串
+      }
+
+      // console.log(data.channelId);
+      if (data.channelId) {
+        this.getPointList(data);
+      }
+      const items = this.$refs.scrollBox.querySelectorAll(".smallPic");
+      const selectedItem = items[i];
+      const selectedItemLeft = selectedItem.offsetLeft;
+      const scrollContainer = this.$refs.scrollBox;
+      const scrollContainerWidth = scrollContainer.offsetWidth;
+      const selectedItemWidth = selectedItem.offsetWidth;
+
+      // 计算滚动距离，确保选中的元素在滚动容器内完整显示
+      let scrollDistance =
+        selectedItemLeft - (scrollContainerWidth - selectedItemWidth) / 2;
+      if (scrollDistance < 0) {
+        scrollDistance = 0;
+      } else if (
+        scrollDistance + scrollContainerWidth >
+        scrollContainer.scrollWidth
+      ) {
+        scrollDistance = scrollContainer.scrollWidth - scrollContainerWidth;
+      }
+      // 调整滚动容器的scrollLeft
+      scrollContainer.scrollLeft = scrollDistance;
+    },
+    loadImage() {
+      console.log("loading");
+      this.picLoading = false;
+      this.drawlineBig(this.picDataAlarm);
+
+      this.picShowFlag = false;
+    },
+    setDefaultImage(e) {
+      e.target.src = defaultImage;
+      this.picLoading = false;
+      this.picShowFlag = false;
+    },
+    //鼠标滚动
+    handleScroll(e) {
+      let direction = e.deltaY > 0 ? "down" : "up"; //deltaY为正则滚轮向下，为负滚轮向上
+      if (direction == "down") {
+        this.$refs.scrollBox.scrollLeft +=
+          (this.$refs.scrollBox.offsetWidth / this.photoNum) * 2;
+      }
+      if (direction == "up") {
+        this.$refs.scrollBox.scrollLeft -=
+          (this.$refs.scrollBox.offsetWidth / this.photoNum) * 2;
+      }
+    },
+    handleSwipeLeft() {
+      // 处理向左滑动
+      this.$refs.scrollBox.scrollLeft -=
+        (this.$refs.scrollBox.offsetWidth / this.photoNum) * 2;
+    },
+    handleSwipeRight() {
+      // 处理向右滑动
+      this.$refs.scrollBox.scrollLeft +=
+        (this.$refs.scrollBox.offsetWidth / this.photoNum) * 2;
+    },
+    //缩略图的左右箭头
+    smallLeftClick() {
+      this.$refs.scrollBox.scrollLeft -= this.$refs.scrollBox.offsetWidth;
+      this.$forceUpdate(); // 强制 Vue 重新渲染
+    },
+    smallRightClick() {
+      this.$refs.scrollBox.scrollLeft += this.$refs.scrollBox.offsetWidth;
+      this.$forceUpdate(); // 强制 Vue 重新渲染
+    },
+
+    //绘制大图告警区域
+    //绘制大图告警区域
+    drawlineBig(data) {
+      console.log(data);
+      this.canvas = document.getElementById("alarmCanvas");
+      this.imgpic = document.getElementById("alarmPic");
+      console.log(document.getElementById("alarmCanvas"));
+      console.log(document.getElementById("alarmPic"));
+      console.log(this.canvas);
+      console.log(this.imgpic);
+      this.textInfo = data.enname;
+      this.canvas.width = this.imgpic.offsetWidth; //设置画布大小
+      this.canvas.height = this.imgpic.offsetHeight; //设置画布大小
+
+      console.log(this.canvas.width, this.canvas.height);
+      this.ctx = this.canvas.getContext("2d");
+      this.ctx.beginPath();
+      //设置线条颜色，必须放在绘制之前
+      this.ctx.strokeStyle = "#ff0000";
+      // 线宽设置，必须放在绘制之前
+      this.ctx.lineWidth = 2;
+      this.labelMarkArrs = data.alarmlist;
+      this.recArrs = [];
+      for (var i = 0; i < this.labelMarkArrs.length; i++) {
+        console.log(this.labelMarkArrs[i]);
+        //获取的数据转化一下
+        this.recArrs.push({
+          x:
+            this.labelMarkArrs[i].x * this.canvas.width -
+            (this.labelMarkArrs[i].width * this.canvas.width) / 2,
+          y:
+            this.labelMarkArrs[i].y * this.canvas.height -
+            (this.labelMarkArrs[i].height * this.canvas.height) / 2,
+          w: this.labelMarkArrs[i].width * this.canvas.width,
+          h: this.labelMarkArrs[i].height * this.canvas.height,
+          text: this.labelMarkArrs[i].enname + this.labelMarkArrs[i].prob + "%",
+          type: this.labelMarkArrs[i].label,
+        });
+      }
+      console.log(this.recArrs);
+      if (!this.recArrs.length) return;
+      for (var i = 0; i < this.recArrs.length; i++) {
+        // >2的判断是为了防止误触画出来的数据
+        if (this.recArrs[i].w > 2 && this.recArrs[i].h > 2) {
+          this.ctx.beginPath();
+          this.ctx.lineWidth = 2; // 矩形框的线条宽度
+          this.ctx.strokeStyle = "rgb(255, 255, 0)"; // 矩形框的线条颜色
+          // 设置填充样式
+          // this.ctx.fillStyle = "rgba(22, 158, 140, 0.4)"; // 蓝色，半透明
+          this.ctx.strokeRect(
+            this.recArrs[i].x,
+            this.recArrs[i].y,
+            this.recArrs[i].w,
+            this.recArrs[i].h
+          ); // 矩形框
+          // this.ctx.fillRect(
+          //   this.recArrs[i].x,
+          //   this.recArrs[i].y,
+          //   this.recArrs[i].w,
+          //   this.recArrs[i].h
+          // ); // 填充矩形
+          // 如果有文本信息，填充文本信息
+          if (this.recArrs[i].text) {
+            this.ctx.font = "100 18px 微软雅黑";
+            this.ctx.lineWidth = 1;
+            this.ctx.strokeStyle = "rgb(255,255,0)";
+            this.ctx.strokeText(
+              this.recArrs[i].text,
+              this.recArrs[i].x +
+                this.recArrs[i].w / 2 -
+                (this.recArrs[i].text.length / 2) * 16,
+              this.recArrs[i].y - 20 < 0
+                ? this.recArrs[i].y + this.recArrs[i].h + 20
+                : this.recArrs[i].y - 10
+            );
+          }
+        }
+      }
+      this.ctx.closePath();
+      this.ctx.stroke();
+    },
+    //绘制大图告警区域
+    drawlineBig2(data) {
+      console.log(data);
+      this.canvas = document.getElementById("bigCanvas2");
+      this.imgpic = document.getElementById("bigimg2");
+      console.log(document.getElementById("alarmCanvas"));
+      console.log(document.getElementById("bigimg2"));
+      console.log(this.canvas);
+      console.log(this.imgpic);
+      this.textInfo = data.enname;
+      this.canvas.width = this.imgpic.offsetWidth; //设置画布大小
+      this.canvas.height = this.imgpic.offsetHeight; //设置画布大小
+
+      console.log(this.canvas.width, this.canvas.height);
+      this.ctx = this.canvas.getContext("2d");
+      this.ctx.beginPath();
+      //设置线条颜色，必须放在绘制之前
+      this.ctx.strokeStyle = "#ff0000";
+      // 线宽设置，必须放在绘制之前
+      this.ctx.lineWidth = 2;
+      this.labelMarkArrs = data.alarmlist;
+      this.recArrs = [];
+      for (var i = 0; i < this.labelMarkArrs.length; i++) {
+        console.log(this.labelMarkArrs[i]);
+        //获取的数据转化一下
+        this.recArrs.push({
+          x:
+            this.labelMarkArrs[i].x * this.canvas.width -
+            (this.labelMarkArrs[i].width * this.canvas.width) / 2,
+          y:
+            this.labelMarkArrs[i].y * this.canvas.height -
+            (this.labelMarkArrs[i].height * this.canvas.height) / 2,
+          w: this.labelMarkArrs[i].width * this.canvas.width,
+          h: this.labelMarkArrs[i].height * this.canvas.height,
+          text: this.labelMarkArrs[i].enname + this.labelMarkArrs[i].prob + "%",
+          type: this.labelMarkArrs[i].label,
+        });
+      }
+      console.log(this.recArrs);
+      if (!this.recArrs.length) return;
+      for (var i = 0; i < this.recArrs.length; i++) {
+        // >2的判断是为了防止误触画出来的数据
+        if (this.recArrs[i].w > 2 && this.recArrs[i].h > 2) {
+          this.ctx.beginPath();
+          this.ctx.lineWidth = 2; // 矩形框的线条宽度
+          this.ctx.strokeStyle = "rgb(255, 255, 0)"; // 矩形框的线条颜色
+          // 设置填充样式
+          // this.ctx.fillStyle = "rgba(22, 158, 140, 0.4)"; // 蓝色，半透明
+          this.ctx.strokeRect(
+            this.recArrs[i].x,
+            this.recArrs[i].y,
+            this.recArrs[i].w,
+            this.recArrs[i].h
+          ); // 矩形框
+          // this.ctx.fillRect(
+          //   this.recArrs[i].x,
+          //   this.recArrs[i].y,
+          //   this.recArrs[i].w,
+          //   this.recArrs[i].h
+          // ); // 填充矩形
+          // 如果有文本信息，填充文本信息
+          if (this.recArrs[i].text) {
+            this.ctx.font = "100 16px 微软雅黑";
+            this.ctx.lineWidth = 2;
+            this.ctx.strokeStyle = "rgb(255,255,0)";
+            this.ctx.strokeText(
+              this.recArrs[i].text,
+              this.recArrs[i].x +
+                this.recArrs[i].w / 2 -
+                (this.recArrs[i].text.length / 2) * 16,
+              this.recArrs[i].y - 20 < 0
+                ? this.recArrs[i].y + this.recArrs[i].h + 20
+                : this.recArrs[i].y - 10
+            );
+          }
+        }
+      }
+      this.ctx.closePath();
+      this.ctx.stroke();
+    },
+    //放大图
+    handleBigPicbox(val) {
+      console.log(val);
+      this.showBigpic = true;
+      this.bigImgPath = val;
+      setTimeout(() => {
+        this.$nextTick(() => {
+          this.drawlineBig2(this.picDataAlarm);
+        });
+      }, 100);
+    },
+    closePic(e) {
+      console.log(e);
+      var btn = this.$refs.bigimgref;
+      console.log(btn);
+      if (btn) {
+        if (!btn.contains(event.target)) {
+          //按钮.app-download以外的区域
+          this.zoomD = 1;
+          this.showBigpic = false;
+        }
+      }
+      //
+      // this.showBigpic = false;
+    },
+  },
+};
+</script>
+<style lang="less">
+.thumb-example {
+  width: 100%;
+  // display: flex;
+  // flex-direction: column;
+  height: calc(100% - 32px);
+  box-sizing: border-box;
+
+  .radioBox {
+    position: absolute;
+    top: 8px;
+    right: 24px;
+    color: #fff;
+    font-size: 14px;
+  }
+  .skeletonBox {
+    width: 100%;
+    height: 80%;
+    margin-bottom: 4px;
+    .el-skeleton,
+    .elpicBox {
+      width: 100%;
+      height: 100%;
+    }
+    .el-skeleton__image svg {
+      width: 50%;
+      height: 50%;
+    }
+  }
+  .topPic {
+    width: 100%;
+    height: 80%;
+    margin-bottom: 4px;
+    position: relative;
+    .bigPic {
+      width: 100%;
+      height: 100%;
+      cursor: pointer;
+      .el-image {
+        width: 100%;
+        height: 100%;
+        img {
+          width: 100%;
+          height: 100%;
+        }
+      }
+    }
+    .myCanvas {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      cursor: pointer;
+      z-index: 3;
+      pointer-events: none;
+    }
+    #alarmCanvas {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      margin: 0 auto;
+      cursor: pointer;
+      pointer-events: none;
+    }
+    &:hover {
+      .arrow {
+        opacity: 1;
+        transition: all 0.5s ease-in;
+      }
+      .downBtn {
+        opacity: 1;
+        transition: all 0.5s ease-in;
+      }
+    }
+    .arrow {
+      opacity: 0;
+      position: absolute;
+      cursor: pointer;
+      font-size: 16px;
+      border-radius: 30px;
+      position: absolute;
+      top: 50%;
+      transform: translateY(-50%);
+      color: #4cdbc8;
+      font-weight: bold;
+      background-color: rgba(31, 45, 61, 0.8);
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      text-align: center;
+      line-height: 60px;
+      width: 40px;
+      height: 40px;
+      z-index: 4;
+      &:hover {
+        background-color: rgba(31, 45, 61, 1);
+      }
+    }
+    .leftArrow {
+      left: 16px;
+    }
+    .rightArrow {
+      right: 16px;
+    }
+    .downBtn {
+      position: absolute;
+      background: rgba(0, 0, 0, 0.5);
+      border: none;
+      right: 24px;
+      bottom: 24px;
+      color: #fff;
+      z-index: 5;
+      opacity: 0;
+      &:hover {
+        background: rgba(0, 0, 0, 0.9);
+        color: #169e8c;
+      }
+    }
+  }
+  .bottomPic {
+    width: 100%;
+    height: 20%;
+    margin-bottom: 6px;
+    .scrollPicContain {
+      // width: 1380px;
+      display: flex;
+      height: 100%;
+      position: relative;
+      .arrow {
+        opacity: 0;
+        position: absolute;
+        cursor: pointer;
+        font-size: 14px;
+        border-radius: 30px;
+        position: absolute;
+        top: 50%;
+        transform: translateY(-50%);
+        color: #4cdbc8;
+        font-weight: bold;
+        background-color: rgba(31, 45, 61, 0.8);
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        text-align: center;
+        line-height: 60px;
+        width: 30px;
+        height: 30px;
+        z-index: 4;
+        &:hover {
+          background-color: rgba(31, 45, 61, 1);
+        }
+      }
+      .leftArrow {
+        left: 16px;
+      }
+      .rightArrow {
+        right: 16px;
+      }
+      &:hover {
+        .arrow {
+          opacity: 1;
+          transition: all 0.5s ease-in;
+        }
+      }
+    }
+    .el-car-item {
+      width: 100%;
+      height: 100%;
+      display: flex;
+      overflow-x: auto;
+      overflow-y: hidden;
+      scroll-behavior: smooth;
+      scrollbar-width: none;
+      .smallPic {
+        width: 19.2%;
+        border: 3px solid transparent;
+        box-sizing: border-box;
+        flex-shrink: 0;
+        white-space: nowrap;
+        position: relative;
+        cursor: pointer;
+        .picBox {
+          width: 100%;
+          height: 100%;
+        }
+
+        img {
+          width: 100%;
+          height: 100%;
+        }
+        .timeInfo {
+          position: absolute;
+          bottom: 0px;
+          width: 100%;
+          background: #f0f0f0;
+          padding: 6px 0;
+          font-size: 12px;
+          text-align: center;
+          color: #333;
+          .el-icon-video-camera {
+            font-size: 20px;
+            margin-right: 8px;
+            align-items: center;
+            vertical-align: sub;
+            color: #169e8c;
+          }
+        }
+        .alarmSpan {
+          color: #f00;
+          font-weight: bold;
+        }
+      }
+      .moreSmallPic {
+        width: 9.8%;
+      }
+      .borderActive {
+        .timeInfo {
+          color: #fff;
+          background: linear-gradient(180deg, #4cdbc8 10%, #128071);
+        }
+        .alarmSpan {
+          color: #f00;
+          font-weight: bold;
+        }
+      }
+    }
+    .littlePic {
+      justify-content: center;
+    }
+  }
+  .showPic {
+    position: fixed;
+    background-color: rgba(0, 0, 0, 50%);
+    bottom: 0;
+    left: 0;
+    overflow: hidden;
+    right: 0;
+    top: 0;
+    z-index: 9999;
+    width: 100%;
+    height: 100%;
+    display: flex;
+    cursor: pointer;
+    .picboxI {
+      position: relative;
+      width: 90%;
+      height: 90%;
+      margin: auto;
+      animation-name: scaleDraw;
+      /*关键帧名称*/
+      animation-timing-function: ease;
+      /*动画的速度曲线*/
+      animation-iteration-count: 1;
+      /*动画播放的次数*/
+      animation-duration: 0.65s;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      img {
+        max-width: 100%;
+        max-height: 100%;
+        margin: auto;
+        position: absolute;
+        cursor: grab;
+      }
+      .mybigCanvas {
+        position: absolute;
+        // top: 0;
+        // left: 0;
+        max-width: 100%;
+        max-height: 100%;
+        margin: 0 auto;
+        cursor: pointer;
+        pointer-events: none;
+      }
+    }
+    .viewClose {
+      -webkit-app-region: no-drag;
+      background-color: rgba(0, 0, 0, 0.5);
+      border-radius: 50%;
+      cursor: pointer;
+      height: 80px;
+      overflow: hidden;
+      position: absolute;
+      right: -40px;
+      top: -40px;
+      transition: background-color 0.15s;
+      width: 80px;
+      .el-icon-close {
+        bottom: 16px;
+        left: 16px;
+        position: absolute;
+        color: #fff;
+        font-size: 18px;
+      }
+    }
+  }
+}
+</style>

src/views/realTimeMonitor/components/gpsButton.vue

@@ -1,22 +1,14 @@
 <template>
   <div class="gpsbuttonBox">
     <el-button type="primary" @click="handleShowGPS">获取GPS位置 </el-button>
-    <el-dropdown class="dropgps" trigger="click" @command="handleCommandGps">
-      <el-button type="primary">
-        GPS开关<i class="el-icon-arrow-down el-icon--right"></i>
-      </el-button>
-      <el-dropdown-menu slot="dropdown" class="gpsdropStyle">
-        <el-dropdown-item command="open">开启GPS</el-dropdown-item>
-        <el-dropdown-item command="close">关闭GPS</el-dropdown-item>
-      </el-dropdown-menu>
-    </el-dropdown>
+
     <gps-position ref="gpsdialog_ref"></gps-position>
   </div>
 </template>
 <script>
 // import infoDialog from "./infoDialog.vue";
 import gpsPosition from "./gpsPosition.vue";
-import { getTermStatus, setTermGPSJoggle } from "@/utils/api/index";
+import {} from "@/utils/api/index";
 export default {
   components: {
     gpsPosition,
@@ -45,54 +37,6 @@ export default {
     },
   },
   methods: {
-    //切换gps开启关闭
-    handleCommandGps(command) {
-      switch (command) {
-        case "open": //开启
-          this.changeGPS(1, this.cmdId);
-          break;
-        case "close": //关闭
-          this.changeGPS(0, this.cmdId);
-          break;
-      }
-    },
-    changeGPS(val, cmdid) {
-      console.log(val, cmdid);
-      getTermStatus({ termId: this.termId }).then((res) => {
-        console.log(res);
-        if (res.data.isonline) {
-          setTermGPSJoggle({ gpsstatus: val, cmdId: cmdid })
-            .then((res) => {
-              console.log(res);
-              if (val == 0) {
-                this.$message({
-                  duration: 1500,
-                  message: "GPS已关闭",
-                  type: "warning",
-                  showClose: true,
-                });
-              } else {
-                this.$message({
-                  duration: 1500,
-                  message: "成功开启GPS",
-                  type: "success",
-                  showClose: true,
-                });
-              }
-            })
-            .catch((err) => {
-              console.log(err); //代码错误、请求失败捕获
-            });
-        } else {
-          this.$message({
-            duration: 1500,
-            showClose: true,
-            message: "装置下线，发送指令失败",
-            type: "error",
-          });
-        }
-      });
-    },
     //获取GPS位置
     handleShowGPS() {
       this.$refs.gpsdialog_ref.display(this.cmdId, this.termId);
@@ -103,8 +47,8 @@ export default {
 </script>
 <style lang="less">
 .gpsbuttonBox {
-  width: 100%;
-  display: flex;
-  justify-content: space-between;
+  // width: 100%;
+  // display: flex;
+  // justify-content: space-between;
 }
 </style>

src/views/realTimeMonitor/components/morePicPreveiw.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="morePicBox" v-if="isShow">
+  <div class="morePicBox" v-show="isShow">
     <div class="headTitle">
       <div class="info">
         <p>
@@ -20,10 +20,10 @@
     </div>
     <div class="picmain" v-loading="picLoading">
       <carouselChart
+        :key="carouselKey"
         ref="carouselpic"
         :terminalPhoto="terminalPhoto"
         :photoNum="photoNum"
-        v-if="terminalPhoto.length > 0"
       ></carouselChart>
     </div>
   </div>
@@ -47,6 +47,7 @@ export default {
       nopicPath: require("@/assets/img/nopic.jpg"),
       picLoading: false,
       photoNum: 10,
+      carouselKey: 0, // 初始key
     };
   },
   mounted() {},
@@ -62,7 +63,7 @@ export default {
     },
     //获取图片
     getTerminalPhotoList(channelid, date, termId) {
-      this.terminalPhoto = [];
+      //this.terminalPhoto = [];
       this.picLoading = true;
       getTerminalPhotoListJoggle({
         channelid: channelid,
@@ -83,23 +84,7 @@ export default {
           } else {
             this.terminalPhoto = res.data.list;
           }
-          let newDataList = [];
-          let current = 0;
-          if (this.terminalPhoto && this.terminalPhoto.length > 0) {
-            for (let i = 0; i <= this.terminalPhoto.length - 1; i++) {
-              if (i % this.photoNum !== 0 || i === 0) {
-                if (!newDataList[current]) {
-                  newDataList.push([this.terminalPhoto[i]]);
-                } else {
-                  newDataList[current].push(this.terminalPhoto[i]);
-                }
-              } else {
-                current++;
-                newDataList.push([this.terminalPhoto[i]]);
-              }
-            }
-          }
-          this.terminalPhoto = [...newDataList];
+          this.carouselKey++; // 更新key以强制重新渲染
         })
         .catch((err) => {
           console.log(err); //代码错误、请求失败捕获
@@ -119,6 +104,7 @@ export default {
   background: #fff;
   top: 0px;
   left: 0px;
+  z-index: 2;
   //z-index: 99999;
   .headTitle {
     height: 40px;
@@ -150,6 +136,9 @@ export default {
   .picmain {
     width: 100%;
     height: calc(100% - 10px);
+    .el-loading-mask {
+      background-color: rgba(255, 255, 255, 0.2);
+    }
   }
 }
 </style>

src/views/realTimeMonitor/components/parameterArea.vue

@@ -1,6 +1,16 @@
 <template>
   <div class="AreaBox">
-    <div class="areaHead">{{ areaData.cmdid }}</div>
+    <div class="areaHead">
+      <span @dblclick="handleDblClick(areaData.cmdid)">{{
+        areaData.cmdid
+      }}</span>
+      <el-button
+        type="text"
+        :icon="areaData.isfavor == 1 ? 'el-icon-star-on' : 'el-icon-star-off'"
+        @click="addCollectClick"
+        >{{ areaData.isfavor == 1 ? "取消收藏" : "添加收藏" }}</el-button
+      >
+    </div>
     <div class="paramsDate">
       <h3>日历快速查询</h3>
       <el-date-picker
@@ -10,26 +20,13 @@
         format="yyyy 年 MM 月 dd 日"
         :picker-options="pickerOptions"
         @change="changedate"
+        @focus="handleDateFocus"
         :clearable="false"
       >
       </el-date-picker>
     </div>
     <div class="paramsDate">
       <h3>通道监拍点</h3>
-      <!-- <el-radio-group v-model="selectChannelValue" @input="changeChannelId">
-        <el-radio-button
-          v-for="item in channelListOption"
-          :key="item.channelid"
-          :value="item.channelid"
-          :label="item.channelid"
-        >
-          {{
-            item.alias !== null && item.alias !== ""
-              ? item.alias
-              : item.channelname
-          }}</el-radio-button
-        >
-      </el-radio-group> -->
       <el-select
         v-model="selectChannelValue"
         placeholder="请选择通道"
@@ -53,51 +50,200 @@
           }}
         </el-option>
       </el-select>
+      <div class="yzwBox" v-if="yzwFlag">
+        <h3>通道预置位</h3>
+        <el-input
+          v-model="yzwVal"
+          placeholder="请输入预置位"
+          @change="searchYzw"
+        ></el-input>
+      </div>
     </div>
     <div class="paramsDate setTimebtn">
       <h3>操作项</h3>
       <div class="buttonGroup">
-        <takePicButton></takePicButton>
-        <takeVideoButton></takeVideoButton>
-
+        <takePicButton
+          v-if="showButton('pzShowBtn')"
+          ref="takepicRef"
+        ></takePicButton>
+        <takeVideoButton v-if="showButton('spShowBtn')"></takeVideoButton>
         <deviceInfoButton></deviceInfoButton>
-
-        <scheduleButton></scheduleButton>
-        <alarmButton></alarmButton>
+        <scheduleButton v-if="showButton('pztimeShowBtn')"></scheduleButton>
+        <alarmButton v-if="showButton('sgbjShowBtn')"></alarmButton>
         <cableButton></cableButton>
         <gpsButton></gpsButton>
-        <el-button type="primary" @click="handlehistoryPic">
+        <el-dropdown
+          class="dropgps"
+          trigger="click"
+          @command="handleCommandGps"
+        >
+          <el-button type="primary">
+            GPS开关<i class="el-icon-arrow-down el-icon--right"></i>
+          </el-button>
+          <el-dropdown-menu
+            slot="dropdown"
+            class="gpsdropStyle"
+            :append-to-body="false"
+          >
+            <el-dropdown-item command="open">开启GPS</el-dropdown-item>
+            <el-dropdown-item command="close">关闭GPS</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+        <el-button
+          type="primary"
+          @click="handlehistoryPic"
+          v-if="showhisButton('/realTimeSearch')"
+        >
           历史图片</el-button
         >
-        <el-button type="primary" @click="handleParams"> 参数配置</el-button>
-        <!-- <el-button type="primary" @click="handleTakePic" :loading="picLoading"
-          >主动拍照
-        </el-button> -->
-        <!-- <el-button type="primary">主动拍照 </el-button>
-        <el-button type="primary">主动拍照 </el-button>
-        <el-button type="primary">主动拍照 </el-button>
-        <el-button type="primary">主动拍照 </el-button>
-        <el-button type="primary">主动拍照 </el-button>
-        <el-button type="primary">主动拍照 </el-button>
-        <el-button type="primary">主动拍照 </el-button> -->
+        <el-button
+          type="primary"
+          @click="handleParams"
+          v-if="showButton('cspzShowBtn')"
+        >
+          参数配置</el-button
+        >
+        <el-button
+          type="primary"
+          @click="handleuploadPic"
+          v-if="showButton('sctpShowBtn')"
+        >
+          上传图片</el-button
+        >
+        <takeTimePicButton
+          v-if="showButton('zdTimepzShowBtn')"
+        ></takeTimePicButton>
+        <setChannelButton v-if="showButton('tdszShowBtn')"></setChannelButton>
+        <setAppButton v-if="showButton('appShowBtn')"></setAppButton>
+        <el-dropdown
+          class="dropgps"
+          trigger="click"
+          @command="
+            (command) => {
+              handleSearchCommand(command, areaData);
+            }
+          "
+        >
+          <el-button type="primary">
+            数据查询<i class="el-icon-arrow-down el-icon--right"></i>
+          </el-button>
+          <el-dropdown-menu
+            slot="dropdown"
+            class="picdropStyle"
+            :append-to-body="false"
+          >
+            <el-dropdown-item command="info">基本信息</el-dropdown-item>
+            <el-dropdown-item command="workStatus">工作状态</el-dropdown-item>
+            <el-dropdown-item command="runStatus">运行状态</el-dropdown-item>
+            <el-dropdown-item command="GPS">GPS位置</el-dropdown-item>
+            <el-dropdown-item command="faultInfo">故障信息报</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+        <ptzDevice v-if="areaData.hasPan == 1"></ptzDevice>
+        <!-- 请求覆冰数据和微气象数据 -->
+
+        <el-dropdown
+          class="dropgps"
+          trigger="click"
+          @command="handleiceAndweather"
+          v-if="
+            areaData.hasPan == 1 &&
+            areaData.devType !== undefined &&
+            (areaData.devType.includes('2') || areaData.devType.includes('3'))
+          "
+        >
+          <el-button type="primary">
+            采集数据<i class="el-icon-arrow-down el-icon--right"></i>
+          </el-button>
+          <el-dropdown-menu
+            slot="dropdown"
+            class="gpsdropStyle"
+            :append-to-body="false"
+          >
+            <el-dropdown-item command="weather">微气象</el-dropdown-item>
+            <el-dropdown-item command="ice">覆冰</el-dropdown-item>
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+      <div class="setfocalLength" v-if="areaData.devType == '65286'">
+        <h3>焦距调节</h3>
+        <div class="selectChannel">
+          <span class="labelname">选择通道</span>
+          <el-select
+            v-model="channelarrValue"
+            placeholder="请选择通道"
+            ref="multiSelect"
+          >
+            <el-option
+              v-for="item in channelfocalOpyion"
+              :key="item.channelid"
+              :label="
+                item.alias !== null && item.alias !== ''
+                  ? item.alias
+                  : item.channelname
+              "
+              :value="item.channelid"
+            >
+              {{
+                item.alias !== null && item.alias !== ""
+                  ? item.alias
+                  : item.channelname
+              }}
+            </el-option>
+          </el-select>
+        </div>
+        <div class="buttonGroup">
+          <el-button type="primary" icon="el-icon-zoom-in" @click="amplify()"
+            >放大</el-button
+          >
+          <el-button type="primary" icon="el-icon-zoom-out" @click="reduce()"
+            >缩小</el-button
+          >
+        </div>
       </div>
     </div>
     <parameterSetDialog ref="parameterSetref"></parameterSetDialog>
+    <uploadpic ref="uploadpicref"></uploadpic>
+    <baseInfor ref="baseInfor_ref"></baseInfor>
+    <workStatus ref="workStatus_ref"></workStatus>
+    <runStatus ref="runStatus_ref"></runStatus>
+    <gpsSite ref="gpsSite_ref"></gpsSite>
+    <faultInfomation ref="fultInfo_ref"></faultInfomation>
   </div>
 </template>
 <script>
+import EventBus from "@/utils/event-bus";
 import takePicButton from "./takePicButton.vue";
+// import setChannelButton from "./setChannelButton.vue";
+import setChannelButton from "../components/setChannel/setChannelButton";
+import takeTimePicButton from "./takeTimePicButton.vue";
 import takeVideoButton from "./takeVideoButton.vue";
 import deviceInfoButton from "./deviceInfoButton.vue";
 import scheduleButton from "./scheduleButton.vue";
 import alarmButton from "./alarmButton.vue";
 import cableButton from "./cableButton.vue";
 import gpsButton from "./gpsButton.vue";
+import uploadpic from "./uploadpic.vue";
 import parameterSetDialog from "../../photographicDevice/components/parameterSetDialog.vue";
-import { getChannelByTermidJoggle } from "@/utils/api/index";
+import setAppButton from "./setAppButton.vue";
+import ptzDevice from "./ptzDevice/index.vue";
+import baseInfor from "../../photographicDevice/components/baseInfor.vue";
+import workStatus from "../../photographicDevice/components/workStatus.vue";
+import runStatus from "../../photographicDevice/components/runStatus.vue";
+import gpsSite from "../../photographicDevice/components/gpsSite.vue";
+import faultInfomation from "../../photographicDevice/components/faultInfomation.vue";
+import {
+  getChannelByTermidJoggle,
+  updateTermCamera,
+  getTermStatus,
+  setTermCamera,
+  addFavorList,
+  setTermGPSJoggle,
+} from "@/utils/api/index";
 export default {
   components: {
     takePicButton,
+    takeTimePicButton,
     takeVideoButton,
     deviceInfoButton,
     scheduleButton,
@@ -105,11 +251,23 @@ export default {
     cableButton,
     gpsButton,
     parameterSetDialog,
+    uploadpic,
+    setChannelButton,
+    ptzDevice,
+    setAppButton,
+    baseInfor,
+    workStatus,
+    runStatus,
+    gpsSite,
+    faultInfomation,
   },
   data() {
     return {
+      roleUser: "",
       selectChannelValue: null, //选中的通道
       channelListOption: [], //通道数组
+      channelarrValue: null,
+      channelfocalOpyion: [], //焦距通道
       dateValue: "", //选择日期
       pickerOptions: {
         disabledDate(date) {
@@ -120,6 +278,12 @@ export default {
       selectDyId: "", //获取当前选中的电压线路等信息
       selectLineId: "",
       selectTowerId: "",
+      collectFlag: false, //收藏
+      btnShowList: [],
+      hisShowbtn: true,
+      menuShowList: [],
+      yzwVal: "", //预置位
+      yzwFlag: false,
     };
   },
 
@@ -134,20 +298,125 @@ export default {
     areaData() {
       return this.$store.state.currentData;
     },
+    showButtonMap() {
+      if (this.roleUser !== "0") {
+        return this.btnShowList.reduce((map, button) => {
+          map[button.key] = true; // 假设只要key存在，就显示按钮
+          return map;
+        }, {});
+      }
+    },
+    showhisButtonMap() {
+      if (this.roleUser !== "0") {
+        return this.menuShowList.reduce((map, button) => {
+          map[button.key] = true; // 假设只要key存在，就显示按钮
+          return map;
+        }, {});
+      }
+    },
+  },
+  created() {
+    this.roleUser = localStorage.getItem("role");
+    console.log("asdsaddddddddddddddddddddddddd", this.roleUser);
+    this.btnShowList = JSON.parse(localStorage.getItem("btnPermission"));
+    this.menuShowList = JSON.parse(localStorage.getItem("menuPermission"));
+    console.log("aaaaaaaaa,", this.areaData.devType);
+    console.log(this.btnShowList, this.menuShowList);
   },
   mounted() {
     this.getDateTime();
   },
   methods: {
+    takepicFun() {
+      console.log("点击了我自己，准备取消轮巡");
+      this.$refs.takepicRef.clearFn();
+    },
+    //控制显示与隐藏
+    showButton(key) {
+      if (this.roleUser !== "0") {
+        return this.showButtonMap[key] || false;
+      } else {
+        return true;
+      }
+    },
+    showhisButton(key) {
+      if (this.roleUser !== "0") {
+        return this.showhisButtonMap[key] || false;
+      } else {
+        return true;
+      }
+    },
+    //双击选中复制
+    handleDblClick(val) {
+      // alert(val);
+      var input = document.createElement("input"); // 创建input对象
+      input.value = val; // 设置复制内容
+      document.body.appendChild(input); // 添加临时实例
+      input.select(); // 选择实例内容
+      document.execCommand("Copy"); // 执行复制
+      document.body.removeChild(input); // 删除临时实例
+      //this.$message.success("复制成功！");
+      this.$message({
+        duration: 800,
+        showClose: true,
+        message: "复制成功！",
+        type: "success",
+      });
+    },
     //获取当前时间
     getDateTime() {
       console.log(new Date());
       this.dateValue = new Date().getTime();
       console.log(this.dateValue);
     },
+    //点击收藏和取消收藏
+    addCollectClick() {
+      if (this.areaData.isfavor !== 1) {
+        this.areaData.isfavor = 1;
+        addFavorList({ list: [this.areaData.id], type: 1 }).then((res) => {
+          EventBus.$emit("treelist");
+        });
+        this.$message({
+          type: "success",
+          message: "添加成功!",
+        });
+        // this.$confirm("此操作将添加至收藏夹, 是否继续?", "提示", {
+        //   confirmButtonText: "确定",
+        //   cancelButtonText: "取消",
+        //   type: "warning",
+        // }).then(() => {
+
+        // });
+      } else {
+        this.$confirm("此操作将取消收藏, 是否继续?", "提示", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning",
+        }).then(() => {
+          this.areaData.isfavor = 0;
+          addFavorList({ list: [this.areaData.id], type: 0 }).then((res) => {
+            EventBus.$emit("treelist");
+          });
+          this.$message({
+            type: "success",
+            message: "取消收藏!",
+          });
+        });
+      }
+    },
+    //focus时间重新赋值
+    handleDateFocus() {
+      // 更新pickerOptions的disabledDate函数，禁用大于当前时间的日期
+      this.pickerOptions.disabledDate = (date) => {
+        //console.log(date);
+        const currentDate = new Date();
+        return date.getTime() > currentDate.getTime(); // 禁用大于今天的日期
+      };
+    },
     //选择时间
     changedate() {
       console.log(this.dateValue.getTime());
+      this.dateValue = this.dateValue.getTime();
       this.$parent.getPhotoList(
         this.selectChannelValue,
         this.dateValue,
@@ -157,6 +426,7 @@ export default {
     //获取通道的接口
     getChannelList() {
       console.log(this.areaData);
+      console.log("我是选择的通道号", localStorage.getItem("channelId"));
       getChannelByTermidJoggle({ termid: this.areaData.id })
         .then((res) => {
           console.log(res);
@@ -165,10 +435,29 @@ export default {
           ];
           this.channelListOption = this.channelListOption.concat(res.data.list);
           console.log(this.channelListOption);
+          this.channelfocalOpyion = res.data.list; //焦距通道
+          console.log(
+            "我是获取通道接口之后的通道",
+            this.channelListOption[0].channelid
+          );
 
-          this.selectChannelValue = this.channelListOption[0].channelid; //默认选中所有通道;
+          this.selectChannelValue =
+            Number(localStorage.getItem("channelId")) == 0
+              ? -1
+              : Number(localStorage.getItem("channelId")); //默认选中所有通道;
           this.$store.commit("channelId", this.selectChannelValue); //通道保存在vuex中
           this.$store.commit("channelIdList", res.data.list); //将通道保存在vuex中
+          if (this.selectChannelValue != -1) {
+            console.log(this.channelListOption[this.selectChannelValue].type);
+            if (this.channelListOption[this.selectChannelValue].type == 1) {
+              this.yzwFlag = true;
+            } else {
+              this.yzwFlag = false;
+            }
+          } else {
+            console.log("我选的是全部");
+            this.yzwFlag = false;
+          }
           this.$parent.getPhotoList(
             this.selectChannelValue,
             this.dateValue,
@@ -176,7 +465,13 @@ export default {
           );
           this.selectDyId = res.data.dyId;
           this.selectLineId = res.data.lineId;
-          this.selectTowerId = res.data.towerId;
+          //this.selectTowerId = res.data.towerId;
+          if (res.data.list.length == 0) {
+            this.channelarrValue = null;
+            return;
+          } else {
+            this.channelarrValue = this.channelfocalOpyion[0].channelid;
+          }
         })
         .catch((err) => {
           console.log(err); //代码错误、请求失败捕获
@@ -185,12 +480,145 @@ export default {
     //切换通道
     changeChannelId(val) {
       console.log(val);
+      // const a = this.channelListOption.find((channel) => channel.type === 1);
+      // console.log(a);
+      this.yzwVal = "";
+      if (val != -1) {
+        console.log(this.channelListOption[val].type);
+        if (this.channelListOption[val].type == 1) {
+          this.yzwFlag = true;
+        } else {
+          this.yzwFlag = false;
+        }
+      } else {
+        console.log("我选的是全部");
+        this.yzwFlag = false;
+      }
       this.$store.commit("channelId", val); //将currentData保存在vuex中
       this.$parent.getPhotoList(val, this.dateValue, this.areaData.id);
     },
+    searchYzw() {
+      this.$parent.getPhotoList(
+        this.selectChannelValue,
+        this.dateValue,
+        this.areaData.id,
+        this.yzwVal
+      );
+    },
+    //切换gps开启关闭
+    handleCommandGps(command) {
+      switch (command) {
+        case "open": //开启
+          this.changeGPS(1, this.areaData.id);
+          break;
+        case "close": //关闭
+          this.changeGPS(0, this.areaData.id);
+          break;
+      }
+    },
+    changeGPS(val, cmdid) {
+      console.log(val, cmdid);
+      getTermStatus({ termId: cmdid }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          setTermGPSJoggle({ gpsstatus: val, cmdId: cmdid })
+            .then((res) => {
+              console.log(res);
+              if (val == 0) {
+                this.$message({
+                  duration: 1500,
+                  message: "GPS已关闭",
+                  type: "warning",
+                  showClose: true,
+                });
+              } else {
+                this.$message({
+                  duration: 1500,
+                  message: "成功开启GPS",
+                  type: "success",
+                  showClose: true,
+                });
+              }
+            })
+            .catch((err) => {
+              console.log(err); //代码错误、请求失败捕获
+            });
+        } else {
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+    },
+    //获取覆冰和微气象数据
+
+    handleiceAndweather(command) {
+      switch (command) {
+        case "weather": //开启
+          this.changeweathIce("1", this.areaData.id);
+          break;
+        case "ice": //关闭
+          this.changeweathIce("34", this.areaData.id);
+          break;
+      }
+    },
+    changeweathIce(val, cmdid) {
+      console.log(val, cmdid);
+      getTermStatus({ termId: cmdid }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          let params = [
+            {
+              name: "act",
+              value: "reqdata",
+            },
+            {
+              name: "reqType",
+              value: val,
+            },
+            {
+              name: "startTime",
+              value: 0,
+            },
+            {
+              name: "endTime",
+              value: 0,
+            },
+          ];
+          this.setTermFn(params);
+        } else {
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+    },
+    setTermFn(val) {
+      setTermCamera({
+        termId: this.areaData.id,
+        list: val,
+      })
+        .then((res) => {
+          console.log(res);
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "命令已下发",
+            type: "success",
+          });
+        })
+        .catch((err) => {});
+    },
     //历史图片跳转
     handlehistoryPic() {
       console.log(this.areaData);
+
       console.log(this.selectDyId, this.selectLineId, this.selectTowerId);
       // console.log(this.zzCmdid, this.selectChannelValue);
       if (typeof this.dateValue == "number") {
@@ -203,7 +631,7 @@ export default {
         query: {
           dyId: this.selectDyId,
           lineId: this.selectLineId,
-          towerId: this.selectTowerId,
+          towerId: this.areaData.towerid,
           termId: this.areaData.id,
           cmdId: this.areaData.cmdid,
           channelId: this.selectChannelValue,
@@ -216,6 +644,80 @@ export default {
       console.log(this.areaData);
       this.$refs.parameterSetref.display(this.areaData);
     },
+    //基本信息报
+    //数据查询
+    handleSearchCommand(command, row) {
+      console.log(command, row);
+      switch (command) {
+        case "info":
+          this.$refs.baseInfor_ref.display(row);
+          break;
+        case "workStatus":
+          this.$refs.workStatus_ref.display(row);
+          break;
+        case "runStatus":
+          this.$refs.runStatus_ref.display(row);
+          break;
+        case "GPS":
+          this.$refs.gpsSite_ref.display(row);
+          break;
+        case "faultInfo":
+          this.$refs.fultInfo_ref.display(row);
+          break;
+        default:
+          break;
+      }
+    },
+    //焦距放大缩小
+    amplify() {
+      getTermStatus({ termId: this.areaData.id }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          updateTermCamera({
+            termId: this.areaData.id,
+            channelId: this.channelarrValue,
+            type: 6,
+          })
+            .then((res) => {})
+            .catch();
+          //this.$refs.infodialog_ref.getListData(this.channelId, this.cmdid);
+        } else {
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+      console.log(this.channelarrValue, this.areaData.id);
+    },
+    //焦距缩小
+    reduce() {
+      getTermStatus({ termId: this.areaData.id }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          updateTermCamera({
+            termId: this.areaData.id,
+            channelId: this.channelarrValue,
+            type: 7,
+          })
+            .then((res) => {})
+            .catch();
+          //this.$refs.infodialog_ref.getListData(this.channelId, this.cmdid);
+        } else {
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+    },
+    handleuploadPic() {
+      this.$refs.uploadpicref.display(this.areaData);
+    },
   },
 };
 </script>
@@ -227,6 +729,14 @@ export default {
     color: #169e8c;
     font-size: 14px;
     font-weight: normal;
+    display: flex;
+    justify-content: space-between;
+    span {
+      font-size: 12px;
+    }
+    .el-button--text {
+      color: #f08200;
+    }
   }
   .paramsDate {
     margin-bottom: 16px;
@@ -238,7 +748,7 @@ export default {
       margin-bottom: 8px;
     }
     .el-radio-group {
-      display: flex;
+      // display: flex;
       flex-wrap: wrap;
       .el-radio-button {
         margin-right: 6px;
@@ -254,6 +764,9 @@ export default {
         }
       }
     }
+    .yzwBox {
+      margin-top: 2px;
+    }
   }
   .setTimebtn {
     .buttonGroup {
@@ -269,5 +782,38 @@ export default {
       }
     }
   }
+  .setfocalLength {
+    margin-bottom: 16px;
+    position: relative;
+    h3 {
+      font-size: 14px;
+      font-weight: normal;
+      color: #303133;
+      margin-bottom: 8px;
+    }
+    .selectChannel {
+      display: flex;
+      align-items: center;
+      margin-bottom: 12px;
+      .labelname {
+        font-size: 14px;
+        margin-right: 4px;
+        width: 80px;
+        color: #666;
+      }
+    }
+    .buttonGroup {
+      display: flex;
+      flex-wrap: wrap;
+      justify-content: space-between;
+      .el-button {
+        margin-bottom: 8px;
+        width: 104px;
+      }
+      .el-button + .el-button {
+        margin-left: 0px;
+      }
+    }
+  }
 }
 </style>

src/views/realTimeMonitor/components/ptzDevice/components/setTime.vue

@@ -0,0 +1,884 @@
+<template>
+  <div class="setTime">
+    <el-dialog
+      title="选择拍照时间表"
+      :visible.sync="dialogVisible"
+      width="1100px"
+    >
+      <div class="setBox">
+        <div class="head">
+          <div class="left">
+            <h3>通道：</h3>
+            <el-select
+              v-model="channelVal"
+              placeholder="请选择通道"
+              ref="multiSelect"
+              class="channelDiv"
+            >
+              <el-option
+                v-for="item in channelListOption"
+                :key="item.channelid"
+                :label="
+                  item.alias !== null && item.alias !== ''
+                    ? item.alias
+                    : item.channelname
+                "
+                :value="item.channelid"
+              >
+                {{
+                  item.alias !== null && item.alias !== ""
+                    ? item.alias
+                    : item.channelname
+                }}
+              </el-option>
+            </el-select>
+          </div>
+          <div class="left">
+            <el-button type="primary" class="serachBtn" @click="deviceTimeClick"
+              >查询</el-button
+            ><span class="timeTotal">({{ deviceTimeList.length }})</span>
+          </div>
+        </div>
+        <div class="contain">
+          <div class="xfTime">
+            <div class="timelist">
+              <ul>
+                <li
+                  v-for="(item, index) in timeList"
+                  :key="index"
+                  @click="deleteTime(index)"
+                >
+                  <el-tag :type="selectedIndex === index ? 'danger' : ''"
+                    >时间点:{{ item.time }} + 预置位:{{ item.preset }}</el-tag
+                  >
+                </li>
+              </ul>
+            </div>
+            <div class="timeBtnGrop">
+              <el-button type="primary" @click="addTimeList">增加</el-button>
+              <el-button type="primary" @click="timeFrameVisible = true"
+                >批量增加</el-button
+              >
+              <el-button type="primary" @click="deleteSelectedTime"
+                >删除</el-button
+              >
+              <el-button type="primary" @click="clearAllTime"
+                >清除全部</el-button
+              >
+              <el-button
+                type="primary"
+                class="xfsjbBtn"
+                @click="handleSetTimeClick"
+                :loading="sureloading"
+                >下发时间表</el-button
+              >
+            </div>
+          </div>
+          <div
+            class="tagsBox"
+            v-loading="timeloading"
+            v-if="deviceTimeList.length !== 0"
+          >
+            <el-tag v-for="(item, index) in deviceTimeList" :key="index"
+              >时间点:{{ $moment(item).format("HH:mm") }} + 预置位:
+              {{ item.preset || 255 }}</el-tag
+            >
+          </div>
+          <div class="tagsBox" v-loading="timeloading" v-else>
+            <el-empty description="暂无时间表"></el-empty>
+          </div>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="closeTimeFun">取 消</el-button>
+      </span>
+      <el-dialog
+        width="340px"
+        title="拍照时间"
+        :visible.sync="timeInnerVisible"
+        append-to-body
+        class="timeinnerClass"
+      >
+        <div class="timePoint">
+          <div class="timeinput">
+            <h3>时间：</h3>
+            <el-time-picker
+              v-model="timePointVal"
+              :picker-options="{
+                selectableRange: '00:00:00 - 23:59:59',
+              }"
+              placeholder="任意时间点"
+              default-time="00:00:00"
+            >
+            </el-time-picker>
+          </div>
+          <div class="timeprt">
+            <h3>预置位：</h3>
+            <el-input v-model="presetVal" placeholder="请输入"></el-input>
+          </div>
+        </div>
+        <span slot="footer" class="dialog-footer">
+          <el-button @click="timeInnerVisible = false">取 消</el-button>
+          <el-button type="primary" @click="sureTime">确 定</el-button>
+        </span>
+      </el-dialog>
+      <el-dialog
+        width="340px"
+        title="拍照时间范围"
+        :visible.sync="timeFrameVisible"
+        append-to-body
+        class="timeinnerClass"
+      >
+        <div class="timePoint">
+          <div class="timeinput timepick">
+            <h3>时间：</h3>
+            <el-time-picker
+              is-range
+              v-model="timeValue"
+              range-separator="至"
+              start-placeholder="开始时间"
+              end-placeholder="结束时间"
+              placeholder="选择时间范围"
+            >
+            </el-time-picker>
+          </div>
+          <div class="timeSpan">
+            <h3>间隔：</h3>
+            <el-input-number v-model="timeNum"></el-input-number>
+          </div>
+          <div class="timeprt">
+            <h3>预置位：</h3>
+            <el-input v-model="presetspanVal" placeholder="请输入"></el-input>
+          </div>
+        </div>
+        <span slot="footer" class="dialog-footer">
+          <el-button @click="timeFrameVisible = false">取 消</el-button>
+          <el-button type="primary" @click="surepickTime">确 定</el-button>
+        </span>
+      </el-dialog>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import {
+  getChannelByTermidJoggle,
+  getTermStatus,
+  setTermCamera,
+  getTermCameraRequest,
+} from "@/utils/api/index";
+export default {
+  data() {
+    return {
+      timeloading: false,
+      deviceData: "", //设备信息
+      dialogVisible: false,
+      timeList: [], // 存储生成的时间点列表
+      channelVal: 1,
+      channelListOption: [], //通道数组
+      timeInnerVisible: false, //新增时间点弹窗
+      presetVal: 255, //默认预置位
+      timePointVal: "", //默认时间
+      deviceTimeList: [], //查询出来的时间表
+      timeparams: [], //点击获取时间点
+      deviceTimer: null, //装置循环获取
+      deviceNum: 1, //循环次数
+      attemptCount: 0, // 新增的尝试次数计数器
+      maxAttempts: 9, // 设置最大尝试次数
+
+      timeFrameVisible: false, //批量时间
+      timeValue: [], //开始时间，结束时间
+      timeNum: 30, //时间间隔
+      presetspanVal: 255, //时间间隔预置位
+
+      selectedIndex: null, // 用于存储选中的时间点索引
+      sureloading: false,
+    };
+  },
+  mounted() {
+    // 获取当前日期
+    let today = new Date();
+    // 设置今天的零点
+    let startOfDay = new Date(today);
+    startOfDay.setHours(0, 0, 0, 0); // 将小时、分钟、秒和毫秒均设为0
+    this.timePointVal = startOfDay;
+    // 获取当前日期
+    let todayspan = new Date();
+    // 设置今天的零点
+    let startOfDayspan = new Date(todayspan);
+    startOfDayspan.setHours(0, 0, 0, 0); // 将小时、分钟、秒和毫秒均设为0
+    // 设置今天的23点59分59秒
+    let endOfDayspan = new Date(todayspan);
+    endOfDayspan.setHours(23, 59, 59, 999); // 将小时设为23，分钟设为59，秒设为59，毫秒设为999（或您希望的任意毫秒值）
+    // 更新value1数组
+    this.timeValue = [startOfDayspan, endOfDayspan];
+  },
+  methods: {
+    display(val) {
+      this.dialogVisible = true;
+      this.deviceData = val;
+      console.log(this.deviceData);
+      this.getChannelList();
+      this.deviceTimeClick();
+    },
+    //获取通道的接口
+    getChannelList() {
+      console.log(this.deviceData);
+      getChannelByTermidJoggle({ termid: this.deviceData.id })
+        .then((res) => {
+          console.log(res);
+          this.channelListOption = res.data.list;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    // 点击时间点时触发，记录选中的索引
+    deleteTime(index) {
+      this.selectedIndex = index;
+    },
+    // 点击删除按钮时触发，删除选中的时间点
+    deleteSelectedTime() {
+      if (this.selectedIndex !== null) {
+        this.timeList.splice(this.selectedIndex, 1);
+        this.selectedIndex = null; // 重置选中的索引
+      }
+    },
+    //添加时间点和预置位
+    addTimeList() {
+      this.timeInnerVisible = true;
+    },
+    //优化时间
+    formatTime(date) {
+      // 格式化日期时间为字符串，例如 "HH:mm"
+      const hours = String(date.getHours()).padStart(2, "0");
+      const minutes = String(date.getMinutes()).padStart(2, "0");
+      return `${hours}:${minutes}`;
+    },
+    //保存当前时间点位
+    sureTime() {
+      console.log(this.timePointVal, this.presetVal);
+
+      // 格式化时间
+      const newTime = this.formatTime(this.timePointVal);
+      const newPreset = this.presetVal;
+
+      // 检查是否已经存在相同的时间点和预置位
+      const isDuplicate = this.timeList.some(
+        (item) => item.time === newTime && item.preset === newPreset
+      );
+
+      // 如果没有重复，则添加到 timeList
+      if (!isDuplicate) {
+        this.timeList.push({
+          time: newTime,
+          preset: newPreset,
+        });
+      } else {
+        this.$message({
+          duration: 1500,
+          showClose: true,
+          message: "重复的时间点和预置位，未添加到列表中",
+          type: "warning",
+        });
+      }
+      // console.log(this.timePointVal, this.presetVal);
+      // this.timeList.push({
+      //   time: this.formatTime(this.timePointVal),
+      //   preset: this.presetVal,
+      // });
+      this.timeInnerVisible = false;
+    },
+    //时间间隔生成时间点
+    surepickTime() {
+      // 获取时间间隔的毫秒数
+      const intervalMs = this.timeNum * 60 * 1000;
+      // 克隆开始时间，避免修改原始timeValue数组中的startOfDay对象
+      let currentTime = new Date(this.timeValue[0]);
+      // let currentTime = this.timeValue[0];
+      // 循环生成时间点，直到达到或超过结束时间
+      console.log(currentTime);
+      console.log(this.timeValue[0]);
+      console.log(this.timeValue[1]);
+      console.log(this.timeValue);
+      while (currentTime <= this.timeValue[1]) {
+        // 将当前时间点添加到列表中
+        this.timeList.push({
+          time: this.formatTime(currentTime),
+          preset: this.presetspanVal,
+        });
+        // 增加时间间隔
+        currentTime.setTime(currentTime.getTime() + intervalMs);
+      }
+      // 打印时间点列表到控制台（可选）
+
+      console.log(this.timeList);
+      this.timeFrameVisible = false;
+    },
+
+    handleSetTimeClick() {
+      this.sureloading = true;
+      this.timeparams = [];
+      this.timeList.forEach((time) => {
+        // 直接向数组中添加一个新对象
+        this.timeparams.push({
+          time: time.time,
+          preset: time.preset,
+        });
+      });
+      this.timeparams = this.timeparams.reduce((acc, current) => {
+        const key = `${current.time}-${current.preset}`; // 生成唯一键
+        if (!acc.some((item) => `${item.time}-${item.preset}` === key)) {
+          acc.push(current); // 添加到结果数组
+        }
+        return acc;
+      }, []);
+      console.log(this.timeparams);
+      this.getsetTimeFun();
+    },
+    getsetTimeFun() {
+      getTermStatus({ termId: this.deviceData.id }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          console.log(this.channelVal, this.setNum, this.deviceData.protocol);
+          let params = [
+            {
+              name: "act",
+              value: "schedule",
+            },
+            {
+              name: "udp",
+              value: 1,
+            },
+            {
+              name: "flag",
+              value: 1,
+            },
+            {
+              name: "channel",
+              value: this.channelVal,
+            },
+          ];
+
+          if (
+            this.deviceData.protocol == "65283" ||
+            this.deviceData.protocol == "65285" ||
+            this.deviceData.protocol == "65290" ||
+            this.deviceData.protocol == "65298"
+          ) {
+            //我是时间间隔
+            let timeArr = [];
+            console.log("我是其它，时间间隔");
+            console.log(this.timeValue);
+            console.log(this.timeNum);
+            var Stime = this.$moment(this.timeValue[0], "HH:mm").format(
+              "YYYY-MM-DD HH:mm:ss"
+            );
+            //结束时间不添加偏移量
+            var Etime = this.$moment(this.timeValue[1], "HH:mm").format(
+              "YYYY-MM-DD HH:mm:ss"
+            );
+            var spanTime = this.timeNum;
+            let fistSpan = this.$moment(new Date())
+              .startOf("day")
+              .minutes(spanTime)
+              .format("YYYY-MM-DD HH:mm:ss");
+            timeArr.push(fistSpan, Stime, Etime);
+            console.log(timeArr);
+            let group = timeArr.length;
+            params.push({
+              name: "group",
+              value: group,
+            });
+            let timeArrList = [];
+            for (var k = 0; k < timeArr.length; k++) {
+              //console.log(moment(dayArr[k]).hour());
+              timeArrList.push({
+                hour: this.$moment(timeArr[k]).hour(),
+                minute: this.$moment(timeArr[k]).minute(),
+                preset: 255,
+              });
+            }
+            console.log(timeArrList);
+            for (let m = 0; m < timeArrList.length; m++) {
+              console.log(timeArrList[m]);
+              params.push(
+                {
+                  name: "hour" + (m + 1),
+                  value: timeArrList[m].hour,
+                },
+                {
+                  name: "min" + (m + 1),
+                  value: timeArrList[m].minute,
+                },
+                {
+                  name: "preset" + (m + 1),
+                  value: timeArrList[m].preset,
+                }
+              );
+            }
+          } else {
+            let group = this.timeparams.length;
+            params.push({
+              name: "group",
+              value: group,
+            });
+            //时间点下发拍照时间表
+            for (let m = 0; m < this.timeparams.length; m++) {
+              console.log(this.timeparams[m].time);
+              let time = this.$moment(this.timeparams[m].time, "HH:mm"); // 使用 moment 库解析时间点
+              console.log(time);
+              params.push(
+                {
+                  name: "hour" + (m + 1),
+                  value: time.hour(),
+                },
+                {
+                  name: "min" + (m + 1),
+                  value: time.minute(),
+                },
+                {
+                  name: "preset" + (m + 1),
+                  value: this.timeparams[m].preset,
+                }
+              );
+            }
+            console.log(params);
+            let timeArrList = [];
+            for (var k = 0; k < this.timeparams.length; k++) {
+              //console.log(moment(dayArr[k]).hour());
+              console.log(this.timeparams[k].time);
+              let time = this.$moment(this.timeparams[k].time, "HH:mm"); // 使用 moment 库解析时间点
+              console.log(time);
+              timeArrList.push({
+                hour: time.hour(),
+                minute: time.minute(),
+                preset: this.timeparams[k].preset,
+              });
+            }
+            console.log(timeArrList);
+            var parmsobj = {
+              termid: this.deviceData.id,
+              channelid: this.channelVal,
+              list: timeArrList,
+            };
+          }
+
+          console.log(params);
+
+          this.setTermFnRule(params);
+        } else {
+          this.sureloading = false;
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+    },
+    //下发时间表
+    setTermFnRule(dataParams) {
+      setTermCamera({
+        termId: this.deviceData.id,
+        list: dataParams,
+      })
+        .then((res) => {
+          console.log(res);
+          this.requestid = res.data.requestId;
+          clearInterval(this.timer);
+          this.deviceTimer = window.setInterval(() => {
+            this.getinfoRules();
+            this.deviceNum++;
+            console.log(this.deviceNum, this.deviceNum * 1000);
+          }, 1000 * this.deviceNum);
+        })
+        .catch((err) => {});
+    },
+    getinfoRules() {
+      getTermCameraRequest({ requestid: this.requestid })
+        .then((res) => {
+          if (res.data.success == 1) {
+            this.sureloading = false;
+            window.clearInterval(this.deviceTimer);
+            this.deviceTimer = null;
+            this.deviceNum = 1;
+            console.log(JSON.parse(res.data.data));
+
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "时间表下发成功",
+              type: "success",
+            });
+            this.dialogVisible = false;
+            this.closeTimeFun();
+          } else if (this.deviceNum > 9) {
+            this.sureloading = false;
+            window.clearInterval(this.deviceTimer);
+            this.deviceTimer = null;
+            this.deviceNum = 1;
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "时间表下发失败",
+              type: "error",
+            });
+            this.dialogVisible = false;
+            this.closeTimeFun();
+          }
+        })
+        .catch((err) => {});
+    },
+    //查询
+    //获取装置的时间表
+    deviceTimeClick() {
+      console.log("点击了获取装置时间表");
+      this.timeloading = true;
+      if (this.deviceData.onlinestatus === 1) {
+        this.deviceTimeLoading = true;
+        let params = [
+          {
+            name: "act",
+            value: "schedule",
+          },
+          {
+            name: "udp",
+            value: 1,
+          },
+          {
+            name: "flag",
+            value: 0,
+          },
+          {
+            name: "channel",
+            value: this.channelVal,
+          },
+        ];
+        this.setTermFn(params);
+      } else {
+        this.$message({
+          duration: 1500,
+          showClose: true,
+          message: "装置下线，发送指令失败",
+          type: "error",
+        });
+      }
+    },
+    //装置获取拍照时间表和下发公用接口
+    setTermFn(dataParams) {
+      console.log("点击了统一的接口", dataParams);
+      setTermCamera({
+        termId: this.deviceData.id,
+        list: dataParams,
+      })
+        .then((res) => {
+          console.log(res);
+          this.requestid = res.data.requestId;
+          // 清除可能存在的旧定时器
+          if (this.deviceTimer) {
+            clearInterval(this.deviceTimer);
+          }
+          // 设置新的定时器，每秒调用一次 getinfo
+          this.deviceTimer = window.setInterval(() => {
+            this.getinfo();
+          }, 1000);
+        })
+        .catch((err) => {
+          if (this.deviceTimer) {
+            clearInterval(this.deviceTimer);
+            this.deviceTimer = null;
+          }
+        });
+    },
+    //获取时间表
+    getinfo() {
+      getTermCameraRequest({ requestid: this.requestid })
+        .then((res) => {
+          if (res.data.success == 1) {
+            this.deviceTimeLoading = false;
+            this.timeloading = false;
+            clearInterval(this.deviceTimer);
+            this.deviceTimer = null;
+            this.attemptCount = 0; // 重置尝试次数计数器
+            console.log(JSON.parse(res.data.data));
+            //this.deviceTimeList = JSON.parse(res.data.data).groupData;
+            this.processingData(JSON.parse(res.data.data).groupData); //执行数据转化
+
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "装置时间表已更新",
+              type: "success",
+            });
+          } else {
+            this.attemptCount++; // 尝试次数加1
+            if (this.attemptCount >= this.maxAttempts) {
+              // 达到最大尝试次数，停止定时器并显示错误消息
+              clearInterval(this.deviceTimer);
+              this.deviceTimer = null;
+              this.deviceTimeLoading = false;
+              this.timeloading = false;
+
+              this.$message({
+                duration: 1500,
+                showClose: true,
+                message: "查询失败",
+                type: "error",
+              });
+              this.deviceTimeList = [];
+            }
+          }
+        })
+        .catch((err) => {});
+    },
+    //根据规约处理时间表数据
+    processingData(val) {
+      console.log(this.deviceData.protocol);
+      if (
+        this.deviceData.protocol == "65283" ||
+        this.deviceData.protocol == "65285" ||
+        this.deviceData.protocol == "65290" ||
+        this.deviceData.protocol == "65298"
+      ) {
+        //湖南规约
+        console.log("湖南");
+        console.log(val);
+        var hnarr = [];
+        for (var i = 0; i < val.length; i++) {
+          if (i % 3 == 0) {
+            var hnobj = {};
+            hnobj.span = val[i].hour * 60 + val[i].minute;
+            console.log("时间间隔");
+          } else if (i % 3 == 1) {
+            console.log("开始时间");
+            console.log("a");
+            hnobj.startTime = this.$moment(val[i]).format("HH:mm");
+          } else if (i % 3 == 2) {
+            console.log("结束时间");
+            hnobj.endTime = this.$moment(val[i]).format("HH:mm");
+            hnarr.push(hnobj);
+          }
+        }
+        console.log("222222222222222222");
+        console.log(hnarr);
+        console.log("22222222222222222222222");
+        let dayArr = [];
+        //根据开始时间结束时间生产数组
+        for (let k = 0; k < hnarr.length; k++) {
+          console.log(hnarr[k].startTime);
+          console.log(hnarr[k].endTime);
+          console.log(hnarr[k].span);
+          let Stime = this.$moment(hnarr[k].startTime, "HH:mm").format(
+            "YYYY-MM-DD HH:mm:ss"
+          );
+
+          let Etime = this.$moment(hnarr[k].endTime, "HH:mm").format(
+            "YYYY-MM-DD HH:mm:ss"
+          );
+          let spanTime = hnarr[k].span;
+          if (this.$moment(Etime).isBefore(this.$moment(Stime))) {
+            let zeroEnd = this.$moment("23:59", "HH:mm").format(
+              "YYYY-MM-DD HH:mm:ss"
+            );
+            let zeroStart = this.$moment("00:00", "HH:mm").format(
+              "YYYY-MM-DD HH:mm:ss"
+            );
+            while (
+              this.$moment(Stime).isBefore(this.$moment(zeroEnd)) ||
+              this.$moment(Stime).isSame(this.$moment(zeroEnd))
+            ) {
+              dayArr.push(Stime);
+              Stime = this.$moment(Stime)
+                .add(spanTime, "minute")
+                .format("YYYY-MM-DD HH:mm:ss");
+            }
+            while (
+              this.$moment(zeroStart).isBefore(this.$moment(Etime)) ||
+              this.$moment(zeroStart).isSame(this.$moment(Etime))
+            ) {
+              dayArr.push(zeroStart);
+              zeroStart = this.$moment(zeroStart)
+                .add(spanTime, "minute")
+                .format("YYYY-MM-DD HH:mm:ss");
+            }
+          } else {
+            while (
+              this.$moment(Stime).isBefore(this.$moment(Etime)) ||
+              this.$moment(Stime).isSame(this.$moment(Etime))
+            ) {
+              dayArr.push(Stime);
+              Stime = this.$moment(Stime)
+                .add(spanTime, "minute")
+                .format("YYYY-MM-DD HH:mm:ss");
+            }
+          }
+
+          // // 将结束日期的天放进数组
+          console.log(dayArr);
+        }
+        this.deviceTimeList = [...new Set(dayArr)];
+      } else {
+        //其他规约
+        this.deviceTimeList = val;
+      }
+    },
+    clearAllTime() {
+      this.timeList = [];
+      this.timeparams = [];
+      this.deviceTimeList = [];
+      this.selectedIndex = null;
+    },
+    closeTimeFun() {
+      this.dialogVisible = false;
+      this.timeList = [];
+      this.deviceTimeList = [];
+      this.timeparams = [];
+      this.selectedIndex = null;
+    },
+  },
+};
+</script>
+<style lang="less">
+.setTime {
+  .setBox {
+    .head {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      .left,
+      .right {
+        display: flex;
+        align-items: center;
+      }
+      h3 {
+        margin-bottom: 0px;
+      }
+      .channelDiv {
+        width: 120px;
+        margin-right: 12px;
+      }
+      .el-date-editor {
+        width: 220px;
+      }
+      .timespan {
+        margin-left: 12px;
+      }
+      .showList {
+        margin-left: 12px;
+        width: 90px !important;
+        margin-bottom: 0px !important;
+      }
+      .serachBtn {
+        margin-left: 8px !important;
+        width: 60px !important;
+        margin-bottom: 0px !important;
+      }
+      .timeTotal {
+        margin-left: 12px;
+      }
+    }
+    .contain {
+      height: 410px;
+      margin-top: 20px;
+      display: flex;
+      width: 100%;
+      .xfTime {
+        width: 670px;
+        display: flex;
+        border: 1px solid #e0e0e0;
+        border-radius: 4px;
+        box-sizing: border-box;
+        .timelist {
+          width: 530px;
+          border-right: 1px solid #e0e0e0;
+          padding: 12px;
+          padding-right: 0px;
+          ul {
+            display: flex;
+            flex-wrap: wrap;
+            align-content: flex-start; //加这个属性就能解决
+            overflow: auto;
+            height: 390px;
+            //width: 60%;
+            li {
+              width: 174px;
+              list-style: none;
+              height: 40px;
+              line-height: 40px;
+              .el-input {
+                width: 80px;
+                margin-left: 12px;
+              }
+            }
+          }
+        }
+        .timeBtnGrop {
+          display: flex;
+          flex-direction: column;
+          margin-top: 12px;
+
+          .el-button {
+            width: 94px;
+            margin-left: 6px;
+          }
+          .xfsjbBtn {
+            justify-items: end;
+            margin-top: auto;
+          }
+        }
+      }
+      .tagsBox {
+        width: 390px;
+        margin-left: 20px;
+        overflow: auto;
+        height: 410px;
+        border: 1px solid #e0e0e0;
+        .el-tag {
+          margin-bottom: 12px;
+          margin-right: 12px;
+        }
+      }
+    }
+  }
+}
+.timeinnerClass {
+  .timePoint {
+    .timeinput {
+      display: flex;
+      align-items: center;
+      margin-bottom: 12px;
+      h3 {
+        font-weight: normal;
+        width: 80px;
+      }
+    }
+    .timepick {
+      .el-date-editor {
+        width: 220px;
+      }
+    }
+    .timeSpan {
+      display: flex;
+      align-items: center;
+      margin-bottom: 12px;
+      h3 {
+        font-weight: normal;
+        width: 80px;
+      }
+    }
+    .timeprt {
+      display: flex;
+      align-items: center;
+
+      h3 {
+        font-weight: normal;
+        width: 80px;
+      }
+      .el-input {
+        width: 220px;
+      }
+    }
+  }
+}
+</style>

src/views/realTimeMonitor/components/ptzDevice/components/setTimebak.vue

@@ -0,0 +1,676 @@
+<template>
+  <div class="setTime">
+    <el-dialog
+      title="选择拍照时间表"
+      :visible.sync="dialogVisible"
+      width="1100px"
+    >
+      <div class="setBox">
+        <div class="head">
+          <h3>通道：</h3>
+          <el-select
+            v-model="channelVal"
+            placeholder="请选择通道"
+            ref="multiSelect"
+            class="channelDiv"
+          >
+            <el-option
+              v-for="item in channelListOption"
+              :key="item.channelid"
+              :label="
+                item.alias !== null && item.alias !== ''
+                  ? item.alias
+                  : item.channelname
+              "
+              :value="item.channelid"
+            >
+              {{
+                item.alias !== null && item.alias !== ""
+                  ? item.alias
+                  : item.channelname
+              }}
+            </el-option>
+          </el-select>
+          <!-- <el-select
+            v-model="channelVal"
+            placeholder="请选择"
+            class="channelDiv"
+          >
+            <el-option
+              v-for="item in channelOptions"
+              :key="item.value"
+              :label="item.label"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select> -->
+          <h3>预置位：</h3>
+          <el-select
+            v-model="presetVal"
+            placeholder="请选择"
+            class="channelDiv"
+            filterable
+          >
+            <el-option
+              v-for="n in 255"
+              :key="n"
+              :label="n"
+              :value="n"
+            ></el-option>
+          </el-select>
+          <h3>选择时间段：</h3>
+          <el-time-picker
+            is-range
+            v-model="timeValue"
+            range-separator="至"
+            start-placeholder="开始时间"
+            end-placeholder="结束时间"
+            placeholder="选择时间范围"
+          >
+          </el-time-picker>
+          <h3 class="timespan">时间间隔：</h3>
+          <el-input-number v-model="timeNum"></el-input-number>
+          <el-button type="primary" class="showList" @click="showTimeList"
+            >时间列表</el-button
+          >
+          <el-button type="primary" class="serachBtn" @click="deviceTimeClick"
+            >查询</el-button
+          >
+        </div>
+        <div class="contain">
+          <ul>
+            <li v-for="(time, index) in timeList" :key="index">
+              {{ formatTime(time) }}
+
+              <el-input
+                v-if="
+                  deviceData.protocol != '65283' &&
+                  deviceData.protocol != '65285' &&
+                  deviceData.protocol != '65290' &&
+                  deviceData.protocol != '65298'
+                "
+                v-model="selectedValues[index]"
+                placeholder="请输入"
+              ></el-input>
+            </li>
+          </ul>
+          <div class="tagsBox" v-if="deviceTimeList.length !== 0">
+            <el-tag v-for="(item, index) in deviceTimeList" :key="index"
+              >时间点：{{ $moment(item).format("HH:mm") }} + 预置位:
+              {{ item.preset || 255 }}</el-tag
+            >
+          </div>
+        </div>
+      </div>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="closeTimeFun">取 消</el-button>
+        <el-button type="primary" @click="handleSetTimeClick"
+          >下发时间表</el-button
+        >
+      </span>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import {
+  getChannelByTermidJoggle,
+  getTermStatus,
+  setTermCamera,
+  getTermCameraRequest,
+} from "@/utils/api/index";
+export default {
+  data() {
+    return {
+      deviceData: "", //设备信息
+      dialogVisible: false,
+      timeValue: [], //开始时间，结束时间
+      timeNum: 30, //时间间隔
+      timeList: [], // 存储生成的时间点列表
+      channelVal: 1,
+      channelListOption: [], //通道数组
+      // channelOptions: [
+      //   {
+      //     value: 1,
+      //     label: "通道1",
+      //   },
+      //   {
+      //     value: 2,
+      //     label: "通道2",
+      //   },
+      // ],
+      selectedValues: [], // 存储每个时间点对应的选中值
+      presetVal: 1, //默认预置位
+      timeparams: [], //点击获取时间点
+      deviceTimer: null, //装置循环获取
+      deviceNum: 1, //循环次数
+      deviceTimeList: [],
+      attemptCount: 0, // 新增的尝试次数计数器
+      maxAttempts: 9, // 设置最大尝试次数
+    };
+  },
+  mounted() {
+    // 获取当前日期
+    let today = new Date();
+    // 设置今天的零点
+    let startOfDay = new Date(today);
+    startOfDay.setHours(0, 0, 0, 0); // 将小时、分钟、秒和毫秒均设为0
+    // 设置今天的23点59分59秒
+    let endOfDay = new Date(today);
+    endOfDay.setHours(23, 59, 59, 999); // 将小时设为23，分钟设为59，秒设为59，毫秒设为999（或您希望的任意毫秒值）
+    // 更新value1数组
+    this.timeValue = [startOfDay, endOfDay];
+  },
+  methods: {
+    display(val) {
+      this.dialogVisible = true;
+      this.deviceData = val;
+      console.log(this.deviceData);
+      this.getChannelList();
+    },
+    //获取通道的接口
+    getChannelList() {
+      console.log(this.deviceData);
+      getChannelByTermidJoggle({ termid: this.deviceData.id })
+        .then((res) => {
+          console.log(res);
+          this.channelListOption = res.data.list;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    showTimeList() {
+      // 清空之前的时间点列表
+      this.timeList = [];
+      // 获取时间间隔的毫秒数
+      const intervalMs = this.timeNum * 60 * 1000;
+      // 克隆开始时间，避免修改原始timeValue数组中的startOfDay对象
+      let currentTime = new Date(this.timeValue[0]);
+      // 循环生成时间点，直到达到或超过结束时间
+      while (currentTime <= this.timeValue[1]) {
+        // 将当前时间点添加到列表中
+        this.timeList.push(new Date(currentTime));
+        // 增加时间间隔
+        currentTime.setTime(currentTime.getTime() + intervalMs);
+      }
+      // 打印时间点列表到控制台（可选）
+      console.log(this.timeList.map(this.formatTime));
+      console.log(this.presetVal);
+      this.selectedValues = this.timeList.map(() => this.presetVal);
+    },
+    formatTime(date) {
+      // 格式化日期时间为字符串，例如 "HH:mm"
+      const hours = String(date.getHours()).padStart(2, "0");
+      const minutes = String(date.getMinutes()).padStart(2, "0");
+      return `${hours}:${minutes}`;
+    },
+    handleSetTimeClick() {
+      this.timeparams = [];
+      this.timeList.forEach((time, index) => {
+        if (this.selectedValues[index] !== undefined) {
+          // 直接向数组中添加一个新对象
+          this.timeparams.push({
+            time: this.formatTime(time),
+            preset: this.selectedValues[index],
+          });
+        }
+      });
+      console.log(this.timeparams);
+      this.getsetTimeFun();
+    },
+    getsetTimeFun() {
+      getTermStatus({ termId: this.deviceData.id }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          console.log(this.channelVal, this.setNum, this.deviceData.protocol);
+          let params = [
+            {
+              name: "act",
+              value: "schedule",
+            },
+            {
+              name: "udp",
+              value: 1,
+            },
+            {
+              name: "flag",
+              value: 1,
+            },
+            {
+              name: "channel",
+              value: this.channelVal,
+            },
+          ];
+
+          if (
+            this.deviceData.protocol == "65283" ||
+            this.deviceData.protocol == "65285" ||
+            this.deviceData.protocol == "65290" ||
+            this.deviceData.protocol == "65298"
+          ) {
+            //我是时间间隔
+            let timeArr = [];
+            console.log("我是其它，时间间隔");
+            console.log(this.timeValue);
+            console.log(this.timeNum);
+            var Stime = this.$moment(this.timeValue[0], "HH:mm").format(
+              "YYYY-MM-DD HH:mm:ss"
+            );
+            //结束时间不添加偏移量
+            var Etime = this.$moment(this.timeValue[1], "HH:mm").format(
+              "YYYY-MM-DD HH:mm:ss"
+            );
+            var spanTime = this.timeNum;
+            let fistSpan = this.$moment(new Date())
+              .startOf("day")
+              .minutes(spanTime)
+              .format("YYYY-MM-DD HH:mm:ss");
+            timeArr.push(fistSpan, Stime, Etime);
+            console.log(timeArr);
+            let group = timeArr.length;
+            params.push({
+              name: "group",
+              value: group,
+            });
+            let timeArrList = [];
+            for (var k = 0; k < timeArr.length; k++) {
+              //console.log(moment(dayArr[k]).hour());
+              timeArrList.push({
+                hour: this.$moment(timeArr[k]).hour(),
+                minute: this.$moment(timeArr[k]).minute(),
+                preset: 255,
+              });
+            }
+            console.log(timeArrList);
+            for (let m = 0; m < timeArrList.length; m++) {
+              console.log(timeArrList[m]);
+              params.push(
+                {
+                  name: "hour" + (m + 1),
+                  value: timeArrList[m].hour,
+                },
+                {
+                  name: "min" + (m + 1),
+                  value: timeArrList[m].minute,
+                },
+                {
+                  name: "preset" + (m + 1),
+                  value: timeArrList[m].preset,
+                }
+              );
+            }
+          } else {
+            let group = this.timeparams.length;
+            params.push({
+              name: "group",
+              value: group,
+            });
+            //时间点下发拍照时间表
+            for (let m = 0; m < this.timeparams.length; m++) {
+              console.log(this.timeparams[m].time);
+              let time = this.$moment(this.timeparams[m].time, "HH:mm"); // 使用 moment 库解析时间点
+              console.log(time);
+              params.push(
+                {
+                  name: "hour" + (m + 1),
+                  value: time.hour(),
+                },
+                {
+                  name: "min" + (m + 1),
+                  value: time.minute(),
+                },
+                {
+                  name: "preset" + (m + 1),
+                  value: this.timeparams[m].preset,
+                }
+              );
+            }
+            console.log(params);
+            let timeArrList = [];
+            for (var k = 0; k < this.timeparams.length; k++) {
+              //console.log(moment(dayArr[k]).hour());
+              console.log(this.timeparams[k].time);
+              let time = this.$moment(this.timeparams[k].time, "HH:mm"); // 使用 moment 库解析时间点
+              console.log(time);
+              timeArrList.push({
+                hour: time.hour(),
+                minute: time.minute(),
+                preset: this.timeparams[k].preset,
+              });
+            }
+            console.log(timeArrList);
+            var parmsobj = {
+              termid: this.deviceData.id,
+              channelid: this.channelVal,
+              list: timeArrList,
+            };
+          }
+
+          console.log(params);
+
+          this.setTermFnRule(params);
+        } else {
+          this.sureloading = false;
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+    },
+    //下发时间表
+    setTermFnRule(dataParams) {
+      setTermCamera({
+        termId: this.deviceData.id,
+        list: dataParams,
+      })
+        .then((res) => {
+          console.log(res);
+          this.requestid = res.data.requestId;
+          clearInterval(this.timer);
+          this.deviceTimer = window.setInterval(() => {
+            this.getinfoRules();
+            this.deviceNum++;
+            console.log(this.deviceNum, this.deviceNum * 1000);
+          }, 1000 * this.deviceNum);
+        })
+        .catch((err) => {});
+    },
+    getinfoRules() {
+      getTermCameraRequest({ requestid: this.requestid })
+        .then((res) => {
+          if (res.data.success == 1) {
+            this.sureloading = false;
+            window.clearInterval(this.deviceTimer);
+            this.deviceTimer = null;
+            this.deviceNum = 1;
+            console.log(JSON.parse(res.data.data));
+            this.isShowset = false;
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "时间表下发成功",
+              type: "success",
+            });
+            this.dialogVisible = false;
+          } else if (this.deviceNum > 9) {
+            this.sureloading = false;
+            window.clearInterval(this.deviceTimer);
+            this.deviceTimer = null;
+            this.deviceNum = 1;
+            this.failedFlag = true;
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "时间表下发失败",
+              type: "error",
+            });
+            this.dialogVisible = false;
+          }
+        })
+        .catch((err) => {});
+    },
+
+    //获取装置的时间表
+    deviceTimeClick() {
+      console.log("点击了获取装置时间表");
+      if (this.deviceData.onlinestatus === 1) {
+        this.deviceTimeLoading = true;
+        let params = [
+          {
+            name: "act",
+            value: "schedule",
+          },
+          {
+            name: "udp",
+            value: 1,
+          },
+          {
+            name: "flag",
+            value: 0,
+          },
+          {
+            name: "channel",
+            value: this.channelVal,
+          },
+        ];
+        this.setTermFn(params);
+      } else {
+        this.$message({
+          duration: 1500,
+          showClose: true,
+          message: "装置下线，发送指令失败",
+          type: "error",
+        });
+      }
+    },
+    //装置获取拍照时间表和下发公用接口
+    setTermFn(dataParams) {
+      console.log("点击了统一的接口", dataParams);
+      setTermCamera({
+        termId: this.deviceData.id,
+        list: dataParams,
+      })
+        .then((res) => {
+          console.log(res);
+          this.requestid = res.data.requestId;
+          // 清除可能存在的旧定时器
+          if (this.deviceTimer) {
+            clearInterval(this.deviceTimer);
+          }
+          // 设置新的定时器，每秒调用一次 getinfo
+          this.deviceTimer = window.setInterval(() => {
+            this.getinfo();
+          }, 1000);
+        })
+        .catch((err) => {
+          if (this.deviceTimer) {
+            clearInterval(this.deviceTimer);
+            this.deviceTimer = null;
+          }
+        });
+    },
+    //获取时间表
+    getinfo() {
+      getTermCameraRequest({ requestid: this.requestid })
+        .then((res) => {
+          if (res.data.success == 1) {
+            this.deviceTimeLoading = false;
+            clearInterval(this.deviceTimer);
+            this.deviceTimer = null;
+            this.attemptCount = 0; // 重置尝试次数计数器
+            console.log(JSON.parse(res.data.data));
+            //this.deviceTimeList = JSON.parse(res.data.data).groupData;
+            this.processingData(JSON.parse(res.data.data).groupData); //执行数据转化
+
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "装置时间表已更新",
+              type: "success",
+            });
+          } else {
+            this.attemptCount++; // 尝试次数加1
+            if (this.attemptCount >= this.maxAttempts) {
+              // 达到最大尝试次数，停止定时器并显示错误消息
+              clearInterval(this.deviceTimer);
+              this.deviceTimer = null;
+              this.deviceTimeLoading = false;
+              this.$message({
+                duration: 1500,
+                showClose: true,
+                message: "查询失败",
+                type: "error",
+              });
+            }
+          }
+        })
+        .catch((err) => {});
+    },
+    //根据规约处理时间表数据
+    processingData(val) {
+      console.log(this.deviceData.protocol);
+      if (
+        this.deviceData.protocol == "65283" ||
+        this.deviceData.protocol == "65285" ||
+        this.deviceData.protocol == "65290" ||
+        this.deviceData.protocol == "65298"
+      ) {
+        //湖南规约
+        console.log("湖南");
+        console.log(val);
+        var hnarr = [];
+        for (var i = 0; i < val.length; i++) {
+          if (i % 3 == 0) {
+            var hnobj = {};
+            hnobj.span = val[i].hour * 60 + val[i].minute;
+            console.log("时间间隔");
+          } else if (i % 3 == 1) {
+            console.log("开始时间");
+            console.log("a");
+            hnobj.startTime = this.$moment(val[i]).format("HH:mm");
+          } else if (i % 3 == 2) {
+            console.log("结束时间");
+            hnobj.endTime = this.$moment(val[i]).format("HH:mm");
+            hnarr.push(hnobj);
+          }
+        }
+        console.log("222222222222222222");
+        console.log(hnarr);
+        console.log("22222222222222222222222");
+        let dayArr = [];
+        //根据开始时间结束时间生产数组
+        for (let k = 0; k < hnarr.length; k++) {
+          console.log(hnarr[k].startTime);
+          console.log(hnarr[k].endTime);
+          console.log(hnarr[k].span);
+          let Stime = this.$moment(hnarr[k].startTime, "HH:mm").format(
+            "YYYY-MM-DD HH:mm:ss"
+          );
+
+          let Etime = this.$moment(hnarr[k].endTime, "HH:mm").format(
+            "YYYY-MM-DD HH:mm:ss"
+          );
+          let spanTime = hnarr[k].span;
+          if (this.$moment(Etime).isBefore(this.$moment(Stime))) {
+            let zeroEnd = this.$moment("23:59", "HH:mm").format(
+              "YYYY-MM-DD HH:mm:ss"
+            );
+            let zeroStart = this.$moment("00:00", "HH:mm").format(
+              "YYYY-MM-DD HH:mm:ss"
+            );
+            while (
+              this.$moment(Stime).isBefore(this.$moment(zeroEnd)) ||
+              this.$moment(Stime).isSame(this.$moment(zeroEnd))
+            ) {
+              dayArr.push(Stime);
+              Stime = this.$moment(Stime)
+                .add(spanTime, "minute")
+                .format("YYYY-MM-DD HH:mm:ss");
+            }
+            while (
+              this.$moment(zeroStart).isBefore(this.$moment(Etime)) ||
+              this.$moment(zeroStart).isSame(this.$moment(Etime))
+            ) {
+              dayArr.push(zeroStart);
+              zeroStart = this.$moment(zeroStart)
+                .add(spanTime, "minute")
+                .format("YYYY-MM-DD HH:mm:ss");
+            }
+          } else {
+            while (
+              this.$moment(Stime).isBefore(this.$moment(Etime)) ||
+              this.$moment(Stime).isSame(this.$moment(Etime))
+            ) {
+              dayArr.push(Stime);
+              Stime = this.$moment(Stime)
+                .add(spanTime, "minute")
+                .format("YYYY-MM-DD HH:mm:ss");
+            }
+          }
+
+          // // 将结束日期的天放进数组
+          console.log(dayArr);
+        }
+        this.deviceTimeList = [...new Set(dayArr)];
+      } else {
+        //其他规约
+        this.deviceTimeList = val;
+      }
+    },
+    closeTimeFun() {
+      this.dialogVisible = false;
+      this.timeList = [];
+      this.deviceTimeList = [];
+    },
+  },
+};
+</script>
+<style lang="less">
+.setTime {
+  .setBox {
+    .head {
+      display: flex;
+      align-items: center;
+      //justify-content: space-around;
+      h3 {
+        margin-bottom: 0px;
+      }
+      .channelDiv {
+        width: 120px;
+        margin-right: 12px;
+      }
+      .el-date-editor {
+        width: 220px;
+      }
+      .timespan {
+        margin-left: 12px;
+      }
+      .showList {
+        margin-left: 12px;
+        width: 90px !important;
+        margin-bottom: 0px !important;
+      }
+      .serachBtn {
+        margin-left: 8px !important;
+        width: 60px !important;
+        margin-bottom: 0px !important;
+      }
+    }
+    .contain {
+      height: 410px;
+      margin-top: 20px;
+      display: flex;
+      ul {
+        display: flex;
+        flex-wrap: wrap;
+        align-content: flex-start; //加这个属性就能解决
+        overflow: auto;
+        height: 410px;
+        width: 60%;
+        li {
+          width: 200px;
+          list-style: none;
+          height: 40px;
+          line-height: 40px;
+          .el-input {
+            width: 80px;
+            margin-left: 12px;
+          }
+        }
+      }
+      .tagsBox {
+        width: 40%;
+        overflow: auto;
+        height: 410px;
+        .el-tag {
+          margin-bottom: 12px;
+          margin-right: 12px;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/realTimeMonitor/components/ptzDevice/index.vue

@@ -0,0 +1,22 @@
+<template>
+  <div class="yuntaiBox">
+    <el-button type="primary" @click="handleSetptz">云台设置 </el-button>
+    <ptzDraw ref="ptzDrawer_ref"></ptzDraw>
+  </div>
+</template>
+<script>
+import ptzDraw from "./ptzDraw.vue";
+export default {
+  components: { ptzDraw },
+  data() {
+    return {};
+  },
+  methods: {
+    handleSetptz() {
+      console.log("设置云台");
+      this.$refs.ptzDrawer_ref.display();
+    },
+  },
+};
+</script>
+<style lang="less"></style>

src/views/realTimeMonitor/components/setAppButton.vue

@@ -0,0 +1,34 @@
+<template>
+  <div class="buttonBox">
+    <el-button type="primary" @click="handleSetChannel">APP设置 </el-button>
+    <setAppDialog ref="setChannelDialog_ref"></setAppDialog>
+  </div>
+</template>
+<script>
+import {} from "@/utils/api/index";
+import setAppDialog from "./setAppDialog.vue";
+export default {
+  components: { setAppDialog },
+  data() {
+    return {};
+  },
+  watch: {},
+  mounted() {},
+  computed: {
+    termId() {
+      return this.$store.state.termId;
+    },
+    channelIdList() {
+      return this.$store.state.channelIdList;
+    },
+  },
+
+  methods: {
+    handleSetChannel() {
+      this.$refs.setChannelDialog_ref.display();
+    },
+  },
+  destroyed() {},
+  beforeRouteLeave(to, from, next) {},
+};
+</script>

src/views/realTimeMonitor/components/setAppDialog.vue

@@ -0,0 +1,711 @@
+<template>
+  <el-dialog
+    class="setAppDialog"
+    title="App设置"
+    :visible.sync="isShow"
+    :close-on-click-modal="false"
+    width="880px"
+    @close="handleclose"
+  >
+    <div class="zzinfo">
+      装置编号：{{ areaData.name }}
+      <el-button type="text" icon="el-icon-refresh" @click="searchBtn"
+        >刷新</el-button
+      >
+    </div>
+    <div class="channelsetBox" v-loading="appsetLoading">
+      <el-form ref="form" :model="appForm" label-width="160px">
+        <el-form-item label="装置编号">
+          <el-input v-model="appForm.CMDID"></el-input>
+        </el-form-item>
+        <el-form-item label="装置通道数">
+          <el-input v-model="appForm.channels"></el-input>
+        </el-form-item>
+        <el-form-item label="装置型号 ">
+          <el-input v-model="appForm.model"></el-input>
+        </el-form-item>
+        <el-form-item label="装置名称">
+          <el-input v-model="appForm.equipName"></el-input>
+        </el-form-item>
+        <el-form-item label="生产厂家">
+          <el-input v-model="appForm.bsManufacturer"></el-input>
+        </el-form-item>
+        <el-form-item label="生产日期">
+          <el-date-picker
+            v-model="appForm.productionDate"
+            value-format="timestamp"
+            type="date"
+            placeholder="选择日期"
+            @focus="handleFocus"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="图像质量">
+          <el-input v-model="appForm.imgQuality"></el-input>
+          <!-- <span class="infoSpan">(0-100的整数)</span> -->
+        </el-form-item>
+        <el-form-item label="心跳周期" class="heartClass">
+          <el-input v-model="appForm.heartbeat"></el-input>
+          <span class="infoSpan">(分)</span>
+        </el-form-item>
+        <el-form-item label="工作状态报周期" class="workClass">
+          <el-input-number
+            :min="1"
+            :max="1024"
+            v-model="appForm.workStatusTimes"
+          ></el-input-number>
+          <span class="infoSpan">(次)[1,1024]</span>
+        </el-form-item>
+        <!-- <el-form-item label="参数设置">
+          <el-checkbox
+            label="报文子包起始号"
+            v-model="appForm.usbchecked"
+          ></el-checkbox>
+        </el-form-item> -->
+
+        <el-form-item label="报文子包起始号">
+          <el-select v-model="appForm.upgradePacketBase" placeholder="请选择">
+            <el-option
+              v-for="item in PacketBaseOptions"
+              :key="item.id"
+              :label="item.value"
+              :value="item.value"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="规约">
+          <el-select v-model="appForm.protocol" placeholder="请选择">
+            <el-option
+              v-for="item in protocolOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="网络协议">
+          <el-radio-group
+            v-model="appForm.networkProtocol"
+            @input="changenetwork"
+          >
+            <el-radio
+              v-for="item in netWorkList"
+              :key="item.value"
+              :label="item.value"
+              :value="item.value"
+            >
+              {{ item.label }}
+            </el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item label="CMA服务器ip">
+          <el-input v-model="appForm.server"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-checkbox
+            label="故障上报"
+            v-model="appForm.reportFault"
+          ></el-checkbox>
+          <el-checkbox
+            label="输出调试信息"
+            v-model="appForm.outputDbgInfo"
+          ></el-checkbox>
+        </el-form-item>
+        <el-form-item label="CMA服务器端口" class="cmaClass">
+          <el-input v-model="appForm.port"></el-input>
+          <span class="infoSpan">(1025-65535)</span>
+        </el-form-item>
+
+        <el-form-item label="图像数据分包大小" class="packetClass">
+          <el-input v-model="appForm.packetSize"></el-input>
+        </el-form-item>
+
+        <el-form-item label="日志保留时间" class="packetClass">
+          <el-input v-model="appForm.timeForKeepingLogs"></el-input>
+          <span class="infoSpan">(天)</span>
+        </el-form-item>
+
+        <el-form-item label="未上传图像的保留时间" class="packetClass">
+          <el-input v-model="appForm.timeForKeepingPhotos"></el-input>
+          <span class="infoSpan">(天)</span>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleclose" :disabled="appsetLoading"
+        >取 消</el-button
+      >
+      <el-button
+        type="primary"
+        :disabled="appsetLoading"
+        @click="handleConfim"
+        :loading="appLoading"
+        >确 定</el-button
+      >
+    </div>
+  </el-dialog>
+</template>
+<script>
+import {
+  getChannelListJoggle,
+  getTermStatus,
+  setTermCamera,
+  getTermCameraRequest,
+} from "@/utils/api/index";
+export default {
+  props: {},
+  data() {
+    return {
+      appsetLoading: true,
+      isShow: false,
+      appLoading: false,
+      netWorkList: [
+        {
+          value: 0,
+          label: "tcp",
+        },
+        {
+          value: 1,
+          label: "udp",
+        },
+      ], //通道选项
+      appForm: {
+        channels: 4, //装置通道数,程序默认值为4
+        packetSize: 2048, //图像数据分包大小
+        timeForKeepingLogs: 15, //效范围：1*86400（含）-45*86400（含）  不设置的默认值为 15*86400
+        timeForKeepingPhotos: 15, //有效范围：1*86400（含）-45*86400（含）   不设置的默认值为 15*86400
+        imgQuality: "", //图像质量
+        heartbeat: 10, //心跳周期
+        upgradePacketBase: 0, //升级报文中，子包起始号 一般可设置的值是 0或者1
+        protocol: "", // 规约（湖南、浙江 ...） 修改后需重启
+        networkProtocol: 1, //  网络协议 0: tcp 1 udp 修改后需重启
+        //network: "", // 使用的网络， 暂时不做配置
+        CMDID: "", // 装置编号  修改后需重启
+        server: "", // CMA 服务器ip  修改后需重启
+        port: "", // CMA服务器端口 1025-65535   修改后需重启
+        model: "", // 装置型号
+        equipName: "", // 装置名称
+        bsManufacturer: "", // 生产厂家
+        productionDate: "", // 生产日期
+        workStatusTimes: 3,
+        reportFault: "", //故障上报
+        outputDbgInfo: "", //输出调试信息
+      },
+      protocolOptions: [
+        {
+          id: 65280,
+          name: "国网I1",
+        },
+        {
+          id: 65296,
+          name: "陕西",
+        },
+        {
+          id: 65281,
+          name: "安徽",
+        },
+        {
+          id: 65282,
+          name: "江苏",
+        },
+        {
+          id: 65283,
+          name: "湖南",
+        },
+        {
+          id: 65284,
+          name: "浙江",
+        },
+        {
+          id: 65285,
+          name: "河南全景",
+        },
+        {
+          id: 65286,
+          name: "河南郑州",
+        },
+        {
+          id: 65298,
+          name: "宁夏",
+        },
+        {
+          id: 2,
+          name: "南网",
+        },
+        {
+          id: 65290,
+          name: "河南统一视频v2020",
+        },
+      ],
+      PacketBaseOptions: [
+        {
+          id: 0,
+          value: 0,
+        },
+        {
+          id: 1,
+          value: 1,
+        },
+      ],
+      requestid: "",
+      searchNum: 0,
+      searchTimer: null,
+      setNum: 0,
+      setTimer: null,
+    };
+  },
+  computed: {
+    areaData() {
+      return this.$store.state.currentData;
+    },
+  },
+  mounted() {
+    // this.appForm.zzbh = this.areaData.cmdid;
+    this.appForm.timeForKeepingPhotos =
+      this.appForm.timeForKeepingPhotos * 86400;
+    this.appForm.timeForKeepingLogs = this.appForm.timeForKeepingLogs * 86400;
+    // this.appForm.aival = this.aiOptions[0].value;
+  },
+  methods: {
+    handleFocus() {
+      if (this.appForm.productionDate == "") {
+        this.appForm.productionDate = new Date();
+      }
+    },
+    changenetwork() {
+      console.log(this.appForm.networkProtocol);
+    },
+    handleConfim() {
+      console.log("点击了确定");
+      console.log(this.appForm);
+
+      this.appLoading = true;
+
+      //--act=cfg --udp=1 --cmdid=XY-ANDROIDSIM-002 --pathType=1 --updateType=0 --path=data/channels/1.json --configs=3 --name1=osd.leftTop --type1=1 --value1="OSD for LeftTop %%CH%%" --name2=osd.rightTop --type2=255 --value2="OSD for rIGHTTop %%CH%%" --name3=usbCamera --type3=0 --value3=1 --clientid=5 --reqid=TS
+      getTermStatus({ termId: this.areaData.id }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          let params = [
+            {
+              name: "act",
+              value: "cfg",
+            },
+            {
+              name: "udp",
+              value: 1,
+            },
+            {
+              name: "reboot",
+              value: 1,
+            },
+            {
+              name: "pathType",
+              value: 1,
+            },
+            {
+              name: "updateType",
+              value: 1,
+            },
+            {
+              name: "path",
+              value: "data/App.json",
+            },
+            {
+              name: "configs",
+              value: 19,
+            },
+            //装置通道数
+            { name: "name1", value: "channels" },
+            { name: "value1", value: this.appForm.channels },
+            { name: "type1", value: 0 },
+            //图像数据分包大小
+            { name: "name2", value: "packetSize" },
+            { name: "value2", value: this.appForm.packetSize },
+            { name: "type2", value: 0 },
+            //日志保留时间，单位秒 程序默认值为15天
+            { name: "name3", value: "timeForKeepingLogs" },
+            { name: "value3", value: this.appForm.timeForKeepingLogs * 86400 },
+            { name: "type3", value: 0 },
+            //未上传图像的保留时间
+            { name: "name4", value: "timeForKeepingPhotos" },
+            {
+              name: "value4",
+              value: this.appForm.timeForKeepingPhotos * 86400,
+            },
+            { name: "type4", value: 0 },
+            //图像质量
+            { name: "name5", value: "imgQuality" },
+            { name: "value5", value: this.appForm.imgQuality },
+            { name: "type5", value: 0 },
+            //规约（湖南、浙江 ...） 修改后需重启
+            { name: "name6", value: "protocol" },
+            { name: "value6", value: this.appForm.protocol },
+            { name: "type6", value: 0 },
+            // 网络协议 0: tcp 1 udp 修改后需重启
+            { name: "name7", value: "networkProtocol" },
+            { name: "value7", value: this.appForm.networkProtocol },
+            { name: "type7", value: 0 },
+            //装置编号  修改后需重启
+            { name: "name8", value: "CMDID" },
+            { name: "value8", value: this.appForm.CMDID },
+            { name: "type8", value: 1 },
+            //CMA 服务器ip  修改后需重启
+            { name: "name9", value: "server" },
+            { name: "value9", value: this.appForm.server },
+            { name: "type9", value: 1 },
+            //CMA服务器端口 1025-65535   修改后需重启
+            { name: "name10", value: "port" },
+            { name: "value10", value: this.appForm.port },
+            { name: "type10", value: 0 },
+            //装置型号
+            { name: "name11", value: "model" },
+            { name: "value11", value: this.appForm.model },
+            { name: "type11", value: 1 },
+            //EquipName 装置名称
+            { name: "name12", value: "equipName" },
+            { name: "value12", value: this.appForm.equipName },
+            { name: "type12", value: 1 },
+            //BsManufacturer 生产厂家
+            { name: "name13", value: "bsManufacturer" },
+            { name: "value13", value: this.appForm.bsManufacturer },
+            { name: "type13", value: 1 },
+            //productionDate 生产日期
+            { name: "name14", value: "productionDate" },
+            {
+              name: "value14",
+              value: Math.round(this.appForm.productionDate / 1000),
+            },
+            { name: "type14", value: 0 },
+            //心跳周期
+            { name: "name15", value: "heartbeat" },
+            { name: "value15", value: this.appForm.heartbeat },
+            { name: "type15", value: 0 },
+            //子包
+            { name: "name16", value: "upgradePacketBase" },
+            { name: "value16", value: this.appForm.upgradePacketBase },
+            { name: "type16", value: 0 },
+            //工作状态报周期
+            { name: "name17", value: "workStatusTimes" },
+            { name: "value17", value: this.appForm.workStatusTimes },
+            { name: "type17", value: 0 },
+            //工作状态报周期
+            { name: "name18", value: "reportFault" },
+            { name: "value18", value: this.appForm.reportFault ? 1 : 0 },
+            { name: "type18", value: 0 },
+            { name: "name19", value: "outputDbgInfo" },
+            { name: "value19", value: this.appForm.outputDbgInfo ? 1 : 0 },
+            { name: "type19", value: 0 },
+          ];
+          this.setTermFn(params);
+        } else {
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+    },
+    setTermFn(val) {
+      setTermCamera({
+        termId: this.areaData.id,
+        list: val,
+      })
+        .then((res) => {
+          console.log(res);
+          this.requestid = res.data.requestId;
+
+          this.getTakechannelStatus();
+          clearInterval(this.setTimer);
+          this.setTimer = window.setInterval(() => {
+            this.getTakechannelStatus();
+            this.setNum++;
+          }, 1000);
+        })
+        .catch((err) => {});
+    },
+    getTakechannelStatus() {
+      getTermCameraRequest({ requestid: this.requestid })
+        .then((res) => {
+          console.log(res);
+          if (res.data.success == 1) {
+            window.clearInterval(this.setTimer);
+            this.setTimer = null;
+            this.setNum = 0;
+            this.isShow = false;
+            this.appLoading = false;
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "设置成功",
+              type: "success",
+            });
+          } else if (this.setNum > 3) {
+            // this.isShow = false;
+            window.clearInterval(this.setTimer);
+            this.setTimer = null;
+            this.setNum = 0;
+            this.appLoading = false;
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "设置失败",
+              type: "error",
+            });
+          }
+        })
+        .catch((err) => {});
+    },
+    searchBtn() {
+      this.appsetLoading = true;
+      //--act=cfg --udp=1 --cmdid=XY-ANDROIDSIM-002 --pathType=1 --updateType=0 --path=data/channels/1.json --configs=3 --name1=osd.leftTop --type1=1 --value1="OSD for LeftTop %%CH%%" --name2=osd.rightTop --type2=255 --value2="OSD for rIGHTTop %%CH%%" --name3=usbCamera --type3=0 --value3=1 --clientid=5 --reqid=TS
+      getTermStatus({ termId: this.areaData.id }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          let params = [
+            {
+              name: "act",
+              value: "cfg",
+            },
+            {
+              name: "udp",
+              value: 1,
+            },
+
+            {
+              name: "pathType",
+              value: 1,
+            },
+            {
+              name: "updateType",
+              value: 0,
+            },
+            {
+              name: "path",
+              value: "data/App.json",
+            },
+          ];
+          console.log(params);
+          this.searchTermFn(params);
+        } else {
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+    },
+    searchTermFn(val) {
+      setTermCamera({
+        termId: this.areaData.id,
+        list: val,
+      })
+        .then((res) => {
+          console.log(res);
+          this.requestid = res.data.requestId;
+          this.getsearchchannelStatus();
+          clearInterval(this.searchTimer);
+          this.searchTimer = window.setInterval(() => {
+            this.getsearchchannelStatus();
+            this.searchNum++;
+          }, 1000);
+        })
+        .catch((err) => {});
+    },
+    getsearchchannelStatus() {
+      getTermCameraRequest({ requestid: this.requestid })
+        .then((res) => {
+          console.log(res);
+          if (res.data.success == 1) {
+            window.clearInterval(this.searchTimer);
+            this.searchTimer = null;
+            this.searchNum = 0;
+            this.appsetLoading = false;
+            console.log(res.data);
+            console.log(JSON.parse(res.data.data));
+            const resultData = JSON.parse(res.data.data);
+            if (resultData.hasOwnProperty("content")) {
+              const resultContent = JSON.parse(
+                decodeURIComponent(escape(window.atob(resultData.content)))
+              );
+              console.log(resultContent);
+
+              this.appForm.channels = resultContent.channels; //装置通道数,程序默认值为4
+              this.appForm.packetSize = resultContent.packetSize; //图像数据分包大小
+              this.appForm.timeForKeepingLogs =
+                resultContent.timeForKeepingLogs !== undefined
+                  ? resultContent.timeForKeepingLogs / 86400
+                  : ""; //效范围：1*86400（含）-45*86400（含）  不设置的默认值为 15*86400
+              this.appForm.timeForKeepingPhotos =
+                resultContent.timeForKeepingPhotos !== undefined
+                  ? resultContent.timeForKeepingPhotos / 86400
+                  : ""; //有效范围：1*86400（含）-45*86400（含）   不设置的默认值为 15*86400
+              this.appForm.imgQuality = resultContent.imgQuality; //图像质量
+              this.appForm.heartbeat = resultContent.heartbeat; //心跳周期
+              this.appForm.upgradePacketBase = resultContent.upgradePacketBase; //升级报文中，子包起始号 一般可设置的值是 0或者1
+              this.appForm.protocol = resultContent.protocol; // 规约（湖南、浙江 ...） 修改后需重启
+              this.appForm.networkProtocol = resultContent.networkProtocol; //  网络协议 0: tcp 1 udp 修改后需重启
+              // this.appForm.network = resultContent.network; // 使用的网络， 暂时不做配置
+              this.appForm.CMDID = resultContent.CMDID; // 装置编号  修改后需重启
+              this.appForm.server = resultContent.server; // CMA 服务器ip  修改后需重启
+              this.appForm.port = resultContent.port; // CMA服务器端口 1025-65535   修改后需重启
+              this.appForm.model = resultContent.model; // 装置型号
+              this.appForm.equipName = resultContent.equipName; // 装置名称
+              this.appForm.bsManufacturer = resultContent.bsManufacturer; // 生产厂家
+              this.appForm.productionDate = resultContent.productionDate * 1000; // 生产日期
+              this.appForm.workStatusTimes = resultContent.workStatusTimes; // 生产日期
+              this.appForm.reportFault =
+                resultContent.reportFault == 1 ? true : false; // 故障上报
+              this.appForm.outputDbgInfo =
+                resultContent.outputDbgInfo == 1 ? true : false; // 输出调试信息
+              console.log(this.appForm.outputDbgInfo);
+              console.log(resultContent.outputDbgInfo);
+            } else {
+              this.appForm.channels = 4; //装置通道数,程序默认值为4
+              this.appForm.packetSize = 2048; //图像数据分包大小
+              this.appForm.timeForKeepingLogs = 15; //效范围：1*86400（含）-45*86400（含）  不设置的默认值为 15*86400
+              this.appForm.timeForKeepingPhotos = 15; //有效范围：1*86400（含）-45*86400（含）   不设置的默认值为 15*86400
+              this.appForm.imgQuality = ""; //图像质量
+              this.appForm.heartbeat = 10; //心跳周期
+              this.appForm.upgradePacketBase = 0; //升级报文中，子包起始号 一般可设置的值是 0或者1
+              this.appForm.protocol = this.areaData.protocol; // 规约（湖南、浙江 ...） 修改后需重启
+              this.appForm.networkProtocol = 0; //  网络协议 0: tcp 1 udp 修改后需重启
+              // this.appForm.network = resultContent.network; // 使用的网络， 暂时不做配置
+              this.appForm.CMDID = this.areaData.cmdid; // 装置编号  修改后需重启
+              this.appForm.server = ""; // CMA 服务器ip  修改后需重启
+              this.appForm.port = ""; // CMA服务器端口 1025-65535   修改后需重启
+              this.appForm.model = ""; // 装置型号
+              this.appForm.equipName = ""; // 装置名称
+              this.appForm.bsManufacturer = ""; // 生产厂家
+              this.appForm.productionDate = ""; // 生产日期
+              this.appForm.productionDate = 3; // 工作状态报周期
+              this.appForm.reportFault = ""; // 故障上报
+              this.appForm.outputDbgInfo = ""; //输出调试信息
+            }
+
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "查询成功",
+              type: "success",
+            });
+          } else if (this.searchNum > 3) {
+            // this.isShow = false;
+            // this.channelLoading = false;
+            window.clearInterval(this.searchTimer);
+            this.searchTimer = null;
+            this.searchNum = 0;
+            this.appsetLoading = false;
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "查询失败",
+              type: "error",
+            });
+          }
+        })
+        .catch((err) => {});
+    },
+    display() {
+      this.isShow = true;
+      this.appForm.CMDID = this.areaData.cmdid;
+      this.searchBtn();
+      console.log(this.areaData);
+    },
+    handleclose() {
+      this.isShow = false;
+      this.bgflag = false;
+      this.appLoading = false;
+      this.appForm.channels = 4; //装置通道数,程序默认值为4
+      this.appForm.packetSize = 2048; //图像数据分包大小
+      this.appForm.timeForKeepingLogs = 15; //效范围：1*86400（含）-45*86400（含）  不设置的默认值为 15*86400
+      this.appForm.timeForKeepingPhotos = 15; //有效范围：1*86400（含）-45*86400（含）   不设置的默认值为 15*86400
+      this.appForm.imgQuality = ""; //图像质量
+      this.appForm.heartbeat = 10; //心跳周期
+      this.appForm.upgradePacketBase = 0; //升级报文中，子包起始号 一般可设置的值是 0或者1
+      this.appForm.protocol = this.areaData.protocol; // 规约（湖南、浙江 ...） 修改后需重启
+      this.appForm.networkProtocol = 0; //  网络协议 0: tcp 1 udp 修改后需重启
+      // this.appForm.network = resultContent.network; // 使用的网络， 暂时不做配置
+      this.appForm.CMDID = this.areaData.cmdid; // 装置编号  修改后需重启
+      this.appForm.server = ""; // CMA 服务器ip  修改后需重启
+      this.appForm.port = ""; // CMA服务器端口 1025-65535   修改后需重启
+      this.appForm.model = ""; // 装置型号
+      this.appForm.equipName = ""; // 装置名称
+      this.appForm.bsManufacturer = ""; // 生产厂家
+      this.appForm.productionDate = ""; // 生产日期
+      this.appForm.productionDate = 3; // 工作状态报周期
+      this.appForm.reportFault = ""; // 故障上报
+      this.appForm.outputDbgInfo = ""; //输出调试信息
+      window.clearInterval(this.searchTimer);
+      this.searchTimer = null;
+      this.searchNum = 0;
+    },
+  },
+};
+</script>
+<style lang="less">
+.setAppDialog {
+  .zzinfo {
+    position: absolute;
+    top: 22px;
+    left: 120px;
+  }
+  .el-form {
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: space-between;
+  }
+  .el-dialog__body {
+    padding-bottom: 0px;
+    .el-form-item--small.el-form-item {
+      margin-bottom: 12px;
+    }
+    .channelsetBox {
+      width: 100%;
+      .el-input {
+        width: 250px;
+      }
+    }
+    .infoSpan {
+      margin-left: 8px;
+    }
+    .heartClass {
+      .el-input {
+        width: 190px;
+      }
+    }
+    .workClass {
+      .el-input {
+        width: 100%;
+      }
+      span {
+      }
+    }
+    .cmaClass {
+      .el-input {
+        width: 180px;
+      }
+    }
+    .packetClass {
+      .el-input {
+        width: 200px;
+      }
+    }
+  }
+  .dialog-footer {
+    .el-button--default,
+    .el-button--primary {
+      width: 80px !important;
+      margin-bottom: 0px !important;
+    }
+    .el-button + .el-button {
+      margin-left: 10px !important;
+    }
+  }
+}
+</style>

src/views/realTimeMonitor/components/setChannel/setChannelButton.vue

@@ -0,0 +1,34 @@
+<template>
+  <div class="buttonBox">
+    <el-button type="primary" @click="handleSetChannel">通道设置 </el-button>
+    <setChannelDialog ref="setChannelDialog_ref"></setChannelDialog>
+  </div>
+</template>
+<script>
+import {} from "@/utils/api/index";
+import setChannelDialog from "./setChannelDialog.vue";
+export default {
+  components: { setChannelDialog },
+  data() {
+    return {};
+  },
+  watch: {},
+  mounted() {},
+  computed: {
+    termId() {
+      return this.$store.state.termId;
+    },
+    channelIdList() {
+      return this.$store.state.channelIdList;
+    },
+  },
+
+  methods: {
+    handleSetChannel() {
+      this.$refs.setChannelDialog_ref.display();
+    },
+  },
+  destroyed() {},
+  beforeRouteLeave(to, from, next) {},
+};
+</script>

src/views/realTimeMonitor/components/setschedule.vue

@@ -7,7 +7,7 @@
     width="1000px"
     @close="handleclose"
   >
-    <div class="zzinfo">装置编号：{{ areaData.cmdid }}</div>
+    <div class="zzinfo">装置编号：{{ areaData.name }}</div>
     <el-tabs v-model="activeName" type="border-card" @tab-click="handleClick">
       <el-tab-pane label="拍照时间表查询" name="1">
         <div class="searchTime">
@@ -35,10 +35,19 @@
                 }}
               </el-option>
             </el-select>
+
+            <el-button class="clearButton" type="primary" @click="clearTimeGrop"
+              >清除拍照时间表</el-button
+            >
           </div>
           <div class="timeContain">
             <div class="timeLeft" v-loading="baseTimeLoading">
-              <h3>时间表({{ baseTimeList.length }})</h3>
+              <h3>
+                时间表({{ baseTimeList.length }})
+                <span v-if="baseTimeList.length !== 0 && offsetNumTime !== null"
+                  >偏移量（{{ offsetNumTime }}分钟）</span
+                >
+              </h3>
               <div class="tagsBox" v-if="baseTimeList.length !== 0">
                 <el-tag v-for="(item, index) in baseTimeList" :key="index"
                   >{{ $moment(item).format("HH:mm") }}
@@ -51,22 +60,22 @@
             <div class="timeRight" v-loading="deviceTimeLoading">
               <h3>
                 装置时间表({{ deviceTimeList.length }})
-                <span
-                  v-if="deviceTimeList.length !== 0 && offsetNumTime !== null"
-                  >偏移量（{{ offsetNumTime }}分钟）</span
+                <span v-if="deviceTimeList.length !== 0"
+                  ><el-button type="text" size="mini" @click="deviceTimeClick"
+                    ><i class="el-icon-refresh"></i>刷新装置时间表</el-button
+                  ></span
+                >
+                <el-button v-else type="primary" @click="deviceTimeClick"
+                  >装置时间表</el-button
                 >
               </h3>
               <div class="tagsBox" v-if="deviceTimeList.length !== 0">
-                <el-tag v-for="(item, index) in deviceTimeList" :key="index">{{
-                  $moment(item).format("HH:mm")
-                }}</el-tag>
+                <el-tag v-for="(item, index) in deviceTimeList" :key="index"
+                  >{{ $moment(item).format("HH:mm") }}+{{ item.preset }}</el-tag
+                >
               </div>
               <div class="nodata" v-else>
-                <el-empty description="暂无数据">
-                  <el-button type="primary" @click="deviceTimeClick"
-                    >装置时间表</el-button
-                  >
-                </el-empty>
+                <el-empty description="暂无数据"> </el-empty>
               </div>
             </div>
           </div>
@@ -189,8 +198,9 @@
                 <el-input-number
                   v-model="setNum"
                   :min="0"
-                  :max="9"
+                  :max="minTimeSpan"
                 ></el-input-number>
+                {{ minTimeSpan }}
               </div>
             </div>
             <div class="ruleinfo">
@@ -211,6 +221,7 @@
                 </el-radio-group>
               </div>
             </div>
+            <p class="fail" v-show="failedFlag">时间表下发失败,请重新下发！</p>
           </div>
           <div slot="footer" class="dialog-footer">
             <el-button @click="closebtn">取 消</el-button>
@@ -232,6 +243,7 @@ import {
   setTermCamera,
   getTermCameraRequest,
   getTermStatus,
+  setScheduleRulel,
 } from "@/utils/api/index";
 export default {
   props: {
@@ -251,6 +263,7 @@ export default {
       deviceTimer: null, //装置循环获取
       deviceNum: 1, //循环次数
       offsetTime: 0, //偏移量
+      minTimeSpan: "",
       page: 1, // 当前页数
       pageSize: 20, // 每页数量
       total: 0, //总条数
@@ -265,6 +278,7 @@ export default {
       sureloading: false, //点击确定loading
 
       offsetNumTime: null,
+      failedFlag: false,
     };
   },
   computed: {
@@ -276,20 +290,40 @@ export default {
   methods: {
     handleClick(tab, event) {
       console.log(tab, event);
+      if (tab.name == 1) {
+        this.selectChannel = 1;
+        this.getDataBaseTime(this.areaData.id, this.selectChannel);
+      }
       //下发的时候执行获取列表
       if (tab.name == 2) {
         this.deviceTimeList = [];
         this.getruleList();
       }
+      this.deviceTimeLoading = false;
+      window.clearInterval(this.deviceTimer);
+      this.deviceTimer = null;
+      this.deviceNum = 1;
     },
     //获取通道
     getChannelSelect() {
       getChannelListJoggle({ termid: this.areaData.id })
         .then((res) => {
+          console.log("wwww", Number(localStorage.getItem("channelId")));
           this.channelList = res.data.list;
           this.timeChannelList = res.data.list;
-          this.timeChannel = this.channelList[0].channelid;
-          this.selectChannel = this.channelList[0].channelid;
+          if (
+            Number(localStorage.getItem("channelId")) == 1 ||
+            Number(localStorage.getItem("channelId")) == -1 ||
+            Number(localStorage.getItem("channelId")) == 0
+          ) {
+            this.timeChannel = this.channelList[0].channelid;
+            this.selectChannel = this.channelList[0].channelid;
+          } else {
+            this.timeChannel = Number(localStorage.getItem("channelId"));
+            this.selectChannel = Number(localStorage.getItem("channelId"));
+          }
+          // this.timeChannel = this.channelList[0].channelid;
+          // this.selectChannel = this.channelList[0].channelid;
           console.log(this.channelList);
           this.changeChannel();
         })
@@ -314,7 +348,9 @@ export default {
           this.offsetNumTime = res.data.offset;
           if (
             this.areaData.protocol == "65283" ||
-            this.areaData.protocol == "65285"
+            this.areaData.protocol == "65285" ||
+            this.areaData.protocol == "65290" ||
+            this.areaData.protocol == "65298"
           ) {
             //湖南规约
             console.log("湖南");
@@ -344,24 +380,27 @@ export default {
               console.log(hnarr[k].startTime);
               console.log(hnarr[k].endTime);
               console.log(hnarr[k].span);
-              let Stime = this.$moment(hnarr[k].startTime, "HH:mm").format(
-                "YYYY-MM-DD HH:mm:ss"
-              );
+              if (hnarr[k].span !== 0) {
+                let Stime = this.$moment(hnarr[k].startTime, "HH:mm").format(
+                  "YYYY-MM-DD HH:mm:ss"
+                );
 
-              let Etime = this.$moment(hnarr[k].endTime, "HH:mm").format(
-                "YYYY-MM-DD HH:mm:ss"
-              );
-              let spanTime = hnarr[k].span;
+                let Etime = this.$moment(hnarr[k].endTime, "HH:mm").format(
+                  "YYYY-MM-DD HH:mm:ss"
+                );
+                let spanTime = hnarr[k].span;
 
-              while (
-                this.$moment(Stime).isBefore(this.$moment(Etime)) ||
-                this.$moment(Stime).isSame(this.$moment(Etime))
-              ) {
-                dayArr.push(Stime);
-                Stime = this.$moment(Stime)
-                  .add(spanTime, "minute")
-                  .format("YYYY-MM-DD HH:mm:ss");
+                while (
+                  this.$moment(Stime).isBefore(this.$moment(Etime)) ||
+                  this.$moment(Stime).isSame(this.$moment(Etime))
+                ) {
+                  dayArr.push(Stime);
+                  Stime = this.$moment(Stime)
+                    .add(spanTime, "minute")
+                    .format("YYYY-MM-DD HH:mm:ss");
+                }
               }
+
               // // 将结束日期的天放进数组
               console.log(dayArr);
             }
@@ -384,6 +423,10 @@ export default {
             name: "act",
             value: "schedule",
           },
+          {
+            name: "udp",
+            value: 1,
+          },
           {
             name: "flag",
             value: 0,
@@ -514,7 +557,9 @@ export default {
       console.log(this.areaData.protocol);
       if (
         this.areaData.protocol == "65283" ||
-        this.areaData.protocol == "65285"
+        this.areaData.protocol == "65285" ||
+        this.areaData.protocol == "65290" ||
+        this.areaData.protocol == "65298"
       ) {
         //湖南规约
         console.log("湖南");
@@ -601,6 +646,9 @@ export default {
     //设置下发时间表规则
     handleSet(val) {
       console.log(val);
+      this.minTimeSpan = Math.min(...val.listTime.map((item) => item.timeSpan));
+      console.log(this.minTimeSpan);
+      this.minTimeSpan = this.minTimeSpan > 10 ? 10 : this.minTimeSpan - 1;
       this.isShowset = true;
       this.currentTimeRule = val;
       getScheduleRulelAccessList({ termid: this.areaData.id })
@@ -624,6 +672,8 @@ export default {
     //xympadmn --act=schedule [0xCA] --flag=[Request Set Flag, default is set=1, 0: request] --channel=[Channel No] --group=[Group] --hour1=[Hour 1] --min1=[Minute 1] --preset1=[Preset 1]
     submitForm() {
       console.log(this.currentTimeRule);
+      this.failedFlag = false;
+      let timeArrList = [];
       if (
         this.areaData.protocol == "65285" &&
         this.currentTimeRule.listTime.length > 1
@@ -646,6 +696,10 @@ export default {
               name: "act",
               value: "schedule",
             },
+            {
+              name: "udp",
+              value: 1,
+            },
             {
               name: "flag",
               value: 1,
@@ -665,14 +719,21 @@ export default {
               .add(this.setNum, "minute")
               .format("YYYY-MM-DD HH:mm:ss");
 
-            var Etime = this.$moment(scheduleTimeList[i].endTime, "HH:mm")
-              .add(this.setNum, "minute")
-              .format("YYYY-MM-DD HH:mm:ss");
+            // var Etime = this.$moment(scheduleTimeList[i].endTime, "HH:mm")
+            //   .add(this.setNum, "minute")
+            //   .format("YYYY-MM-DD HH:mm:ss");
+            //结束时间不添加偏移量
+            var Etime = this.$moment(
+              scheduleTimeList[i].endTime,
+              "HH:mm"
+            ).format("YYYY-MM-DD HH:mm:ss");
             var spanTime = scheduleTimeList[i].timeSpan;
             console.log(Stime, Etime, spanTime);
             if (
               this.areaData.protocol == "65283" ||
-              this.areaData.protocol == "65285"
+              this.areaData.protocol == "65285" ||
+              this.areaData.protocol == "65290" ||
+              this.areaData.protocol == "65298"
             ) {
               //湖南
               console.log("湖南", scheduleTimeList.length);
@@ -685,8 +746,6 @@ export default {
               timeArr.push(fistSpan, Stime, Etime);
               console.log(timeArr);
             } else {
-              //其他规约
-
               while (
                 this.$moment(Stime).isBefore(this.$moment(Etime)) ||
                 this.$moment(Stime).isSame(this.$moment(Etime))
@@ -721,6 +780,23 @@ export default {
             );
           }
           console.log(params);
+          for (var k = 0; k < timeArr.length; k++) {
+            //console.log(moment(dayArr[k]).hour());
+            timeArrList.push({
+              hour: this.$moment(timeArr[k]).hour(),
+              minute: this.$moment(timeArr[k]).minute(),
+              preset: 255,
+            });
+          }
+          console.log(timeArrList);
+          var parmsobj = {
+            termid: this.areaData.id,
+            channelid: this.timeChannel,
+            offset: this.setNum,
+            list: timeArrList,
+          };
+          console.log(parmsobj);
+          //this.setTimeRuleJava(parmsobj); //使用java接口调用下发时间表
           this.setTermFnRule(params);
         } else {
           this.sureloading = false;
@@ -733,6 +809,37 @@ export default {
         }
       });
     },
+    //使用接口下发时间表会写进数据库
+    setTimeRuleJava(parmsobj) {
+      console.log(parmsobj);
+      setScheduleRulel({
+        scheduleid: this.currentTimeRule.id,
+        list: [parmsobj],
+      })
+        .then((res) => {
+          console.log(res);
+          if (res.data.list.length !== 0) {
+            this.requestid = res.data.list[0].requestid;
+            console.log(this.requestid);
+            clearInterval(this.timer);
+            this.deviceTimer = window.setInterval(() => {
+              this.getinfoRules();
+              this.deviceNum++;
+              console.log(this.deviceNum, this.deviceNum * 1000);
+            }, 1000 * this.deviceNum);
+          } else {
+            console.log("未获取到requestid");
+          }
+        })
+        .catch((err) => {
+          // this.$message({
+          //   duration: 1500,
+          //   showClose: true,
+          //   message: "添加失败",
+          //   type: "error",
+          // });
+        });
+    },
     //下发时间表
     setTermFnRule(dataParams) {
       setTermCamera({
@@ -772,6 +879,7 @@ export default {
             window.clearInterval(this.deviceTimer);
             this.deviceTimer = null;
             this.deviceNum = 1;
+            this.failedFlag = true;
             this.$message({
               duration: 1500,
               showClose: true,
@@ -782,6 +890,54 @@ export default {
         })
         .catch((err) => {});
     },
+    //清除时间表
+    clearTimeGrop() {
+      console.log("通道", this.selectChannel);
+      getTermStatus({ termId: this.areaData.id }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          let params = [
+            {
+              name: "act",
+              value: "schedule",
+            },
+            {
+              name: "udp",
+              value: 1,
+            },
+            {
+              name: "flag",
+              value: 1,
+            },
+            {
+              name: "channel",
+              value: this.selectChannel,
+            },
+            {
+              name: "group",
+              value: 0,
+            },
+          ];
+          console.log(params);
+          this.$confirm("确定要删除拍照时间表吗?", "提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning",
+          })
+            .then(() => {
+              this.setTermFnRule(params);
+            })
+            .catch(() => {});
+        } else {
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+    },
     //关闭下发弹窗
     closebtn() {
       this.isShowset = false;
@@ -796,6 +952,7 @@ export default {
     handleclose() {
       this.isShow = false;
       this.sureloading = false;
+      this.deviceTimeLoading = false;
       this.activeName = "1"; //选项卡
       this.selectChannel = ""; //选中的通道
       this.channelList = []; //通道选项
@@ -804,14 +961,17 @@ export default {
       window.clearInterval(this.deviceTimer);
       this.deviceTimer = null;
       this.deviceNum = 1;
+      this.failedFlag = false;
     },
     //点击分页
     handleCurrentChange(val) {
       this.page = val;
+      this.getruleList();
     },
     //每页条数
     handleSizeChange(val) {
       this.pageSize = val;
+      this.getruleList();
     },
   },
 };
@@ -830,6 +990,11 @@ export default {
       .searchTime {
         .channelBox {
           margin-bottom: 12px;
+          display: flex;
+          align-items: center;
+          .clearButton {
+            margin-left: auto;
+          }
         }
         .timeContain {
           display: flex;
@@ -847,6 +1012,18 @@ export default {
             border-radius: 4px;
             border: 1px solid #eee;
             padding: 12px;
+            h3 {
+              .el-button {
+                margin-left: 14px;
+              }
+            }
+          }
+          .timeLeft,
+          .timeRight {
+            h3 {
+              line-height: 24px;
+              height: 24px;
+            }
           }
           .tagsBox {
             height: 308px;
@@ -907,6 +1084,11 @@ export default {
         }
       }
     }
+    .fail {
+      color: red;
+      line-height: 28px;
+      font-size: 12px;
+    }
   }
 }
 </style>

src/views/realTimeMonitor/components/siderBar.vue

@@ -5,6 +5,7 @@
         placeholder="输入关键字进行过滤"
         v-model="filterText"
         prefix-icon="el-icon-search"
+        clearable
       >
       </el-input>
     </div>
@@ -36,47 +37,75 @@
       :data="lineTreeData"
       :props="defaultProps"
       node-key="id"
-      default-expand-all
+      :default-expanded-keys="defaultExpandIds"
       highlight-current
       :expand-on-click-node="false"
       :filter-node-method="filterNode"
       :current-node-key="currentNodekey"
       @node-click="handleNodeClick"
+      @node-expand="handleNodeExpand"
+      @node-collapse="handleNodeCollapse"
     >
       <span class="custom-tree-node" slot-scope="{ node, data }">
-        <span v-if="node.level === 1">
-          <span class="iconfont icon-dianli" style="margin-right: 6px"></span>
-          <span>{{ node.label }} </span>
-        </span>
-        <span v-else-if="node.level === 2">
-          <span class="iconfont icon-dianlihangye" style="margin-right: 6px">
+        <!-- v-if="node.name === '收藏夹'" -->
+        <span>
+          <span>
+            <span
+              v-if="node.label === '收藏夹'"
+              class="el-icon-collection"
+              style="margin-right: 6px"
+            ></span>
+            <span
+              v-if="node.level === 1 && node.label !== '收藏夹'"
+              class="iconfont icon-dianli"
+              style="margin-right: 6px"
+            ></span>
+            <span
+              v-if="node.level === 2 && data.bsManufacturer"
+              class="iconfont icon-dianlihangye"
+              style="margin-right: 6px"
+            >
+            </span>
+            <span
+              v-if="
+                node.label !== '收藏夹' && !data.bsManufacturer && !data.dyValue
+              "
+            >
+              <span
+                class="iconfont icon-shexiangtoulixian"
+                v-if="data.onlinestatus == 0"
+                :class="data.onlinestatus == 0 ? 'disconnect' : ''"
+                style="margin-right: 6px"
+              ></span>
+              <span
+                class="iconfont icon-shexiangtou-lixian"
+                v-else
+                :class="data.onlinestatus == 0 ? 'disconnect' : ''"
+                style="margin-right: 6px"
+              ></span>
+            </span>
+            <span :class="data.onlinestatus == 0 ? 'disconnect' : ''"
+              >{{ node.label }}
+
+              <span
+                class="num"
+                v-if="node.level === 2 && data.bsManufacturer && zzradio == -1"
+                >({{ data.onlinenum }} / {{ data.totalnum }})
+              </span>
+              <span
+                class="num"
+                v-else-if="node.level === 2 && data.bsManufacturer"
+                >({{ data.list.length }})
+              </span>
+            </span>
           </span>
-          <span>{{ node.label }} </span>
-        </span>
-        <span v-else>
-          <span
-            class="iconfont icon-shexiangtoulixian"
-            v-if="data.onlinestatus == 0"
-            :class="data.onlinestatus == 0 ? 'disconnect' : ''"
-            style="margin-right: 6px"
-          ></span>
-          <span
-            class="iconfont icon-shexiangtou-lixian"
-            v-else
-            :class="data.onlinestatus == 0 ? 'disconnect' : ''"
-            style="margin-right: 6px"
-          ></span>
-          <span
-            :id="data.id"
-            :class="data.onlinestatus == 0 ? 'disconnect' : ''"
-            >{{ node.label }}</span
-          >
         </span>
       </span>
     </el-tree>
   </div>
 </template>
 <script>
+import EventBus from "@/utils/event-bus";
 import { getdyTreeListJoggle } from "@/utils/api/index";
 export default {
   data() {
@@ -86,6 +115,8 @@ export default {
       totalNum: "", //装置总数
       zzradio: -1, //装置是否在线选择
       lineTreeData: [],
+      defaultExpandIds: [], //默认展开
+
       defaultProps: {
         //指定参数格式回显数据
         children: "list",
@@ -93,14 +124,20 @@ export default {
       },
       currentData: {}, //当前选中的数据
       currentNodekey: "", //默认选中的节点树,
+      role: "",
+      treeStatustimer: null,
+      isfavorList: [],
     };
   },
   components: {},
   watch: {
-    filterText(val) {
-      console.log(val);
-      this.$refs.tree.filter(val);
-      console.log(this.$refs.tree);
+    // filterText(val) {
+    //   console.log(val);
+    //   this.$refs.tree.filter(val);
+    //   console.log(this.$refs.tree);
+    // },
+    filterText(newVal) {
+      this.handleFilter(); // 当 filterText 发生变化时执行过滤操作
     },
   },
   mounted() {},
@@ -109,29 +146,67 @@ export default {
       JSON.parse(localStorage.getItem("radio")) !== null
         ? JSON.parse(localStorage.getItem("radio"))
         : -1; //获取保存的radio
+    this.role = localStorage.getItem("role");
+    console.log("用户管理");
+    console.log(this.role);
     this.getRadio(); //获取列表在线离线全部
     this.getLineTreeList(); //获取树状图
+    this.treeStatustimer = setInterval(this.getLineTreeStatus, 60000); // 每60秒刷新数据
+    this.$route.meta.intervalId = this.treeStatustimer;
+    console.log(this.$route.meta.intervalId, "aaaaaaaaaaaaaaaaa");
+    EventBus.$on("treelist", this.getLineTreeStatus);
   },
   methods: {
     //获取当前选中的radio
     getRadio() {
       console.log(this.zzradio);
-      this.filterText = "";
+      //this.filterText = "";
       localStorage.setItem("radio", JSON.stringify(this.zzradio));
       this.getLineTreeStatus();
     },
     //刷新tree列表
     getLineTreeStatus() {
       console.log("点击了刷新");
+
       if (this.filterText !== "") {
-        this.$refs.tree.filter(this.filterText);
+        getdyTreeListJoggle({ type: this.zzradio })
+          .then((res) => {
+            console.log(res);
+            this.lineTreeData = res.data.list;
+            this.isfavorList = res.data.favorlist;
+            this.lineTreeData.unshift({
+              id: 0,
+              name: "收藏夹",
+              bsManufacturer: "收藏夹",
+              list: this.isfavorList,
+            });
+            this.onlineNum = res.data.onlineNum;
+            this.totalNum = res.data.totalNum;
+            this.currentData = JSON.parse(localStorage.getItem("currentData"));
+
+            this.$nextTick(() => {
+              this.$refs.tree.setCurrentKey(this.currentData.id); //一定要加这个选中了否则样式没有出来
+              this.$refs.tree.filter(this.filterText);
+            });
+          })
+          .catch((err) => {
+            console.log(err); //代码错误、请求失败捕获
+          });
       } else {
         getdyTreeListJoggle({ type: this.zzradio })
           .then((res) => {
             console.log(res);
             this.lineTreeData = res.data.list;
+            this.isfavorList = res.data.favorlist;
+            this.lineTreeData.unshift({
+              id: 0,
+              name: "收藏夹",
+              bsManufacturer: "收藏夹",
+              list: this.isfavorList,
+            });
             this.onlineNum = res.data.onlineNum;
             this.totalNum = res.data.totalNum;
+            this.currentData = JSON.parse(localStorage.getItem("currentData"));
 
             this.$nextTick(() => {
               this.$refs.tree.setCurrentKey(this.currentData.id); //一定要加这个选中了否则样式没有出来
@@ -142,46 +217,60 @@ export default {
           });
       }
     },
+    handleFilter() {
+      // 在输入框输入完成后的500毫秒执行过滤节点方法
+      setTimeout(() => {
+        this.$refs.tree.filter(this.filterText);
+      }, 500);
+    },
     //树状图搜索
     filterNode(value, data, node) {
-      //console.log(value, data, node);
-      this.filterText = value;
-      console.log(this.filterText);
       // 如果什么都没填全部匹配全部返回
       if (!value) return true;
       this.searchName = data.name + data.cmdid;
       //console.log(this.searchName);
       // 如果传入的value和data中的label相同，匹配成功
+
       if (this.searchName.indexOf(value) !== -1) {
         return true;
       }
+      let nowval = data[this.defaultProps.label].toUpperCase();
+      return nowval.indexOf(value.toUpperCase()) !== -1;
     },
     //获取树状图列表
     getLineTreeList() {
       console.log(this.zzradio);
       getdyTreeListJoggle({ type: this.zzradio })
         .then((res) => {
-          console.log(res);
           this.lineTreeData = res.data.list;
-          console.log(this.lineTreeData);
+          this.isfavorList = res.data.favorlist;
+          this.lineTreeData.unshift({
+            id: 0,
+            name: "收藏夹",
+            bsManufacturer: "收藏夹",
+            list: this.isfavorList,
+          });
           this.onlineNum = res.data.onlineNum;
           this.totalNum = res.data.totalNum;
           this.currentData = JSON.parse(localStorage.getItem("currentData"));
-          if (this.lineTreeData[0].list[0].list.length > 0) {
-          }
+
+          // if (this.lineTreeData[0].list[0].list.length > 0) {
+          // }
           if (
             this.currentData !== null &&
             Object.keys(this.currentData).length !== 0
           ) {
-            console.log("aaaa");
             this.currentNodekey = this.currentData.id;
             this.handleNodeClick(this.currentData);
           } else {
-            console.log("aaaa");
-            this.currentData = this.lineTreeData[0]; //第一个选中的数据
-            this.currentNodekey = this.lineTreeData[0].id; //第一个数据
+            this.currentData = this.lineTreeData[1]; //第一个选中的数据
+            this.currentNodekey = this.lineTreeData[1].id; //第一个数据
             this.handleNodeClick(this.currentData);
           }
+          this.defaultExpandIds =
+            JSON.parse(localStorage.getItem("defultkeys")) !== null
+              ? JSON.parse(localStorage.getItem("defultkeys"))
+              : []; //获取保存的defaultKey ;
           this.$nextTick(() => {
             this.$refs.tree.setCurrentKey(this.currentNodekey); //一定要加这个选中了否则样式没有出来
             this.scrollView();
@@ -191,12 +280,74 @@ export default {
           console.log(err); //代码错误、请求失败捕获
         });
     },
+    // 树节点展开
+    handleNodeExpand(data) {
+      // 保存当前展开的节点
+      let flag = false;
+      this.defaultExpandIds.some((item) => {
+        if (item === data.id) {
+          // 判断当前节点是否存在， 存在不做处理
+          flag = true;
+          return true;
+        }
+      });
+      if (!flag) {
+        // 不存在则存到数组里
+        this.defaultExpandIds.push(data.id);
+        localStorage.setItem(
+          "defultkeys",
+          JSON.stringify(this.defaultExpandIds)
+        );
+      }
+    },
+    // 树节点关闭
+    handleNodeCollapse(data) {
+      // 删除当前关闭的节点
+      this.defaultExpandIds.some((item, i) => {
+        if (item === data.id) {
+          this.defaultExpandIds.splice(i, 1);
+          localStorage.setItem(
+            "defultkeys",
+            JSON.stringify(this.defaultExpandIds)
+          );
+        }
+      });
+      this.removeChildrenIds(data); // 这里主要针对多级树状结构，当关闭父节点时，递归删除父节点下的所有子节点
+    },
+    // 删除树子节点
+    removeChildrenIds(data) {
+      console.log("我还有子节点");
+      const ts = this;
+      console.log(data);
+      if (data.list) {
+        console.log(data.list);
+        data.list.forEach(function (item) {
+          const index = ts.defaultExpandIds.indexOf(item.id);
+          if (index > 0) {
+            ts.defaultExpandIds.splice(index, 1);
+          }
+          ts.removeChildrenIds(item);
+          console.log(ts.defaultExpandIds);
+        });
+        localStorage.setItem(
+          "defultkeys",
+          JSON.stringify(this.defaultExpandIds)
+        );
+      }
+    },
 
     //点击当前选中的treenode
     handleNodeClick(data) {
-      console.log(data);
+      if (data.name == "收藏夹") {
+        return;
+      }
+      if (data.isfavor == 0 || data.isfavor == null) {
+        this.collectFlag = false;
+      } else {
+        this.collectFlag = true;
+      }
       this.currentData = data;
-      this.scrollView();
+      //this.scrollView();
       this.$store.commit("currentData", this.currentData); //将currentData保存在vuex中
       this.$store.commit("termId", this.currentData.id); //将currentData保存在vuex中
       this.$store.commit("protocol", this.currentData.protocol); //将currentData保存在vuex中
@@ -206,6 +357,7 @@ export default {
       //this.$refs.tree.scrollTo(data);
       // localStorage.setItem("currentData", JSON.stringify(this.currentData));
     },
+
     scrollView() {
       if (this.currentData) {
         this.$nextTick(() => {
@@ -219,14 +371,39 @@ export default {
       }
     },
   },
+  beforeRouteLeave(to, from, next) {
+    if (to.name !== "realTimeMonitor") {
+      // 在离开当前路由时清除轮询
+      console.log("清除轮巡saaaaaaaaaaaaaaaaaaaaa");
+      clearInterval(this.treeStatustimer);
+      this.treeStatustimer = null;
+    }
+    next();
+  },
+  deactivated() {
+    console.log("清除轮巡");
+    console.log("deactivated", this.treeStatustimer);
+    //清除定时器
+    clearInterval(this.treeStatustimer);
+    this.treeStatustimer = null;
+  },
+  beforeDestroy() {
+    console.log("清除轮巡");
+    console.log(this.treeStatustimer);
+    //清除定时器
+    clearInterval(this.treeStatustimer);
+    this.treeStatustimer = null;
+  },
 };
 </script>
 <style lang="less">
 .realsideBar {
-  width: 300px;
+  width: 312px;
   display: flex;
   flex-direction: column;
   padding: 16px 0px;
+  height: calc(100% - 70px);
+
   .searchBar {
     width: 94%;
     margin: 0 auto;
@@ -282,6 +459,10 @@ export default {
         display: flex;
         display: inline-table;
         overflow: hidden;
+        align-items: center;
+      }
+      .num {
+        color: #169e8c;
       }
     }
   }
@@ -298,6 +479,10 @@ export default {
       span {
         display: flex;
         //overflow: hidden;
+        align-items: center;
+        .num {
+          color: #fff;
+        }
         .iconfont {
           //width: 30px;
           display: inline-table;

src/views/realTimeMonitor/components/takePicButton.vue

@@ -6,7 +6,11 @@
     <el-button type="primary" :loading="picLoading">
       主动拍照<i class="el-icon-arrow-down el-icon--right"></i>
     </el-button>
-    <el-dropdown-menu slot="dropdown" class="picdropStyle">
+    <el-dropdown-menu
+      slot="dropdown"
+      class="picdropStyle"
+      :append-to-body="false"
+    >
       <el-dropdown-item
         :command="item.channelid"
         v-for="(item, index) in channelIdList"
@@ -40,13 +44,23 @@ export default {
   },
   watch: {
     termId: {
-      handler(newVal, oldVal) {},
+      handler(newVal, oldVal) {
+        console.log("我改变了");
+        clearInterval(this.statusTimer);
+        this.statusTimer = null;
+        this.statusNum = 0;
+        clearInterval(this.picPimer);
+        this.picPimer = null;
+        this.picNum = 0;
+        this.picLoading = false;
+      },
       deep: true,
       immediate: true,
     },
   },
   mounted() {
     console.log(this.channelIdList);
+    console.log("我是主动拍照");
   },
   computed: {
     termId() {
@@ -71,6 +85,10 @@ export default {
               name: "act",
               value: "capture",
             },
+            {
+              name: "udp",
+              value: 1,
+            },
             {
               name: "channel",
               value: command,
@@ -101,6 +119,7 @@ export default {
     setTermFn(val) {
       setTermCamera({
         termId: this.termId,
+        channelId: this.pzchannelId,
         list: val,
       })
         .then((res) => {
@@ -111,7 +130,7 @@ export default {
           this.statusTimer = window.setInterval(() => {
             this.getTakePicStatus(res.data);
             this.statusNum++;
-          }, 3000);
+          }, 5000);
         })
         .catch((err) => {});
     },
@@ -126,7 +145,55 @@ export default {
         .then((res) => {
           console.log(res);
           //res.data  0 状态未知  1 成功 2失败
-          if (res.data.cmaStatus != 1 && this.statusNum >= 5) {
+          // if (
+          //   res.data.cmaStatus == 0 &&
+          //   res.data.picStatus == false &&
+          //   this.statusNum >= 5
+          // ) {
+          //   //全部没有返回，失败
+          //   this.clearFn();
+          //   this.$message({
+          //     duration: 1500,
+          //     showClose: true,
+          //     message: "指令图片都没有返回true，并且轮巡大于五次！",
+          //     type: "warning",
+          //   });
+          // } else if (res.data.cmaStatus == 1) {
+          //   this.clearFn();
+          //   this.$message({
+          //     duration: 1500,
+          //     showClose: true,
+          //     message: "拍照指令cmaStatus下发成功返回1！",
+          //     type: "success",
+          //   });
+          //   clearInterval(this.picPimer);
+          //   this.picPimer = null;
+          //   this.picPimer = window.setInterval(() => {
+          //     this.newPicApi(val);
+          //     this.picNum++;
+          //   }, 8000);
+          //   return;
+          // } else if (res.data.picStatus == true) {
+          //   this.clearFn();
+          //   this.$message({
+          //     duration: 1500,
+          //     showClose: true,
+          //     message: "指令下发失败，图片已经返回！",
+          //     type: "success",
+          //   });
+          //   clearInterval(this.picPimer);
+          //   this.picPimer = null;
+          //   this.picPimer = window.setInterval(() => {
+          //     this.newPicApi(val);
+          //     this.picNum++;
+          //   }, 2000);
+          //   return;
+          // }
+          if (
+            res.data.cmaStatus != 1 &&
+            res.data.picStatus == false &&
+            this.statusNum >= 5
+          ) {
             this.clearFn();
             this.$message({
               duration: 1500,
@@ -134,7 +201,11 @@ export default {
               message: "下发指令超时，请重试！",
               type: "warning",
             });
-          } else if (res.data.cmaStatus == 1 || res.data.picStatus == true) {
+          } else if (
+            res.data.cmaStatus == 1 &&
+            res.data.picStatus == false &&
+            this.statusNum < 5
+          ) {
             this.clearFn();
             this.$message({
               duration: 1500,
@@ -142,6 +213,20 @@ export default {
               message: "下发指令成功！",
               type: "success",
             });
+            this.newPicApi(val);
+            clearInterval(this.picPimer);
+            this.picPimer = null;
+            this.picPimer = window.setInterval(() => {
+              this.newPicApi(val);
+              this.picNum++;
+            }, 8000);
+          } else if (
+            res.data.cmaStatus != 1 &&
+            res.data.picStatus == true &&
+            this.statusNum < 5
+          ) {
+            this.clearFn();
+            this.newPicApi(val);
             clearInterval(this.picPimer);
             this.picPimer = null;
             this.picPimer = window.setInterval(() => {
@@ -163,13 +248,15 @@ export default {
       }).then((res) => {
         console.log(res.data);
         console.log(this.picNum);
+        console.log(this.pzchannelId);
         if (res.data == true && this.picNum < 10) {
           //   console.log(this.$parent.$parent);
           this.$parent.$parent.getPhotoList(
-            -1,
+            this.pzchannelId,
             new Date(val.date).getTime(),
             this.termId
           ); //获取图片列表是传当前设备的 id 和termid
+
           this.$message({
             duration: 1500,
             showClose: true,
@@ -188,11 +275,27 @@ export default {
       });
     },
     clearFn() {
+      console.log("我要取消了轮巡");
       clearInterval(this.statusTimer);
       this.statusTimer = null;
       this.statusNum = 0;
       this.picLoading = false;
+      console.log("我要取消了轮巡1111111111111111111111111111111");
+      clearInterval(this.picPimer);
+      this.picPimer = null;
+      this.picNum = 0;
     },
   },
+  destroyed() {
+    console.log("离开了");
+    clearInterval(this.statusTimer);
+    this.statusTimer = null;
+    this.statusNum = 0;
+  },
+  beforeRouteLeave(to, from, next) {
+    // 路由跳转前，清除轮询
+    next();
+    console.log("7777777777777777777777777");
+  },
 };
 </script>

src/views/realTimeMonitor/components/takeTimePicButton.vue

@@ -0,0 +1,332 @@
+<template>
+  <!-- <el-button type="primary" @click="handleTakePic" :loading="picLoading"
+    >主动拍照
+  </el-button> -->
+  <div>
+    <el-dropdown trigger="click" @command="handleCommandpic">
+      <el-button type="primary" :loading="picLoading">
+        指定时间拍照<i class="el-icon-arrow-down el-icon--right"></i>
+      </el-button>
+      <el-dropdown-menu
+        slot="dropdown"
+        class="picdropStyle"
+        :append-to-body="false"
+      >
+        <el-dropdown-item
+          :command="item.channelid"
+          v-for="(item, index) in channelIdList"
+          :key="index"
+          >{{
+            item.alias !== null && item.alias !== ""
+              ? item.alias
+              : item.channelname
+          }}</el-dropdown-item
+        >
+      </el-dropdown-menu>
+    </el-dropdown>
+    <el-dialog
+      class="timeDialog"
+      title="拍照时间"
+      :visible.sync="dialogFormVisible"
+      width="380px"
+    >
+      <el-form :model="form">
+        <el-form-item label="拍照时间：">
+          <el-date-picker
+            v-model="form.startTime"
+            type="datetime"
+            placeholder="选择日期时间"
+          >
+          </el-date-picker>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button @click="dialogFormVisible = false">取 消</el-button>
+        <el-button type="primary" @click="confirmClick">确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import {
+  getTermStatus,
+  setTermCamera,
+  getTakePicStatusJoggle,
+  getTakePicPhotoStatusJoggle,
+} from "@/utils/api/index";
+export default {
+  data() {
+    return {
+      picLoading: false,
+      statusTimer: null,
+      statusNum: 0,
+      picPimer: null,
+      picNum: 0,
+      pzchannelId: "",
+      dialogFormVisible: false,
+      form: {
+        startTime: "",
+      },
+      timestamp: "",
+    };
+  },
+  watch: {
+    termId: {
+      handler(newVal, oldVal) {
+        console.log("我改变了");
+        clearInterval(this.statusTimer);
+        this.statusTimer = null;
+        this.statusNum = 0;
+        clearInterval(this.picPimer);
+        this.picPimer = null;
+        this.picNum = 0;
+        this.picLoading = false;
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  mounted() {
+    console.log(this.channelIdList);
+    console.log("我是主动拍照");
+  },
+  computed: {
+    termId() {
+      return this.$store.state.termId;
+    },
+
+    channelIdList() {
+      return this.$store.state.channelIdList;
+    },
+  },
+
+  methods: {
+    handleCommandpic(command) {
+      // --act=capture --cmdid=XY-SIMULATOR-0016 --channel=1 --preset=255 --scheduleTime=1704110700 --clientid=5 --reqid=TS
+      console.log(command);
+      this.dialogFormVisible = true;
+      this.pzchannelId = command;
+    },
+    confirmClick() {
+      console.log(this.pzchannelId);
+      console.log(this.form.startTime.getTime() / 1000);
+      this.timestamp = this.form.startTime.getTime() / 1000;
+      this.dialogFormVisible = false;
+      this.picLoading = true;
+      getTermStatus({ termId: this.termId }).then((res) => {
+        console.log(res);
+        if (res.data.isonline) {
+          let params = [
+            {
+              name: "act",
+              value: "capture",
+            },
+            {
+              name: "udp",
+              value: 1,
+            },
+            {
+              name: "channel",
+              value: this.pzchannelId,
+            },
+            {
+              name: "preset",
+              value: 255,
+            },
+            {
+              name: "scheduleTime",
+              value: this.timestamp,
+            },
+
+            {
+              name: "type",
+              value: 0,
+            },
+          ];
+          this.setTermFn(params);
+        } else {
+          this.picLoading = false;
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "装置下线，发送指令失败",
+            type: "error",
+          });
+        }
+      });
+    },
+    handleTakePic() {},
+    //下发命令
+    setTermFn(val) {
+      setTermCamera({
+        termId: this.termId,
+        list: val,
+      })
+        .then((res) => {
+          console.log(res);
+          this.getTakePicStatus(res.data);
+          clearInterval(this.statusTimer);
+          this.statusTimer = null;
+          this.statusTimer = window.setInterval(() => {
+            this.getTakePicStatus(res.data);
+            this.statusNum++;
+          }, 5000);
+        })
+        .catch((err) => {});
+    },
+    //查询命令是否下发成功
+    getTakePicStatus(val) {
+      console.log(val);
+      getTakePicStatusJoggle({
+        requestid: val.requestId,
+        termId: this.termId,
+        photoTime: new Date(val.date).getTime(),
+      })
+        .then((res) => {
+          console.log(res);
+          //res.data  0 状态未知  1 成功 2失败
+          // if (
+          //   res.data.cmaStatus == 0 &&
+          //   res.data.picStatus == false &&
+          //   this.statusNum >= 5
+          // ) {
+          //   //全部没有返回，失败
+          //   this.clearFn();
+          //   this.$message({
+          //     duration: 1500,
+          //     showClose: true,
+          //     message: "指令图片都没有返回true，并且轮巡大于五次！",
+          //     type: "warning",
+          //   });
+          // } else if (res.data.cmaStatus == 1) {
+          //   this.clearFn();
+          //   this.$message({
+          //     duration: 1500,
+          //     showClose: true,
+          //     message: "拍照指令cmaStatus下发成功返回1！",
+          //     type: "success",
+          //   });
+          //   clearInterval(this.picPimer);
+          //   this.picPimer = null;
+          //   this.picPimer = window.setInterval(() => {
+          //     this.newPicApi(val);
+          //     this.picNum++;
+          //   }, 8000);
+          //   return;
+          // } else if (res.data.picStatus == true) {
+          //   this.clearFn();
+          //   this.$message({
+          //     duration: 1500,
+          //     showClose: true,
+          //     message: "指令下发失败，图片已经返回！",
+          //     type: "success",
+          //   });
+          //   clearInterval(this.picPimer);
+          //   this.picPimer = null;
+          //   this.picPimer = window.setInterval(() => {
+          //     this.newPicApi(val);
+          //     this.picNum++;
+          //   }, 2000);
+          //   return;
+          // }
+          if (res.data.cmaStatus != 1 && this.statusNum >= 5) {
+            this.clearFn();
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "下发指令超时，请重试！",
+              type: "warning",
+            });
+          } else if (res.data.cmaStatus == 1 || res.data.picStatus == true) {
+            this.clearFn();
+            this.$message({
+              duration: 1500,
+              showClose: true,
+              message: "下发指令成功！",
+              type: "success",
+            });
+            this.newPicApi(val);
+            clearInterval(this.picPimer);
+            this.picPimer = null;
+            this.picPimer = window.setInterval(() => {
+              this.newPicApi(val);
+              this.picNum++;
+            }, 8000);
+          }
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    //获取最新的图片
+    newPicApi(val) {
+      getTakePicPhotoStatusJoggle({
+        requestid: val.requestId,
+        termId: this.termId,
+        photoTime: new Date(val.date).getTime(),
+      }).then((res) => {
+        console.log(res.data);
+        console.log(this.picNum);
+        if (res.data == true && this.picNum < 10) {
+          //   console.log(this.$parent.$parent);
+          this.$parent.$parent.getPhotoList(
+            -1,
+            new Date(val.date).getTime(),
+            this.termId
+          ); //获取图片列表是传当前设备的 id 和termid
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "已返回最新图片！",
+            type: "success",
+          });
+          clearInterval(this.picPimer);
+          this.picPimer = null;
+          this.picNum = 0;
+          console.log("返回最新图片");
+        } else if (res.data == false && this.picNum > 10) {
+          clearInterval(this.picPimer);
+          this.picPimer = null;
+          this.picNum = 0;
+        }
+      });
+    },
+    clearFn() {
+      clearInterval(this.statusTimer);
+      this.statusTimer = null;
+      this.statusNum = 0;
+      this.picLoading = false;
+    },
+  },
+  destroyed() {
+    console.log("离开了");
+    clearInterval(this.statusTimer);
+    this.statusTimer = null;
+    this.statusNum = 0;
+  },
+  beforeRouteLeave(to, from, next) {
+    // 路由跳转前，清除轮询
+    next();
+    console.log("7777777777777777777777777");
+  },
+};
+</script>
+<style lang="less">
+.timeDialog {
+  .el-date-editor.el-input,
+  .el-date-editor.el-input__inner {
+    width: 256px;
+  }
+  .el-dialog__footer {
+    .dialog-footer {
+      .el-button {
+        width: 80px !important;
+        margin-bottom: 0px !important;
+      }
+      .el-button + .el-button {
+        margin-left: 10px !important;
+      }
+    }
+  }
+}
+</style>

src/views/realTimeMonitor/components/takeVideoButton.vue

@@ -7,7 +7,11 @@
       <el-button type="primary" :loading="picLoading">
         主动录像<i class="el-icon-arrow-down el-icon--right"></i>
       </el-button>
-      <el-dropdown-menu slot="dropdown" class="picdropStyle">
+      <el-dropdown-menu
+        slot="dropdown"
+        class="picdropStyle"
+        :append-to-body="false"
+      >
         <el-dropdown-item
           :command="item.channelid"
           v-for="(item, index) in channelIdList"
@@ -85,11 +89,16 @@ export default {
     //   deep: true,
     //   immediate: true,
     // },
-    // termId: {
-    //   handler(newVal, oldVal) {},
-    //   deep: true,
-    //   immediate: true,
-    // },
+    termId: {
+      handler(newVal, oldVal) {
+        clearInterval(this.statusTimer);
+        this.statusTimer = null;
+        this.statusNum = 0;
+        this.picLoading = false;
+      },
+      deep: true,
+      immediate: true,
+    },
     // channelId: {
     //   handler(newVal, oldVal) {},
     //   deep: true,
@@ -125,6 +134,10 @@ export default {
                 name: "act",
                 value: "capture",
               },
+              {
+                name: "udp",
+                value: 1,
+              },
               {
                 name: "channel",
                 value: command,
@@ -162,6 +175,10 @@ export default {
               name: "act",
               value: "capture",
             },
+            {
+              name: "udp",
+              value: 1,
+            },
             {
               name: "channel",
               value: this.pzchannelId,

src/views/realTimeMonitor/components/uploadpic.vue

@@ -0,0 +1,145 @@
+<template>
+  <el-dialog
+    class="uploadPic"
+    title="上传图片"
+    :visible.sync="isShow"
+    :close-on-click-modal="false"
+    width="600px"
+    @close="handleclose"
+  >
+    <div class="uploadBox">
+      <el-form ref="form" :model="form" label-width="80px">
+        <el-form-item label="装置编号">
+          <el-input v-model="form.cmdid"></el-input>
+        </el-form-item>
+        <el-form-item label="装置Id">
+          <el-input v-model="form.termid"></el-input>
+        </el-form-item>
+        <el-form-item label="通道选择">
+          <el-select v-model="form.channel" placeholder="选择通道">
+            <el-option label="通道一" :value="1"></el-option>
+            <el-option label="通道二" :value="2"></el-option>
+            <el-option label="通道三" :value="3"></el-option>
+            <el-option label="通道四" :value="4"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="选择时间">
+          <el-date-picker
+            v-model="form.phototime"
+            value-format="timestamp"
+            type="datetime"
+            placeholder="选择日期时间"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="">
+          <el-upload
+            class="upload-demo"
+            ref="upload"
+            action="#"
+            :http-request="httpRequest"
+          >
+            <el-button slot="trigger" size="small" type="primary"
+              >选取图片</el-button
+            >
+          </el-upload>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="isShow = false">取 消</el-button>
+      <el-button type="primary" @click="handlesure">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+<script>
+import { uploadPicApi } from "@/utils/api/index";
+export default {
+  props: {},
+  data() {
+    return {
+      isShow: false,
+      form: {},
+      fileList: [], //上传列表
+    };
+  },
+  mounted() {},
+  methods: {
+    httpRequest(raw) {
+      this.fileList.push(raw);
+    },
+    //数据库获取最新数据
+    display(data) {
+      console.log(data);
+      this.$set(this.form, "cmdid", data.cmdid);
+      this.$set(this.form, "termid", data.id);
+      this.isShow = true;
+    },
+    handleclose() {
+      this.isShow = false;
+      this.fileList = [];
+    },
+    handlesure() {
+      this.isShow = false;
+      //console.log(this.fileList[0].file);
+      this.$set(this.form, "file", this.fileList[0].file);
+      console.log(this.form);
+      uploadPicApi(this.form)
+        .then((res) => {
+          console.log(res);
+          this.$message({
+            duration: 1500,
+            showClose: true,
+            message: "上传成功",
+            type: "success",
+          });
+          this.fileList = [];
+        })
+        .catch((err) => {});
+    },
+  },
+  destroyed() {
+    this.isShow = false;
+  },
+};
+</script>
+<style lang="less">
+.uploadPic {
+  .uploadBox {
+  }
+  .upload-demo {
+    position: relative;
+    display: flex;
+    align-items: center;
+    flex-direction: row-reverse;
+    margin-right: 16px;
+    .el-upload-list {
+      width: 370px;
+      height: 32px;
+      line-height: 32px;
+      border: 1px solid #dcdfe6;
+      background: #fff;
+      margin-right: 12px;
+      border-radius: 4px;
+      .el-upload-list__item-name {
+        margin-right: 0px;
+      }
+      .el-upload-list__item {
+        transition: none;
+        font-size: 14px;
+        color: #606266;
+        position: relative;
+        box-sizing: border-box;
+        border-radius: 4px;
+        width: 100%;
+        height: 32px;
+        line-height: 32px;
+        margin-top: 0px !important;
+        .el-icon-close {
+          top: 10px;
+        }
+      }
+    }
+  }
+}
+</style>

src/views/realTimeMonitor/index copy.vue

@@ -0,0 +1,298 @@
+<template>
+  <div class="realTimeMonitor" v-loading="mainLoading">
+    <div class="monitor-container">
+      <div class="allSide">
+        <div class="typeList">
+          <el-radio-group v-model="typeRadio" size="mini" @input="getTypeRadio">
+            <el-radio-button :label="-1">全部</el-radio-button>
+            <el-radio-button
+              :label="1"
+              v-if="roleName === 'superadmin' || roleName === 'Matthew'"
+              >活动</el-radio-button
+            >
+          </el-radio-group>
+        </div>
+        <sideBar ref="sideTree" v-if="allTreeFlag"></sideBar>
+        <activeSiderBar ref="activesideTree" v-else></activeSiderBar>
+      </div>
+
+      <div class="picListBox">
+        <div class="previewBox" v-if="LineFlag">
+          <!-- 预览图页面 -->
+          <previewContain ref="previewRef"></previewContain>
+        </div>
+        <div class="previewBox" v-if="towerFlag">
+          <div class="swiperBox" v-loading="swiperLoading">
+            <div class="title">
+              <el-breadcrumb separator="/">
+                <el-breadcrumb-item> {{ towertitle }}</el-breadcrumb-item>
+              </el-breadcrumb>
+            </div>
+            <carouselChart
+              ref="carouselpic"
+              :terminalPhoto="terminalPhoto"
+              :photoNum="photoNum"
+              :protocolInfo="protocolInfo"
+              v-if="terminalPhoto.length !== 0"
+            ></carouselChart>
+          </div>
+          <div class="parameterArea">
+            <parameterArea ref="areaRef"></parameterArea>
+          </div>
+        </div>
+      </div>
+    </div>
+    <morePicPreveiw ref="morePicPreveiw_ref"></morePicPreveiw>
+  </div>
+</template>
+<script>
+import { getTerminalPhotoListJoggle } from "@/utils/api/index";
+import sideBar from "./components/siderBar";
+import activeSiderBar from "./components/activeSiderBar";
+import previewContain from "./components/previewContain";
+import carouselChart from "./components/carouselChart";
+import parameterArea from "./components/parameterArea";
+import morePicPreveiw from "./components/morePicPreveiw";
+
+import { mapGetters, mapState } from "vuex";
+import ActiveSiderBar from "./components/activeSiderBar.vue";
+export default {
+  name: "realTimeMonitor",
+  data() {
+    return {
+      LineFlag: false, //如果是线路显示
+      towerFlag: false, //如果杆塔显示
+      mainLoading: false, //全局loading
+      page: 1, // 当前页数
+      towertitle: "", //杆塔名称
+      lineLoading: false, //杆塔loading
+      swiperLoading: false,
+      terminalPhoto: [], //获取装置当前图片数据
+      photoNum: 5,
+      dateValue: "", //当前时间
+      protocolInfo: "",
+      nopicPath: require("@/assets/img/nopic.jpg"),
+      typeRadio: -1, //类型选择
+      allTreeFlag: true,
+      roleName: "",
+    };
+  },
+  watch: {
+    treeSelectData: {
+      handler(newVal, oldVal) {},
+      deep: true,
+      immediate: true,
+    },
+  },
+  components: {
+    sideBar,
+    activeSiderBar,
+    previewContain,
+    carouselChart,
+    parameterArea,
+    morePicPreveiw,
+  },
+  computed: {
+    treeSelectData() {
+      return this.$store.state.currentData;
+    },
+  },
+  created() {
+    this.roleName = localStorage.getItem("userName");
+    //this.treeSelectData = currentData;
+    //获取当前时间
+  },
+  mounted() {
+    this.mainLoading = true;
+    setTimeout(() => {
+      this.mainLoading = false;
+    }, 1000);
+  },
+  methods: {
+    getTypeRadio() {
+      console.log(this.typeRadio);
+      if (this.typeRadio == -1) {
+        this.allTreeFlag = true;
+      } else {
+        this.allTreeFlag = false;
+      }
+    },
+    getCurrentData(data) {
+      console.log("执行父组件", this.treeSelectData);
+      if (this.treeSelectData.dyValue) {
+        console.log("电压");
+        this.LineFlag = true;
+        this.towerFlag = false;
+        this.lineLoading = true;
+        this.type = 1;
+        this.$nextTick(() => {
+          this.$refs.previewRef.getPicList(
+            this.treeSelectData.id,
+            this.type,
+            this.page
+          );
+        });
+      } else if (this.treeSelectData.dyLevelId) {
+        console.log("线路");
+        this.LineFlag = true;
+        this.towerFlag = false;
+        this.type = 2;
+        console.log(this.treeSelectData);
+        this.$nextTick(() => {
+          this.$refs.previewRef.getPicList(
+            this.treeSelectData.id,
+            this.type,
+            this.page
+          );
+        });
+      } else {
+        console.log("杆塔");
+        this.LineFlag = false;
+        this.towerFlag = true;
+        this.terminalPhoto = [];
+        this.protocolInfo = this.treeSelectData.protocol;
+        console.log("asddddddddddddddddddddd", this.treeSelectData);
+        this.towertitle = this.treeSelectData.name;
+        this.$nextTick(() => {
+          this.$refs.areaRef.getChannelList();
+          this.$refs.areaRef.takepicFun();
+        });
+      }
+    },
+    getPhotoList(channelId, date, termId) {
+      console.log(channelId, date, termId);
+      this.swiperLoading = true;
+      console.log("zhanshi asdadadadadadsddadadadadad", this.terminalPhoto);
+      this.terminalPhoto = [];
+      getTerminalPhotoListJoggle({
+        channelid: channelId,
+        time: date,
+        terminalid: termId,
+      })
+        .then((res) => {
+          console.log(res);
+          if (res.data.list.length == 0) {
+            this.terminalPhoto = [
+              {
+                path: this.nopicPath,
+                termId: termId,
+                mediatype: 0,
+              },
+            ];
+          } else {
+            this.terminalPhoto = res.data.list;
+          }
+          // let newDataList = [];
+          // let current = 0;
+          // if (this.terminalPhoto && this.terminalPhoto.length > 0) {
+          //   for (let i = 0; i <= this.terminalPhoto.length - 1; i++) {
+          //     if (i % this.photoNum !== 0 || i === 0) {
+          //       if (!newDataList[current]) {
+          //         newDataList.push([this.terminalPhoto[i]]);
+          //       } else {
+          //         newDataList[current].push(this.terminalPhoto[i]);
+          //       }
+          //     } else {
+          //       current++;
+          //       newDataList.push([this.terminalPhoto[i]]);
+          //     }
+          //   }
+          // }
+          // this.terminalPhoto = [...newDataList];
+          // this.$nextTick(() => {
+          //   this.$refs.carouselpic.changeBigPic(this.terminalPhoto[0][0], 0);
+          // });
+          this.$nextTick(() => {
+            this.$refs.carouselpic.changeBigPic(this.terminalPhoto[0], 0);
+          });
+
+          this.swiperLoading = false;
+        })
+        .catch((err) => {
+          console.log(err); //代码错误、请求失败捕获
+        });
+    },
+    //点击图片列表执行函数
+    jumpTowerPic(data) {
+      console.log("我是从子组件过来的数据");
+      console.log(data);
+      this.$refs.morePicPreveiw_ref.display(data);
+    },
+  },
+};
+</script>
+<style lang="less">
+.realTimeMonitor {
+  width: calc(100% - 0px);
+  height: calc(100% - 12px);
+  padding: 12px 0px 0px 0px;
+  background: #ffffff;
+  .monitor-container {
+    display: flex;
+    height: 100%;
+    box-sizing: border-box;
+    background: #ffffff;
+    border: 1px solid #dddddd;
+    border-radius: 4px;
+    .allSide {
+      height: 100%;
+      .typeList {
+        width: 94%;
+        margin: 0 auto;
+        margin-top: 8px;
+      }
+    }
+    .picListBox {
+      display: flex;
+      width: 100%;
+      height: 100%;
+      flex: 1;
+      overflow: hidden;
+      border-left: 1px solid #dddddd;
+      .previewBox {
+        display: flex;
+        width: 100%;
+        height: 100%;
+        flex: 1;
+      }
+      .swiperBox {
+        -webkit-box-flex: 1;
+        -ms-flex: 1;
+        flex: 1;
+        width: auto;
+        overflow: hidden;
+        display: flex;
+        flex-direction: column;
+        position: relative;
+        .title {
+          height: 32px;
+          padding-left: 12px;
+          line-height: 32px;
+          color: #fff;
+          font-size: 12px;
+          //background-color: #169e8cb0;
+          background: linear-gradient(180deg, #4cdbc8 10%, #128071 100%);
+
+          .el-breadcrumb {
+            line-height: 32px;
+            color: #fff !important;
+            font-size: 14px;
+            height: 32px;
+            .el-breadcrumb__inner,
+            .el-breadcrumb__separator {
+              color: #fff !important;
+            }
+          }
+        }
+      }
+      .parameterArea {
+        width: 220px;
+        padding: 0px 8px;
+        border-left: 1px solid #dddddd;
+        position: relative;
+        overflow-y: auto;
+      }
+    }
+  }
+}
+</style>

src/views/realTimeMonitor/index.vue

@@ -1,24 +1,48 @@
 <template>
   <div class="realTimeMonitor" v-loading="mainLoading">
     <div class="monitor-container">
-      <sideBar ref="sideTree"></sideBar>
+      <div class="allSide">
+        <div class="typeList">
+          <el-radio-group v-model="typeRadio" size="mini" @input="getTypeRadio">
+            <el-radio-button :label="-1">全部</el-radio-button>
+            <el-radio-button
+              :label="1"
+              v-if="roleName === 'superadmin' || roleName === 'Matthew'"
+              >活动</el-radio-button
+            >
+          </el-radio-group>
+        </div>
+        <sideBar ref="sideTree" v-if="allTreeFlag"></sideBar>
+        <activeSiderBar ref="activesideTree" v-else></activeSiderBar>
+      </div>
+
       <div class="picListBox">
         <div class="previewBox" v-if="LineFlag">
           <!-- 预览图页面 -->
           <previewContain ref="previewRef"></previewContain>
         </div>
-        <div class="previewBox" v-if="towerFlag">
+        <div class="previewBox" v-show="towerFlag">
           <div class="swiperBox" v-loading="swiperLoading">
             <div class="title">
               <el-breadcrumb separator="/">
                 <el-breadcrumb-item> {{ towertitle }}</el-breadcrumb-item>
+                <el-breadcrumb-item v-if="totalCount !== 0" class="picnum">
+                  <span
+                    v-for="(count, channel) in sortedChannelCounts"
+                    :key="channel"
+                  >
+                    {{ channel }}:{{ count }} 张,
+                  </span>
+                  共{{ totalCount }}张
+                </el-breadcrumb-item>
               </el-breadcrumb>
             </div>
             <carouselChart
               ref="carouselpic"
+              :key="carouselKey"
               :terminalPhoto="terminalPhoto"
               :photoNum="photoNum"
-              v-if="terminalPhoto.length !== 0"
+              :protocolInfo="protocolInfo"
             ></carouselChart>
           </div>
           <div class="parameterArea">
@@ -33,13 +57,16 @@
 <script>
 import { getTerminalPhotoListJoggle } from "@/utils/api/index";
 import sideBar from "./components/siderBar";
+import activeSiderBar from "./components/activeSiderBar";
 import previewContain from "./components/previewContain";
 import carouselChart from "./components/carouselChart";
 import parameterArea from "./components/parameterArea";
 import morePicPreveiw from "./components/morePicPreveiw";
 
 import { mapGetters, mapState } from "vuex";
+import ActiveSiderBar from "./components/activeSiderBar.vue";
 export default {
+  name: "realTimeMonitor",
   data() {
     return {
       LineFlag: false, //如果是线路显示
@@ -48,11 +75,18 @@ export default {
       page: 1, // 当前页数
       towertitle: "", //杆塔名称
       lineLoading: false, //杆塔loading
-      swiperLoading: false,
+      swiperLoading: true,
       terminalPhoto: [], //获取装置当前图片数据
       photoNum: 5,
       dateValue: "", //当前时间
+      protocolInfo: 0,
       nopicPath: require("@/assets/img/nopic.jpg"),
+      typeRadio: -1, //类型选择
+      allTreeFlag: true,
+      roleName: "",
+      carouselKey: 0, // 初始key
+      channelCounts: {}, // 存储每个通道的数据条数
+      totalCount: 0, // 总数据量
     };
   },
   watch: {
@@ -64,6 +98,7 @@ export default {
   },
   components: {
     sideBar,
+    activeSiderBar,
     previewContain,
     carouselChart,
     parameterArea,
@@ -73,8 +108,18 @@ export default {
     treeSelectData() {
       return this.$store.state.currentData;
     },
+    // 对通道统计结果进行排序
+    sortedChannelCounts() {
+      return Object.keys(this.channelCounts)
+        .sort((a, b) => a.localeCompare(b, "zh-Hans-CN", { numeric: true })) // 按通道名称排序
+        .reduce((acc, key) => {
+          acc[key] = this.channelCounts[key];
+          return acc;
+        }, {});
+    },
   },
   created() {
+    this.roleName = localStorage.getItem("userName");
     //this.treeSelectData = currentData;
     //获取当前时间
   },
@@ -85,6 +130,14 @@ export default {
     }, 1000);
   },
   methods: {
+    getTypeRadio() {
+      console.log(this.typeRadio);
+      if (this.typeRadio == -1) {
+        this.allTreeFlag = true;
+      } else {
+        this.allTreeFlag = false;
+      }
+    },
     getCurrentData(data) {
       console.log("执行父组件", this.treeSelectData);
       if (this.treeSelectData.dyValue) {
@@ -100,7 +153,7 @@ export default {
             this.page
           );
         });
-      } else if (this.treeSelectData.bsManufacturer) {
+      } else if (this.treeSelectData.dyLevelId) {
         console.log("线路");
         this.LineFlag = true;
         this.towerFlag = false;
@@ -117,24 +170,37 @@ export default {
         console.log("杆塔");
         this.LineFlag = false;
         this.towerFlag = true;
-
-        this.terminalPhoto = [];
+        //this.terminalPhoto = [];
+        this.protocolInfo = this.treeSelectData.protocol;
+        console.log("asddddddddddddddddddddd", this.treeSelectData);
         this.towertitle = this.treeSelectData.name;
         this.$nextTick(() => {
           this.$refs.areaRef.getChannelList();
+          this.$refs.areaRef.takepicFun();
         });
       }
     },
-    getPhotoList(channelId, date, termId) {
+    getPhotoList(channelId, date, termId, yzwValue) {
       console.log(channelId, date, termId);
       this.swiperLoading = true;
       console.log("zhanshi asdadadadadadsddadadadadad", this.terminalPhoto);
-      this.terminalPhoto = [];
-      getTerminalPhotoListJoggle({
-        channelid: channelId,
-        time: date,
-        terminalid: termId,
-      })
+      //this.terminalPhoto = [];
+      let params = {};
+      if (yzwValue == "") {
+        params = {
+          channelid: channelId,
+          time: date,
+          terminalid: termId,
+        };
+      } else {
+        params = {
+          channelid: channelId,
+          time: date,
+          terminalid: termId,
+          presetId: yzwValue,
+        };
+      }
+      getTerminalPhotoListJoggle(params)
         .then((res) => {
           console.log(res);
           if (res.data.list.length == 0) {
@@ -142,31 +208,50 @@ export default {
               {
                 path: this.nopicPath,
                 termId: termId,
-                mediatype: 0,
+                mediaType: 0,
               },
             ];
+            this.channelCounts = {};
+            this.totalCount = 0;
           } else {
             this.terminalPhoto = res.data.list;
-          }
-          let newDataList = [];
-          let current = 0;
-          if (this.terminalPhoto && this.terminalPhoto.length > 0) {
-            for (let i = 0; i <= this.terminalPhoto.length - 1; i++) {
-              if (i % this.photoNum !== 0 || i === 0) {
-                if (!newDataList[current]) {
-                  newDataList.push([this.terminalPhoto[i]]);
-                } else {
-                  newDataList[current].push(this.terminalPhoto[i]);
-                }
-              } else {
-                current++;
-                newDataList.push([this.terminalPhoto[i]]);
+            const list = this.terminalPhoto;
+            const counts = {};
+            // 遍历数据，统计每个通道的数据条数
+            list.forEach((item) => {
+              const channel = `C${item.channelId}`; // 将通道 ID 转换为 "通道1"、"通道2" 等形式
+              if (!counts[channel]) {
+                counts[channel] = 0;
               }
-            }
+              counts[channel]++;
+            });
+
+            this.channelCounts = counts;
+            this.totalCount = list.length; // 总数据量
           }
-          this.terminalPhoto = [...newDataList];
+          this.carouselKey++; // 更新key以强制重新渲染
+          // let newDataList = [];
+          // let current = 0;
+          // if (this.terminalPhoto && this.terminalPhoto.length > 0) {
+          //   for (let i = 0; i <= this.terminalPhoto.length - 1; i++) {
+          //     if (i % this.photoNum !== 0 || i === 0) {
+          //       if (!newDataList[current]) {
+          //         newDataList.push([this.terminalPhoto[i]]);
+          //       } else {
+          //         newDataList[current].push(this.terminalPhoto[i]);
+          //       }
+          //     } else {
+          //       current++;
+          //       newDataList.push([this.terminalPhoto[i]]);
+          //     }
+          //   }
+          // }
+          // this.terminalPhoto = [...newDataList];
+          // this.$nextTick(() => {
+          //   this.$refs.carouselpic.changeBigPic(this.terminalPhoto[0][0], 0);
+          // });
           this.$nextTick(() => {
-            this.$refs.carouselpic.changeBigPic(this.terminalPhoto[0][0], 0);
+            this.$refs.carouselpic.changeBigPic(this.terminalPhoto[0], 0);
           });
 
           this.swiperLoading = false;
@@ -197,6 +282,14 @@ export default {
     background: #ffffff;
     border: 1px solid #dddddd;
     border-radius: 4px;
+    .allSide {
+      height: 100%;
+      .typeList {
+        width: 94%;
+        margin: 0 auto;
+        margin-top: 8px;
+      }
+    }
     .picListBox {
       display: flex;
       width: 100%;
@@ -238,6 +331,12 @@ export default {
               color: #fff !important;
             }
           }
+          .picnum {
+            font-size: 12px;
+          }
+        }
+        .el-loading-mask {
+          background-color: rgba(0, 0, 0, 0.3);
         }
       }
       .parameterArea {

src/views/realTimeSearch/index.vue

@@ -105,25 +105,20 @@
           <el-form-item>
             <el-button type="primary" @click="onSubmit">查询</el-button>
           </el-form-item>
+          <el-form-item>
+            <el-button type="primary" @click="exportData">导出数据</el-button>
+          </el-form-item>
         </el-form>
       </div>
       <div class="pictureBox" v-loading="loading">
-        <div
-          v-if="picList.length !== 0"
-          style="width: 100%"
-          v-loading="loading"
-        >
+        <div class="picShowBox" v-if="picList.length !== 0" style="width: 100%">
           <el-card
             class="box-card imgList"
             v-for="(item, index) in picList"
             :key="index"
           >
             <div class="bigpic" v-if="item.path.indexOf('videos') == -1">
-              <el-image
-                lazy
-                :src="item.path + '!1366x768'"
-                :preview-src-list="[item.path]"
-              >
+              <el-image lazy :src="item.path" :preview-src-list="[item.path]">
                 <template slot="error">
                   <img src="../../assets/img/nodatapic2.jpg" />
                 </template>
@@ -147,6 +142,14 @@
                   }}
                 </p>
               </div>
+              <div class="deleteBox">
+                <el-button
+                  title="删除照片"
+                  type="primary"
+                  icon="el-icon-delete"
+                  @click.stop="deletePic(item)"
+                ></el-button>
+              </div>
             </div>
             <div class="bigpic" v-else>
               <!-- <el-image :src="item.path" lazy></el-image> -->
@@ -178,6 +181,14 @@
                   }} -->
                 </p>
               </div>
+              <div class="deleteBox">
+                <el-button
+                  title="删除照片"
+                  type="primary"
+                  icon="el-icon-delete"
+                  @click.stop="deletePic(item)"
+                ></el-button>
+              </div>
             </div>
           </el-card>
         </div>
@@ -192,6 +203,7 @@
           @size-change="handleSizeChange"
           :current-page="page"
           :page-size="pageSize"
+          :page-sizes="[20, 50, 100, 200]"
           layout="sizes, prev, pager, next, jumper,total"
           :total="total"
           background
@@ -203,9 +215,14 @@
 </template>
 
 <script>
-import { getSearchInfo, getRealtimePhoto } from "@/utils/api/index";
+import {
+  getSearchInfo,
+  getRealtimePhoto,
+  deletePicList,
+} from "@/utils/api/index";
 import defaultImage from "../../assets/img/nodatapic2.jpg";
 export default {
+  name: "realTimeSearch",
   data() {
     return {
       pickerOptions: {
@@ -228,7 +245,7 @@ export default {
         termid: -1,
         search: "",
       },
-
+      tdTermid: "",
       page: 1, // 当前页数
       pageSize: 20, // 每页数量
       total: 0, //总条数
@@ -253,6 +270,7 @@ export default {
         "starttime",
         new Date(new Date().toLocaleDateString()).getTime()
       );
+
       this.getSearchdy();
     } else {
       this.getSearchdy();
@@ -261,7 +279,8 @@ export default {
       this.formdata.towerid = this.$route.query.towerId;
       this.formdata.channelid = this.$route.query.channelId;
       this.formdata.termid = this.$route.query.termId;
-      this.$set(this.formdata, "starttime", this.$route.query.date);
+      this.$set(this.formdata, "starttime", Number(this.$route.query.date));
+      this.getPicData();
     }
   },
   methods: {
@@ -274,7 +293,6 @@ export default {
         .then((res) => {
           this.dyOptions = this.dyOptions.concat(res.data.list);
           console.log(this.dyOptions);
-
           if (JSON.stringify(this.$route.query) === "{}") {
             this.formdata.dyid = this.dyOptions[0].id;
           } else {
@@ -296,7 +314,6 @@ export default {
           } else {
             this.formdata.lineid = Number(this.$route.query.lineId);
           }
-
           this.getSearchgt();
         })
         .catch((err) => {});
@@ -324,7 +341,12 @@ export default {
         .then((res) => {
           this.zzOptions = [{ id: -1, name: "全部" }];
           this.zzOptions = this.zzOptions.concat(res.data.list);
-
+          // this.formdata.termid = this.zzOptions[0].id;
+          console.log("切换了杆塔");
+          // console.log(this.formdata.termid);
+          // console.log(this.zzOptions[0].id);
+          // this.formdata.termid = this.zzOptions[0].id;
+          // console.log(this.formdata.termid);
           if (JSON.stringify(this.$route.query) === "{}") {
             this.formdata.termid = this.zzOptions[0].id;
           } else {
@@ -348,7 +370,15 @@ export default {
             this.formdata.channelid = Number(this.$route.query.channelId);
           }
 
-          this.getPicData();
+          //this.getPicData();
+        })
+        .catch((err) => {});
+    },
+    getSearchtdAlone() {
+      getSearchInfo({ type: 5, id: this.tdTermid })
+        .then((res) => {
+          this.tdOptions = [{ id: -1, name: "全部", alias: null }];
+          this.tdOptions = this.tdOptions.concat(res.data.list);
         })
         .catch((err) => {});
     },
@@ -357,13 +387,15 @@ export default {
       this.loading = true;
       this.$set(this.formdata, "pageindex", this.page);
       this.$set(this.formdata, "pagesize", this.pageSize);
-
+      console.log(this.formdata);
       getRealtimePhoto(this.formdata)
         .then((res) => {
-          this.picList = [];
+          // this.picList = [];
           this.picList = res.data.list;
-
           this.total = res.data.total;
+          this.tdTermid = res.data.list[0].termid;
+          this.getSearchtdAlone();
+          console.log(this.$route.query);
           this.loading = false;
         })
         .catch((err) => {
@@ -384,11 +416,25 @@ export default {
       this.page = 1;
       this.getPicData();
     },
-
+    exportData() {
+      console.log(this.formdata);
+      exportPhotoJoggle(this.formdata)
+        .then((res) => {
+          console.log(res);
+          const now = this.$moment(new Date());
+          const formattedTime = now.format("YYYY年MM月DD日HH时mm分"); // 格式化时间字符串，例如 "2023-04-01_15_30_00"
+          const blob = new Blob([res]);
+          const link = document.createElement("a");
+          link.href = window.URL.createObjectURL(blob);
+          link.download = `运维数据报表_${formattedTime}.xls`;
+          link.click();
+        })
+        .catch((err) => {});
+    },
     //点击分页
     handleCurrentChange(val) {
       this.page = val;
-      this.picList = [];
+      //this.picList = [];
       this.getPicData();
     },
     //每页条数
@@ -396,6 +442,37 @@ export default {
       this.pageSize = val;
       this.getPicData();
     },
+    deletePic(val) {
+      console.log(val);
+      let deleteArr = [];
+      deleteArr.push(val.picid);
+      console.log(deleteArr);
+      deletePicList({ list: deleteArr })
+        .then((res) => {
+          console.log(res);
+          this.$confirm("此操作将永久删除该图片, 是否继续?", "提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning",
+          })
+            .then(() => {
+              this.$message({
+                type: "success",
+                showClose: true,
+                message: "删除成功!",
+              });
+              this.getPicData();
+            })
+            .catch(() => {
+              this.$message({
+                type: "info",
+                showClose: true,
+                message: "已取消删除",
+              });
+            });
+        })
+        .catch((err) => {});
+    },
   },
 };
 </script>
@@ -420,8 +497,12 @@ export default {
     flex-wrap: wrap;
     height: calc(100% - 135px);
     max-height: calc(100% - 135px);
-    overflow: auto;
+
     border: 1px solid #eee;
+    .picShowBox {
+      height: 100%;
+      overflow: auto;
+    }
 
     .imgList {
       width: calc((100% - 104px) / 4);
@@ -441,17 +522,28 @@ export default {
       .bigpic {
         width: 100%;
         height: 100%;
-        background-size: 100% 100%;
+        //background-size: 100% 100%;
         position: relative;
+
         .el-image {
           width: 100%;
           height: 100%;
+
+          .el-image__placeholder {
+            background: url(../../assets/img/nopicbg.png) no-repeat center;
+            background-size: 20% 20%;
+          }
           img {
             cursor: pointer;
             width: 100%;
             height: 200px;
           }
         }
+        &:hover {
+          .deleteBox {
+            display: block;
+          }
+        }
       }
       .caption {
         position: absolute;
@@ -477,6 +569,30 @@ export default {
           padding-right: 5px;
         }
       }
+      .deleteBox {
+        position: absolute;
+        right: 4px;
+        top: 4px;
+        z-index: 2;
+        display: none;
+        .el-button {
+          width: auto;
+          background: rgba(0, 0, 0, 0.5);
+          border: 1px solid transparent;
+          color: #fff;
+          font-size: 16px;
+          padding: 3px;
+        }
+        &:hover {
+          .el-button {
+            background: #f56c6c;
+            //color: #f56c6c;
+          }
+        }
+      }
+    }
+    .el-loading-mask {
+      background-color: rgba(255, 255, 255, 0.4);
     }
     .noPicBox {
       display: flex;

src/views/reportData/equipmentStatus/index.vue

@@ -0,0 +1,624 @@
+<template>
+  <div class="equipmentStatusBox" ref="statisRef">
+    <div class="searchBox" ref="searchref" v-if="drawerSearch">
+      <el-form :inline="true" :model="formdata" class="demo-form-inline">
+        <el-form-item label="电压等级" class="dyclass">
+          <el-select v-model="formdata.dyid" @change="getSearchxl">
+            <el-option
+              v-for="item in dyOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            >
+              {{ item.name }}
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="线路名称" class="xlclass">
+          <el-select v-model="formdata.lineid" @change="getSearchgt" filterable>
+            <el-option
+              v-for="item in xlOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="杆塔名称" class="gtclass">
+          <el-select v-model="formdata.towerid" filterable>
+            <el-option
+              v-for="item in gtOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="是否在线" class="isonLineClass">
+          <el-select v-model="formdata.isonline" filterable>
+            <el-option
+              v-for="item in onlineOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="规约" class="isonLineClass">
+          <el-select v-model="formdata.protocol" filterable>
+            <el-option
+              v-for="item in protocolOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          label="活动"
+          class="activitybox"
+          v-if="roleName === 'superadmin' || roleName === 'Matthew'"
+        >
+          <el-select
+            @keyup.enter.native="onSubmit()"
+            v-model="formdata.activityId"
+            filterable
+            @change="changeActive"
+          >
+            <el-option
+              v-for="item in activityOptions"
+              :key="item.id"
+              :label="item.name"
+              :value="item.id"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="开始日期" class="dateclass">
+          <el-date-picker
+            v-model="formdata.starttime"
+            type="datetime"
+            placeholder="开始日期"
+            value-format="timestamp"
+            :picker-options="pickerOptions"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="结束日期" class="dateclass">
+          <el-date-picker
+            v-model="formdata.endtime"
+            type="datetime"
+            placeholder="结束日期"
+            value-format="timestamp"
+            :picker-options="pickerOptions"
+          >
+          </el-date-picker>
+        </el-form-item>
+        <el-form-item label="装置查询" class="schclass">
+          <el-input
+            v-model="formdata.search"
+            placeholder="请输入设备名称"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit">查询</el-button>
+          <el-button type="primary">导出</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="deviceTable">
+      <el-table
+        v-loading="termLoading"
+        ref="multipleTable"
+        :data="termAllList"
+        tooltip-effect="dark"
+        stripe
+        style="width: 100%"
+        :height="tableheight"
+      >
+        <template slot="empty">
+          <el-empty :image-size="160" description="暂无数据"></el-empty>
+        </template>
+        <el-table-column label="序号" width="50px" fixed>
+          <template slot-scope="scope">
+            {{ (page - 1) * pageSize + scope.$index + 1 }}
+          </template>
+        </el-table-column>
+
+        <el-table-column
+          prop="dyName"
+          label="电压等级"
+          fixed
+          show-overflow-tooltip
+        >
+        </el-table-column>
+        <el-table-column prop="lineName" label="线路名称" min-width="180" fixed>
+        </el-table-column>
+        <el-table-column
+          prop="towerName"
+          label="杆塔名称"
+          min-width="180"
+          show-overflow-tooltip
+          fixed
+        >
+        </el-table-column>
+        <!-- <el-table-column prop="displayName" label="设备名称" min-width="180" fixed> </el-table-column> -->
+        <el-table-column prop="cmdid" label="装置id" min-width="180" fixed>
+          <template slot-scope="scope">
+            {{ scope.row.cmdid }}
+          </template>
+        </el-table-column>
+        <el-table-column prop="sim" label="SIM卡号" min-width="180">
+        </el-table-column>
+        <el-table-column prop="netType" label="网络类型">
+          <template slot-scope="scope">
+            <span v-if="scope.row.netType == 1">移动</span>
+            <span v-else-if="scope.row.netType == 2">联通</span>
+            <span v-else-if="scope.row.netType == 3">电信</span>
+          </template>
+        </el-table-column>
+        <el-table-column prop="onlinestatus" label="状态">
+          <template slot-scope="scope">
+            <span style="color: #169e8c" v-if="scope.row.onlinestatus == 1"
+              >在线</span
+            >
+            <span style="color: #f56c6c" v-else-if="scope.row.onlinestatus == 0"
+              >离线</span
+            >
+          </template>
+        </el-table-column>
+        <el-table-column prop="model" label="装置型号" min-width="120">
+        </el-table-column>
+        <el-table-column prop="bsManufacturer" label="装置厂家">
+        </el-table-column>
+        <el-table-column prop="protocolName" label="规约版本" min-width="180">
+        </el-table-column>
+        <el-table-column prop="workingDate" label="投运日期" min-width="140">
+        </el-table-column>
+
+        <el-table-column prop="onlinestatus" label="最新运行状态">
+        </el-table-column>
+        <el-table-column prop="photoInfo.totalDays" label="在线天数">
+        </el-table-column>
+        <el-table-column prop="photoInfo.photoCount" label="图片数量">
+        </el-table-column>
+        <el-table-column
+          prop="photoInfo.lastRecvTime"
+          label="最后数据上送时间"
+          min-width="140"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="photoInfo.lastPhotoTime"
+          label="最后图片上送时间"
+          min-width="140"
+        >
+        </el-table-column>
+
+        <el-table-column
+          prop="lastInfo.updateTimeStr"
+          label="最新基本信息采集时间"
+          min-width="140"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="lastInfo.equipName"
+          label="装置名称"
+          min-width="150"
+        >
+        </el-table-column>
+        <el-table-column prop="lastInfo.model" label="装置型号" min-width="120">
+        </el-table-column>
+        <el-table-column prop="lastInfo.version" label="装置版本号">
+        </el-table-column>
+        <el-table-column
+          prop="lastInfo.bsManu"
+          label="生产厂家"
+          min-width="120"
+          show-overflow-tooltip
+        >
+        </el-table-column>
+        <el-table-column
+          prop="lastInfo.productionDate"
+          label="生产日期"
+          min-width="140"
+        >
+        </el-table-column>
+        <el-table-column prop="lastInfo.bsId" label="出厂编号" min-width="150">
+        </el-table-column>
+
+        <el-table-column
+          prop="workingStatus.wsUpdateTime"
+          label="最新工作状态采集时间"
+          min-width="140"
+        >
+          <template slot-scope="scope">
+            {{
+              scope.row.workingStatus.wsUpdateTime == 0 ||
+              scope.row.workingStatus.wsUpdateTime == null
+                ? ""
+                : $moment(scope.row.workingStatus.wsUpdateTime * 1000).format(
+                    "YYYY-MM-DD HH:mm:ss"
+                  )
+            }}</template
+          >
+        </el-table-column>
+        <el-table-column prop="workingStatus.batteryVoltage" label="电源电压">
+        </el-table-column>
+        <el-table-column prop="workingStatus.opTemperature" label="工作温度">
+        </el-table-column>
+        <el-table-column prop="workingStatus.batteryCapacity" label="电池电量">
+        </el-table-column>
+        <el-table-column prop="workingStatus.floatingCharge" label="浮充状态">
+        </el-table-column>
+        <el-table-column
+          prop="workingStatus.totalWorkingTime"
+          label="工作总时间"
+        >
+        </el-table-column>
+        <el-table-column prop="workingStatus.workingTime" label="连续工作时间">
+        </el-table-column>
+        <el-table-column
+          prop="workingStatus.connectionState"
+          label="网络连接状态"
+        >
+        </el-table-column>
+
+        <el-table-column
+          prop="workingStatus.wsUpdateTime"
+          label="最新运行状态采集时间"
+          min-width="140"
+        >
+          <template slot-scope="scope">
+            {{
+              scope.row.workingStatus.wsUpdateTime == 0 ||
+              scope.row.workingStatus.wsUpdateTime == null
+                ? ""
+                : $moment(scope.row.workingStatus.wsUpdateTime * 1000).format(
+                    "YYYY-MM-DD HH:mm:ss"
+                  )
+            }}</template
+          >
+        </el-table-column>
+        <el-table-column
+          prop="workingStatus.signalStrength4g"
+          label="4G信号强度"
+        >
+        </el-table-column>
+        <el-table-column
+          prop="workingStatus.signalStrength2g"
+          label="2G信号强度"
+        >
+        </el-table-column>
+        <el-table-column prop="workingStatus.remainingRam" label="剩余运行内存">
+        </el-table-column>
+        <el-table-column prop="workingStatus.remainingRom" label="剩余存储内">
+        </el-table-column>
+
+        <el-table-column
+          prop="positions.updateTime"
+          label="最新GPS位置采集时间"
+          min-width="140"
+        >
+        </el-table-column>
+        <el-table-column prop="positions.radius" label="半径">
+        </el-table-column>
+        <el-table-column prop="positions.latitude" label="维度">
+        </el-table-column>
+        <el-table-column prop="positions.longitude" label="经度">
+        </el-table-column>
+      </el-table>
+      <div class="pageNation">
+        <el-pagination
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+          :current-page="page"
+          :page-size="pageSize"
+          layout="sizes, prev, pager, next, jumper,total"
+          :total="total"
+          background
+        >
+        </el-pagination>
+      </div>
+    </div>
+    <!-- <ipDialog ref="ipDialogref"></ipDialog>
+    <photoDialog ref="photoDialogref"></photoDialog> -->
+  </div>
+</template>
+<script>
+import {
+  gettermAllList,
+  getSearchInfo,
+  getProtocolList,
+  getActivityApi,
+} from "@/utils/api/reportApi";
+// import ipDialog from "./components/ipDialog";
+// import photoDialog from "./components/termAllList";
+export default {
+  name: "photoStatisBox",
+  components: {
+    // ipDialog,
+    // photoDialog,
+  },
+  props: ["statusFlag"],
+  data() {
+    return {
+      roleName: "",
+      pickerOptions: {
+        disabledDate(date) {
+          return date.getTime() > Date.now(); // 禁用大于今天的日期
+        },
+      },
+      termAllList: [],
+      dyOptions: [{ id: -1, name: "全部" }], //电压数据
+      xlOptions: [{ id: -1, name: "全部" }], //线路数据
+      gtOptions: [{ id: -1, name: "全部" }], //杆塔数据
+      activityOptions: [{ id: -1, name: "全部" }], //活动
+      onlineOptions: [
+        { id: -1, name: "全部" },
+        { id: 1, name: "在线" },
+        { id: 0, name: "离线" },
+      ],
+      protocolOptions: [{ id: -1, name: "全部" }], //规约数据
+      formdata: {
+        dyid: -1,
+        lineid: -1,
+        towerid: -1,
+        isonline: -1,
+        protocol: -1,
+        activityId: -1,
+        starttime: new Date(new Date().setHours(0, 0, 0, 0)).getTime(), // 设置开始时间为当天凌晨00:00:00的时间戳
+        endtime: new Date(new Date().setHours(23, 59, 59, 0)).getTime(), // 设置结束时间为当天夜晚23:59:59的时间戳
+        search: "",
+      },
+      page: 1, // 当前页数
+      pageSize: 20, // 每页数量
+      total: 0, //总条数
+      termLoading: false,
+      drawerSearch: false,
+      tableheight: "100%",
+    };
+  },
+  created() {
+    this.roleName = localStorage.getItem("userName");
+  },
+  mounted() {
+    // if (this.statusFlag) {
+    //   this.getSearchdy();
+    //   this.getProtocol();
+    //   this.getactiveList();
+    // }
+  },
+  watch: {},
+  methods: {
+    initfn() {
+      this.getSearchdy();
+      this.getProtocol();
+      this.getactiveList();
+    },
+    //获取电压信息
+    getSearchdy() {
+      getSearchInfo({ type: 1 })
+        .then((res) => {
+          this.dyOptions = this.dyOptions.concat(res.data.list);
+          console.log(this.dyOptions);
+          this.getSearchxl();
+        })
+        .catch((err) => {});
+    },
+    //获取线路数据
+    getSearchxl() {
+      getSearchInfo({ type: 2, id: this.formdata.dyid })
+        .then((res) => {
+          this.xlOptions = this.xlOptions.concat(res.data.list);
+          this.getSearchgt();
+        })
+        .catch((err) => {});
+    },
+    //获取杆塔数据
+    getSearchgt() {
+      getSearchInfo({ type: 3, id: this.formdata.lineid })
+        .then((res) => {
+          this.gtOptions = this.gtOptions.concat(res.data.list);
+          this.onSubmit();
+        })
+        .catch((err) => {});
+    },
+    getProtocol() {
+      //获取规约版本
+      getProtocolList()
+        .then((res) => {
+          console.log(res);
+          this.protocolOptions = this.protocolOptions.concat(res.data.list);
+          this.formdata.protocol = this.protocolOptions[0].id;
+        })
+        .catch((err) => {});
+    },
+    //获取活动列表
+    getactiveList() {
+      getActivityApi()
+        .then((res) => {
+          console.log(res);
+          // this.activityOptions = this.activityOptions.concat(res.data.list);
+          let activeArr = res.data.map((item) => ({
+            id: item.id,
+            name: item.title,
+          }));
+          this.activityOptions = this.activityOptions.concat(activeArr);
+          this.formdata.activityId = this.activityOptions[0].id;
+          // this.formdata.activityId =
+          // JSON.parse(localStorage.getItem("activeId")) !== null
+          //   ? JSON.parse(localStorage.getItem("activeId"))
+          //   : this.activityOptions[0].id;
+        })
+        .catch((err) => {});
+    },
+    changeActive(val) {
+      //localStorage.setItem("activeId", JSON.stringify(val));
+    },
+    onSubmit() {
+      if (this.formdata.starttime > this.formdata.endtime) {
+        return this.$message({
+          duration: 1500,
+          showClose: true,
+          message: "开始日期不能大于结束日期",
+          type: "warning",
+        });
+      }
+      this.page = 1;
+      this.getAllFun();
+    },
+    //获取带有图片信息的内容
+    getAllFun() {
+      console.log(this.formdata);
+      this.termLoading = true;
+      let params = {
+        dataFlag: "PSOCB", //全要
+        start: this.formdata.starttime / 1000,
+        end: this.formdata.endtime / 1000,
+        pageNum: this.page,
+        pageSize: this.pageSize,
+      };
+
+      // 根据条件添加参数
+      if (this.formdata.dyid !== -1) {
+        params.dyId = this.formdata.dyid;
+      }
+      if (this.formdata.lineid !== -1) {
+        params.lineId = this.formdata.lineid;
+      }
+      if (this.formdata.towerid !== -1) {
+        params.towerId = this.formdata.towerid;
+      }
+      if (this.formdata.isonline !== -1) {
+        params.isonline = this.formdata.isonline;
+      }
+      if (this.formdata.protocol !== -1) {
+        params.protocol = this.formdata.protocol;
+      }
+      if (this.formdata.activityId !== -1) {
+        params.activityId = this.formdata.activityId;
+      }
+      if (this.formdata.search !== "") {
+        params.cmdid = this.formdata.search;
+      }
+      setTimeout(() => {
+        gettermAllList(params)
+          .then((res) => {
+            console.log(res);
+            this.termAllList = res.data.list;
+            this.total = res.data.total;
+            this.termLoading = false;
+          })
+          .catch((err) => {
+            this.termLoading = false;
+          });
+      }, 100);
+    },
+
+    //点击分页
+    handleCurrentChange(val) {
+      this.page = val;
+      this.getAllFun();
+    },
+
+    //每页条数
+    handleSizeChange(val) {
+      this.pageSize = val;
+      this.getAllFun();
+    },
+    // //点击装置查看历史图片
+    // handleShowPhoto(row) {
+    //   let params = this.formdata;
+    //   this.$refs.photoDialogref.display(row, params);
+    // },
+    // //点击最后心跳时间获取历史 ip和端口
+    // handleShowIp(row) {
+    //   this.$refs.ipDialogref.display(row);
+    // },
+    showSearch() {
+      this.drawerSearch = !this.drawerSearch;
+      console.log(this.drawerSearch);
+
+      this.$nextTick(() => {
+        if (this.drawerSearch) {
+          // 如果抽屉现在是可见的，获取其高度
+          console.log(this.$refs.statisRef.offsetHeight);
+          const searchBoxHeight = this.$refs.searchref.offsetHeight;
+          console.log("搜索框的高度:", searchBoxHeight);
+          this.tableheight =
+            this.$refs.statisRef.offsetHeight - searchBoxHeight - 36;
+          console.log(this.tableheight);
+        } else {
+          this.tableheight = "100%";
+        }
+      });
+    },
+  },
+};
+</script>
+<style lang="less">
+.equipmentStatusBox {
+  height: 100%;
+  .searchBox {
+    .dyclass {
+      .el-select {
+        width: 120px;
+      }
+    }
+    .xlclass {
+      .el-select {
+        width: 150px;
+      }
+    }
+    .gtclass {
+      .el-select {
+        width: 180px;
+      }
+    }
+    .tdclass {
+      .el-select {
+        width: 80px;
+      }
+    }
+    .dateclass {
+      .el-date-editor.el-input,
+      .el-date-editor.el-input__inner {
+        width: 190px;
+      }
+    }
+    .isonLineClass {
+      .el-form-item__content {
+        width: 120px;
+      }
+    }
+  }
+  .deviceTable {
+    height: calc(100% - 32px);
+    //background: #fcc;
+    .el-table {
+      .cell {
+        text-align: center;
+        vertical-align: middle; /* 如果需要垂直居中 */
+      }
+    }
+    .el-table {
+      color: #000;
+      thead {
+        color: #000;
+        font-weight: bold;
+      }
+      th.el-table__cell {
+        background: #dcdcdc !important;
+      }
+      td.el-table__cell,
+      th.el-table__cell.is-leaf {
+        border-bottom: 1px solid #dcdcdc;
+      }
+      .el-table__cell {
+        border-right: 1px solid #dcdcdc;
+      }
+    }
+  }
+}
+</style>

src/views/reportData/index.vue

@@ -0,0 +1,119 @@
+<template>
+  <div class="reportDataBox">
+    <!-- <div class="reoprtContain"></div> -->
+    <el-tabs type="border-card" @tab-click="handleTabClick">
+      <el-tab-pane label="照片统计">
+        <span slot="label">
+          照片统计
+          <el-button
+            @click.stop="handlePicSearch"
+            v-if="picSearchFlag"
+            type="primary"
+            icon="el-icon-search"
+          ></el-button>
+        </span>
+        <photostatis ref="photoStatisRef"></photostatis>
+      </el-tab-pane>
+      <el-tab-pane label="设备状态列表">
+        <span slot="label">
+          设备状态列表
+          <el-button
+            @click.stop="handlestatusSearch"
+            v-if="statusFlag"
+            type="primary"
+            icon="el-icon-search"
+          ></el-button>
+        </span>
+        <equipmentStatus
+          ref="equipmentStatusRef"
+          :statusFlag="statusFlag"
+        ></equipmentStatus
+      ></el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+<script>
+import {} from "@/utils/api/index";
+
+import photostatis from "./photostatis/index";
+import equipmentStatus from "./equipmentStatus/index";
+export default {
+  name: "reportData",
+  components: {
+    photostatis,
+    equipmentStatus,
+  },
+  data() {
+    return {
+      picSearchFlag: true,
+      statusFlag: false,
+      pictotalFlag: false,
+    };
+  },
+  created() {},
+  mounted() {},
+  watch: {},
+  methods: {
+    handleTabClick(tab, event) {
+      // 当标签页被点击时触发
+      const tabName = tab.label;
+      console.log(tab);
+      if (tabName === "照片统计") {
+        this.picSearchFlag = true;
+        this.statusFlag = false;
+        this.pictotalFlag = false;
+        // 调用照片统计组件的方法
+        if (this.$refs.photoStatisRef) {
+          this.$refs.photoStatisRef.onSubmit(); // 假设someMethod是你要调用的方法
+        }
+      } else if (tabName === "设备状态列表") {
+        this.picSearchFlag = false;
+        this.statusFlag = true;
+        this.pictotalFlag = false;
+        // 调用设备状态列表组件的方法
+        if (this.$refs.equipmentStatusRef) {
+          this.$refs.equipmentStatusRef.initfn(); // 假设someOtherMethod是你要调用的方法
+          //this.$refs.equipmentStatusRef.onSubmit(); // 假设someOtherMethod是你要调用的方法
+        }
+      }
+      // 可以继续添加其他标签页的逻辑
+    },
+    handlePicSearch() {
+      console.log("aaaaaaaaaaaa");
+      this.$refs.photoStatisRef.showSearch();
+    },
+    handlestatusSearch() {
+      console.log("bbbbbb");
+      this.$refs.equipmentStatusRef.showSearch();
+    },
+  },
+};
+</script>
+<style lang="less">
+.reportDataBox {
+  width: calc(100% - 24px);
+  height: calc(100% - 24px);
+  padding: 12px 12px;
+  .el-tabs--border-card > .el-tabs__content {
+    padding: 8px;
+  }
+  .el-tabs {
+    height: 100%;
+
+    .el-tabs__header {
+      .el-button--default,
+      .el-button--primary {
+        width: auto;
+        margin-left: 12px;
+      }
+    }
+    .el-tabs__content {
+      height: calc(100% - 65px);
+      //overflow: auto;
+      .el-tab-pane {
+        height: 100%;
+      }
+    }
+  }
+}
+</style>