APP界面样式调整-提交

package-lock.json

@@ -1,417 +0,0 @@
-{
-  "name": "Vent-app",
-  "lockfileVersion": 2,
-  "requires": true,
-  "packages": {
-    "": {
-      "dependencies": {
-        "crypto-js": "^4.2.0",
-        "dayjs": "^1.11.10",
-        "echarts": "^5.5.1",
-        "flv.js": "^1.6.2",
-        "moment": "^2.30.1",
-        "string-similarity": "^4.0.4",
-        "uview-ui": "^2.0.36",
-        "vuex": "^3.6.2",
-        "zrender": "^5.6.0"
-      }
-    },
-    "node_modules/@babel/helper-string-parser": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmmirror.com/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz",
-      "integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==",
-      "peer": true,
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/helper-validator-identifier": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmmirror.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz",
-      "integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==",
-      "peer": true,
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@babel/parser": {
-      "version": "7.27.0",
-      "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.27.0.tgz",
-      "integrity": "sha512-iaepho73/2Pz7w2eMS0Q5f83+0RKI7i4xmiYeBmDzfRVbQtTOG7Ts0S4HzJVsTMGI9keU8rNfuZr8DKfSt7Yyg==",
-      "peer": true,
-      "dependencies": {
-        "@babel/types": "^7.27.0"
-      },
-      "bin": {
-        "parser": "bin/babel-parser.js"
-      },
-      "engines": {
-        "node": ">=6.0.0"
-      }
-    },
-    "node_modules/@babel/types": {
-      "version": "7.27.0",
-      "resolved": "https://registry.npmmirror.com/@babel/types/-/types-7.27.0.tgz",
-      "integrity": "sha512-H45s8fVLYjbhFH62dIJ3WtmJ6RSPt/3DRO0ZcT2SUiYiQyz3BLVb9ADEnLl91m74aQPS3AzzeajZHYOalWe3bg==",
-      "peer": true,
-      "dependencies": {
-        "@babel/helper-string-parser": "^7.25.9",
-        "@babel/helper-validator-identifier": "^7.25.9"
-      },
-      "engines": {
-        "node": ">=6.9.0"
-      }
-    },
-    "node_modules/@vue/compiler-sfc": {
-      "version": "2.7.16",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-2.7.16.tgz",
-      "integrity": "sha512-KWhJ9k5nXuNtygPU7+t1rX6baZeqOYLEforUPjgNDBnLicfHCoi48H87Q8XyLZOrNNsmhuwKqtpDQWjEFe6Ekg==",
-      "peer": true,
-      "dependencies": {
-        "@babel/parser": "^7.23.5",
-        "postcss": "^8.4.14",
-        "source-map": "^0.6.1"
-      },
-      "optionalDependencies": {
-        "prettier": "^1.18.2 || ^2.0.0"
-      }
-    },
-    "node_modules/crypto-js": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmmirror.com/crypto-js/-/crypto-js-4.2.0.tgz",
-      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
-    },
-    "node_modules/csstype": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.1.3.tgz",
-      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
-      "peer": true
-    },
-    "node_modules/dayjs": {
-      "version": "1.11.13",
-      "license": "MIT"
-    },
-    "node_modules/echarts": {
-      "version": "5.6.0",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "tslib": "2.3.0",
-        "zrender": "5.6.1"
-      }
-    },
-    "node_modules/es6-promise": {
-      "version": "4.2.8",
-      "resolved": "https://registry.npmmirror.com/es6-promise/-/es6-promise-4.2.8.tgz",
-      "integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w=="
-    },
-    "node_modules/flv.js": {
-      "version": "1.6.2",
-      "license": "Apache-2.0",
-      "dependencies": {
-        "es6-promise": "^4.2.8",
-        "webworkify-webpack": "^2.1.5"
-      }
-    },
-    "node_modules/moment": {
-      "version": "2.30.1",
-      "license": "MIT",
-      "engines": {
-        "node": "*"
-      }
-    },
-    "node_modules/nanoid": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.11.tgz",
-      "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
-      "funding": [
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
-      "peer": true,
-      "bin": {
-        "nanoid": "bin/nanoid.cjs"
-      },
-      "engines": {
-        "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
-      }
-    },
-    "node_modules/picocolors": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmmirror.com/picocolors/-/picocolors-1.1.1.tgz",
-      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
-      "peer": true
-    },
-    "node_modules/postcss": {
-      "version": "8.5.3",
-      "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.5.3.tgz",
-      "integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==",
-      "funding": [
-        {
-          "type": "opencollective",
-          "url": "https://opencollective.com/postcss/"
-        },
-        {
-          "type": "tidelift",
-          "url": "https://tidelift.com/funding/github/npm/postcss"
-        },
-        {
-          "type": "github",
-          "url": "https://github.com/sponsors/ai"
-        }
-      ],
-      "peer": true,
-      "dependencies": {
-        "nanoid": "^3.3.8",
-        "picocolors": "^1.1.1",
-        "source-map-js": "^1.2.1"
-      },
-      "engines": {
-        "node": "^10 || ^12 || >=14"
-      }
-    },
-    "node_modules/prettier": {
-      "version": "2.8.8",
-      "resolved": "https://registry.npmmirror.com/prettier/-/prettier-2.8.8.tgz",
-      "integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
-      "optional": true,
-      "peer": true,
-      "bin": {
-        "prettier": "bin-prettier.js"
-      },
-      "engines": {
-        "node": ">=10.13.0"
-      },
-      "funding": {
-        "url": "https://github.com/prettier/prettier?sponsor=1"
-      }
-    },
-    "node_modules/source-map": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmmirror.com/source-map/-/source-map-0.6.1.tgz",
-      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "peer": true,
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/source-map-js": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmmirror.com/source-map-js/-/source-map-js-1.2.1.tgz",
-      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
-      "peer": true,
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/string-similarity": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmmirror.com/string-similarity/-/string-similarity-4.0.4.tgz",
-      "integrity": "sha512-/q/8Q4Bl4ZKAPjj8WerIBJWALKkaPRfrvhfF8k/B23i4nzrlRj2/go1m90In7nG/3XDSbOo0+pu6RvCTM9RGMQ==",
-      "deprecated": "Package no longer supported. Contact Support at https://www.npmjs.com/support for more info."
-    },
-    "node_modules/tslib": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
-      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
-    },
-    "node_modules/uview-ui": {
-      "version": "2.0.38",
-      "engines": {
-        "HBuilderX": "^3.1.0"
-      }
-    },
-    "node_modules/vue": {
-      "version": "2.7.16",
-      "resolved": "https://registry.npmmirror.com/vue/-/vue-2.7.16.tgz",
-      "integrity": "sha512-4gCtFXaAA3zYZdTp5s4Hl2sozuySsgz4jy1EnpBHNfpMa9dK1ZCG7viqBPCwXtmgc8nHqUsAu3G4gtmXkkY3Sw==",
-      "deprecated": "Vue 2 has reached EOL and is no longer actively maintained. See https://v2.vuejs.org/eol/ for more details.",
-      "peer": true,
-      "dependencies": {
-        "@vue/compiler-sfc": "2.7.16",
-        "csstype": "^3.1.0"
-      }
-    },
-    "node_modules/vuex": {
-      "version": "3.6.2",
-      "license": "MIT",
-      "peerDependencies": {
-        "vue": "^2.0.0"
-      }
-    },
-    "node_modules/webworkify-webpack": {
-      "version": "2.1.5",
-      "resolved": "https://registry.npmmirror.com/webworkify-webpack/-/webworkify-webpack-2.1.5.tgz",
-      "integrity": "sha512-2akF8FIyUvbiBBdD+RoHpoTbHMQF2HwjcxfDvgztAX5YwbZNyrtfUMgvfgFVsgDhDPVTlkbb5vyasqDHfIDPQw=="
-    },
-    "node_modules/zrender": {
-      "version": "5.6.1",
-      "license": "BSD-3-Clause",
-      "dependencies": {
-        "tslib": "2.3.0"
-      }
-    }
-  },
-  "dependencies": {
-    "@babel/helper-string-parser": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmmirror.com/@babel/helper-string-parser/-/helper-string-parser-7.25.9.tgz",
-      "integrity": "sha512-4A/SCr/2KLd5jrtOMFzaKjVtAei3+2r/NChoBNoZ3EyP/+GlhoaEGoWOZUmFmoITP7zOJyHIMm+DYRd8o3PvHA==",
-      "peer": true
-    },
-    "@babel/helper-validator-identifier": {
-      "version": "7.25.9",
-      "resolved": "https://registry.npmmirror.com/@babel/helper-validator-identifier/-/helper-validator-identifier-7.25.9.tgz",
-      "integrity": "sha512-Ed61U6XJc3CVRfkERJWDz4dJwKe7iLmmJsbOGu9wSloNSFttHV0I8g6UAgb7qnK5ly5bGLPd4oXZlxCdANBOWQ==",
-      "peer": true
-    },
-    "@babel/parser": {
-      "version": "7.27.0",
-      "resolved": "https://registry.npmmirror.com/@babel/parser/-/parser-7.27.0.tgz",
-      "integrity": "sha512-iaepho73/2Pz7w2eMS0Q5f83+0RKI7i4xmiYeBmDzfRVbQtTOG7Ts0S4HzJVsTMGI9keU8rNfuZr8DKfSt7Yyg==",
-      "peer": true,
-      "requires": {
-        "@babel/types": "^7.27.0"
-      }
-    },
-    "@babel/types": {
-      "version": "7.27.0",
-      "resolved": "https://registry.npmmirror.com/@babel/types/-/types-7.27.0.tgz",
-      "integrity": "sha512-H45s8fVLYjbhFH62dIJ3WtmJ6RSPt/3DRO0ZcT2SUiYiQyz3BLVb9ADEnLl91m74aQPS3AzzeajZHYOalWe3bg==",
-      "peer": true,
-      "requires": {
-        "@babel/helper-string-parser": "^7.25.9",
-        "@babel/helper-validator-identifier": "^7.25.9"
-      }
-    },
-    "@vue/compiler-sfc": {
-      "version": "2.7.16",
-      "resolved": "https://registry.npmmirror.com/@vue/compiler-sfc/-/compiler-sfc-2.7.16.tgz",
-      "integrity": "sha512-KWhJ9k5nXuNtygPU7+t1rX6baZeqOYLEforUPjgNDBnLicfHCoi48H87Q8XyLZOrNNsmhuwKqtpDQWjEFe6Ekg==",
-      "peer": true,
-      "requires": {
-        "@babel/parser": "^7.23.5",
-        "postcss": "^8.4.14",
-        "prettier": "^1.18.2 || ^2.0.0",
-        "source-map": "^0.6.1"
-      }
-    },
-    "crypto-js": {
-      "version": "4.2.0",
-      "resolved": "https://registry.npmmirror.com/crypto-js/-/crypto-js-4.2.0.tgz",
-      "integrity": "sha512-KALDyEYgpY+Rlob/iriUtjV6d5Eq+Y191A5g4UqLAi8CyGP9N1+FdVbkc1SxKc2r4YAYqG8JzO2KGL+AizD70Q=="
-    },
-    "csstype": {
-      "version": "3.1.3",
-      "resolved": "https://registry.npmmirror.com/csstype/-/csstype-3.1.3.tgz",
-      "integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw==",
-      "peer": true
-    },
-    "dayjs": {
-      "version": "1.11.13"
-    },
-    "echarts": {
-      "version": "5.6.0",
-      "requires": {
-        "tslib": "2.3.0",
-        "zrender": "5.6.1"
-      }
-    },
-    "es6-promise": {
-      "version": "4.2.8",
-      "resolved": "https://registry.npmmirror.com/es6-promise/-/es6-promise-4.2.8.tgz",
-      "integrity": "sha512-HJDGx5daxeIvxdBxvG2cb9g4tEvwIk3i8+nhX0yGrYmZUzbkdg8QbDevheDB8gd0//uPj4c1EQua8Q+MViT0/w=="
-    },
-    "flv.js": {
-      "version": "1.6.2",
-      "requires": {
-        "es6-promise": "^4.2.8",
-        "webworkify-webpack": "^2.1.5"
-      }
-    },
-    "moment": {
-      "version": "2.30.1"
-    },
-    "nanoid": {
-      "version": "3.3.11",
-      "resolved": "https://registry.npmmirror.com/nanoid/-/nanoid-3.3.11.tgz",
-      "integrity": "sha512-N8SpfPUnUp1bK+PMYW8qSWdl9U+wwNWI4QKxOYDy9JAro3WMX7p2OeVRF9v+347pnakNevPmiHhNmZ2HbFA76w==",
-      "peer": true
-    },
-    "picocolors": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npmmirror.com/picocolors/-/picocolors-1.1.1.tgz",
-      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
-      "peer": true
-    },
-    "postcss": {
-      "version": "8.5.3",
-      "resolved": "https://registry.npmmirror.com/postcss/-/postcss-8.5.3.tgz",
-      "integrity": "sha512-dle9A3yYxlBSrt8Fu+IpjGT8SY8hN0mlaA6GY8t0P5PjIOZemULz/E2Bnm/2dcUOena75OTNkHI76uZBNUUq3A==",
-      "peer": true,
-      "requires": {
-        "nanoid": "^3.3.8",
-        "picocolors": "^1.1.1",
-        "source-map-js": "^1.2.1"
-      }
-    },
-    "prettier": {
-      "version": "2.8.8",
-      "resolved": "https://registry.npmmirror.com/prettier/-/prettier-2.8.8.tgz",
-      "integrity": "sha512-tdN8qQGvNjw4CHbY+XXk0JgCXn9QiF21a55rBe5LJAU+kDyC4WQn4+awm2Xfk2lQMk5fKup9XgzTZtGkjBdP9Q==",
-      "optional": true,
-      "peer": true
-    },
-    "source-map": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmmirror.com/source-map/-/source-map-0.6.1.tgz",
-      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
-      "peer": true
-    },
-    "source-map-js": {
-      "version": "1.2.1",
-      "resolved": "https://registry.npmmirror.com/source-map-js/-/source-map-js-1.2.1.tgz",
-      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
-      "peer": true
-    },
-    "string-similarity": {
-      "version": "4.0.4",
-      "resolved": "https://registry.npmmirror.com/string-similarity/-/string-similarity-4.0.4.tgz",
-      "integrity": "sha512-/q/8Q4Bl4ZKAPjj8WerIBJWALKkaPRfrvhfF8k/B23i4nzrlRj2/go1m90In7nG/3XDSbOo0+pu6RvCTM9RGMQ=="
-    },
-    "tslib": {
-      "version": "2.3.0",
-      "resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
-      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
-    },
-    "uview-ui": {
-      "version": "2.0.38"
-    },
-    "vue": {
-      "version": "2.7.16",
-      "resolved": "https://registry.npmmirror.com/vue/-/vue-2.7.16.tgz",
-      "integrity": "sha512-4gCtFXaAA3zYZdTp5s4Hl2sozuySsgz4jy1EnpBHNfpMa9dK1ZCG7viqBPCwXtmgc8nHqUsAu3G4gtmXkkY3Sw==",
-      "peer": true,
-      "requires": {
-        "@vue/compiler-sfc": "2.7.16",
-        "csstype": "^3.1.0"
-      }
-    },
-    "vuex": {
-      "version": "3.6.2",
-      "requires": {}
-    },
-    "webworkify-webpack": {
-      "version": "2.1.5",
-      "resolved": "https://registry.npmmirror.com/webworkify-webpack/-/webworkify-webpack-2.1.5.tgz",
-      "integrity": "sha512-2akF8FIyUvbiBBdD+RoHpoTbHMQF2HwjcxfDvgztAX5YwbZNyrtfUMgvfgFVsgDhDPVTlkbb5vyasqDHfIDPQw=="
-    },
-    "zrender": {
-      "version": "5.6.1",
-      "requires": {
-        "tslib": "2.3.0"
-      }
-    }
-  }
-}

package.json

@@ -17,6 +17,10 @@
   },
   "dependencies": {
     "crypto-js": "^4.2.0",
-    "formdata-polyfill": "^4.0.10"
+    "dayjs": "^1.11.21",
+    "echarts": "^5.5.1",
+    "formdata-polyfill": "^4.0.10",
+    "moment": "^2.30.1",
+    "zrender": "^6.1.0"
   }
 }

pages.json

@@ -111,7 +111,10 @@
     },
     {
       "path": "pages/login/login",
-      "style": {}
+      "style": {
+        "navigationStyle": "custom",
+        "navigationBarTextStyle": "black"
+      }
     },
     {
       "path": "pages/user/userexit",

pages/device/devicemenu/devicemenu.vue

@@ -25,7 +25,8 @@ export default {
 }
 </script>
 <style>
-	.bg{
-		background-color: #ffffff;
-	}
+.bg {
+	min-height: 100%;
+	/* background-color: #f4f7fd; */
+}
 </style>

pages/device/devicemenu/treeMenu/typeMenu.vue

@@ -1,39 +1,41 @@
 <template>
   <view class="device-type-modal">
-    <scroll-view>
-      <!-- 通风设备 -->
-      <view v-for="(typeitem, index) in typeList" :key="index">
-        <view
-          class="cu-bar bg-white solid-bottom margin-top"
-          :style="[{ animation: 'show 0.5s 1' }]"
-        >
-          <view class="action">
-            <text style="font-weight: bold">{{ typeitem.itemText }}</text>
-          </view>
+    <scroll-view scroll-y class="menu-scroll">
+      <view
+        class="type-card"
+        v-for="(typeitem, typeIndex) in typeList"
+        :key="typeIndex"
+      >
+        <view class="card-header">
+          <text class="card-title">{{ typeitem.itemText }}</text>
         </view>
-
-        <view class="cu-list grid col-4 text-sm">
+        <view class="card-divider"></view>
+        <view class="icon-grid">
           <view
-            class="cu-item animation-slide-bottom"
-            :style="[{ animationDelay: (index + 1) * 0.05 + 's' }]"
-            v-for="(item, index) in typeitem.children"
-            :key="index"
+            class="grid-item"
+            v-for="(item, itemIndex) in typeitem.children"
+            :key="itemIndex"
             @tap="goPage(item.itemValue)"
           >
-            <view class="padding text-center">
+            <view class="icon-wrap">
               <image
+                class="icon-base"
                 :src="icon_prefix + 'bottombg.png'"
-                style="width: 50px; height: 30px"
-              >
-              </image>
-              <image class="icon" :src="getIcon(item.itemValue)" alt="Icon" />
-              <view class="margin-top-xs">{{ item.itemText }}</view>
+                mode="aspectFit"
+              ></image>
+              <image
+                class="icon-top"
+                :src="getIcon(item.itemValue)"
+                mode="aspectFit"
+              ></image>
+               <text class="item-label">{{ item.itemText }}</text>
             </view>
+            <!-- <text class="item-label">{{ item.itemText }}</text> -->
           </view>
         </view>
       </view>
+      <!-- <view class="cu-tabbar-height"></view> -->
     </scroll-view>
-    <view class="cu-tabbar-height margin-top"></view>
   </view>
 </template>
 
@@ -103,7 +105,8 @@ export default {
       });
     },
     goPage(page) {
-      this.$emit("menuClick", page);
+      // this.$emit("menuClick", page);
+       this.$emit("menuClick", {id:page,menu:this.typeList});
     },
     getIcon(itemValue) {
       const defaultIconPath = "/static/sidebar/fireS/pulping.svg";
@@ -121,27 +124,100 @@ export default {
 
 <style scoped lang="scss">
 .device-type-modal {
-  margin-top: 30rpx;
+  min-height: 100%;
+  // background: #f4f7fd;
+  box-sizing: border-box;
+}
+
+.menu-scroll {
+  height: 100%;
+  padding: 24rpx 24rpx 0;
+  box-sizing: border-box;
+}
+
+.type-card {
+  background: #f9f9fb;
+  border-radius: 20rpx;
+  margin-bottom: 24rpx;
+  padding: 0 24rpx 24rpx;
+  box-shadow: 0 4rpx 16rpx rgba(41, 121, 255, 0.04);
+  overflow: hidden;
 }
-.cu-list.grid > .cu-item {
-  padding: 0rpx 0rpx;
-  background: linear-gradient(
-    to right,
-    rgba(55, 135, 254, 0.08),
-    rgba(4, 184, 255, 0.08),
-    rgba(60, 161, 237, 0.08)
-  );
+
+.card-header {
+  padding: 28rpx 8rpx 20rpx;
+}
+
+.card-title {
+  font-size: 32rpx;
+  font-weight: 700;
+  color: #000;
+  line-height: 1.2;
 }
-.line2-icon {
-  width: 60rpx;
-  height: 60rpx;
+
+.card-divider {
+  height: 1rpx;
+  background: #efeff0;
+  margin: 0 0 24rpx;
 }
-.icon {
+
+.icon-grid {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+
+.grid-item {
+  width: 25%;
+  box-sizing: border-box;
+  padding: 8rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.icon-wrap {
+  position: relative;
+  width: 100%;
+  height: 120rpx;
+  background: #e3e9fc;
+  border-radius: 16rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 12rpx;
+}
+
+.icon-base {
+  width: 88rpx;
+  height: 56rpx;
+}
+
+.icon-top {
   position: absolute;
-  top: 5rpx;
+  top: 18rpx;
   left: 50%;
   transform: translateX(-50%);
-  width: 20rpx;
-  height: 20rpx;
+  width: 36rpx;
+  height: 36rpx;
+}
+
+.item-label {
+  position: absolute;
+  bottom: 4rpx;
+  left: 50%;
+  transform: translateX(-50%);
+  font-size: 22rpx;
+  color: #000;
+  text-align: center;
+  line-height: 1.3;
+  width: 100%;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.cu-tabbar-height {
+  height: 40rpx;
 }
 </style>

pages/device/index.vue

@@ -1,54 +1,33 @@
 <template>
-  <view>
+  <view class="devic-box">
     <!-- 建议放在外层 -->
-    <u-navbar
-      :bgStatusImage="backPic0"
-      :bgImage="backPic"
-      title="设备中心"
-      @leftClick="devicemenuShow"
-      :safeAreaInsetTop="true"
-    >
+    <u-navbar :bgStatusImage="backPic0" :bgImage="backPic" title="设备监测" @leftClick="devicemenuShow"
+      :safeAreaInsetTop="true" :fixed="true" height="50px" bgColor="transparent" titleStyle="fw600 fs-18"
+      leftIconColor="#303133">
       <view class="u-nav-slot" slot="left">
-        <u-icon name="list" size="20"> </u-icon>
+        <u-icon name="arrow-left" size="20"> </u-icon>
       </view>
     </u-navbar>
+    <view class="devic-box-content">
+      <view v-if="menushow" class="menupage">
+        <DeviceMenu @menuClick="menuClick"></DeviceMenu>
+      </view>
 
-    <view v-if="menushow" class="menupage">
-      <DeviceMenu @menuClick="menuClick"></DeviceMenu>
-    </view>
-    <u-tabs
-      v-if="!menushow"
-      class="devic-box-tab"
-      :current="PageCur"
-      :list="tabList"
-      @click="NavChange"
-    ></u-tabs>
-    <view class="">
-      <home
-        cur="home"
-        :showColum="showColum"
-        v-if="PageCur == '0' && !menushow"
-        :key="0"
-        :deviceType="deviceType"
-        @setMenushow="setMenushow"
-      ></home>
-      <history
-        :key="1"
-        cur="history"
-        :showColum="showColum"
-        :deviceType="deviceType"
-        v-if="PageCur == '1' && !menushow"
-        @setMenushow="setMenushow"
-      ></history>
-      <operation
-        :key="2"
-        :showColum="showColum"
-        :deviceType="deviceType"
-        cur="operation"
-        v-if="PageCur == '2' && !menushow"
-        @setMenushow="setMenushow"
-      ></operation>
+      <!-- <u-tabs v-if="!menushow" class="devic-box-tab" :current="PageCur" :list="tabList" @click="NavChange"></u-tabs> -->
+      <u-tabs v-if="!menushow" class="devic-box-tab" :current="pageCurNew" :list="tabListNew"
+        @click="NavChange"></u-tabs>
+      <view class="">
+        <!-- <home cur="home" :showColum="showColum" v-if="pageCurNew == '0' && !menushow" :key="0" :deviceType="deviceType"
+          @setMenushow="setMenushow"></home> -->
+        <home cur="home" :showColum="showColum" v-if="!menushow" :key="0" :deviceType="deviceType"
+          @setMenushow="setMenushow"></home>
+        <!-- <history :key="1" cur="history" :showColum="showColum" :deviceType="deviceType"
+          v-if="PageCur == '1' && !menushow" @setMenushow="setMenushow"></history>
+        <operation :key="2" :showColum="showColum" :deviceType="deviceType" cur="operation"
+          v-if="PageCur == '2' && !menushow" @setMenushow="setMenushow"></operation> -->
+      </view>
     </view>
+
   </view>
 </template>
 
@@ -61,43 +40,58 @@ export default {
   },
   data() {
     return {
-      backPic0: "url(/static/topnavbar0.png)",
-      backPic: "url(../../static/topnavbar.png)",
-      PageCur: "0",
+      // backPic0: "url(/static/topnavbar0.png)",
+      // backPic: "url(../../static/topnavbar.png)",
+      backPic0: "",
+      backPic: "",
+      // PageCur: "0",
+      pageCurNew: '',
       showColum: {},
       menushow: true,
       deviceType: "",
-      tabList: [
-        {
-          name: "设备监测",
-        },
-        {
-          name: "历史数据",
-        },
-        {
-          name: "操作记录",
-        },
-      ],
+      // tabList: [
+      //   {
+      //     name: "设备监测",
+      //   },
+      //   {
+      //     name: "历史数据",
+      //   },
+      //   {
+      //     name: "操作记录",
+      //   },
+      // ],
+      tabListNew: [],
     };
   },
   created() {
     this.getShowColum();
   },
   onLoad: function () {
-    this.PageCur = "0";
+    // this.PageCur = "0";
   },
   methods: {
     NavChange: function (item) {
-      this.PageCur = item.index;
+      console.log("item", item);
+      // this.PageCur = item.index;
+      this.deviceType = item.id;
       this.menushow = false;
     },
     devicemenuShow(e) {
       this.menushow = !this.menushow;
     },
-    menuClick(id) {
+    menuClick(params) {
       debugger;
-      // this.TabCur = id;
-      this.deviceType = id;
+      let data = params.menu.map((item) => item.children).flatMap((i) => i).map((v, index) => {
+        return {
+          name: v.itemText,
+          id: v.itemValue,
+          index: index,
+        };
+      });
+      this.deviceType = params.id;
+      this.tabListNew = data;
+      this.pageCurNew = this.tabListNew.find(item => item.id == params.id).index;
+      console.log("data", data);
       this.menushow = false;
     },
     getShowColum() {
@@ -109,6 +103,7 @@ export default {
               var showlist = response.data.result;
               this.$store.commit("SET_SHOWCOLUM", showlist);
               this.showColum = showlist;
+              console.log("showColum", this.showColum);
             } else {
               resolve(response);
             }
@@ -129,7 +124,23 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.devic-box-tab {
-  // margin-top: 50px;
+// .devic-box {
+//   // background: #f4f7fd;
+// }
+
+.devic-box-content {
+  height: calc(100vh - 101px);
+  margin-top: 50px;
+  overflow-y: auto;
+  // background: #f4f7fd;
+}
+
+.menupage {
+  min-height: 100%;
+  // background: #f4f7fd;
+}
+
+::v-deep .u-tabs__wrapper {
+  margin: 0px 15px !important;
 }
-</style>
+</style>

pages/filecenter/filecenter.vue

@@ -1,61 +1,57 @@
 <template name="filecenter">
-  <view>
+  <view class="file-page">
     <u-navbar
       title="文件中心"
-      :bgStatusImage="backPic0"
-      :bgImage="backPic"
       :safeAreaInsetTop="true"
+      :fixed="true"
+      height="50px"
+      bgColor="transparent"
+     titleStyle="fw600 fs-18"
+      leftIconColor="#303133"
+      @leftClick="goBack"
     >
       <view class="u-nav-slot" slot="left">
-        <u-icon name="list" size="20"> </u-icon>
+        <u-icon name="arrow-left" size="20" color="#303133"></u-icon>
       </view>
     </u-navbar>
-    <!-- <view v-if="menushow" class="menupage">
-      <FileTreeMenu @menuClick="menuClick"></FileTreeMenu>
-    </view> -->
-    <view v-if="!menushow" class="container">
-      <view class="main">
-        <view style="margin-top: 40px">
-          <u-subsection
-            :list="sectionList"
-            mode="button"
-            :current="curNow"
-            @change="sectionChange"
-            :animation="true"
-            bg-color="#3c9cff"
-            button-color="#3c9cff"
-            active-color="#000"
-            inactive-color="#000"
-          ></u-subsection>
+
+    <view v-if="!menushow" class="file-page-content">
+      <view class="file-tab-bar">
+        <view
+          class="file-tab-item"
+          v-for="(item, index) in sectionList"
+          :key="index"
+          :class="{ active: curNow === index }"
+          @click="sectionChange(index)"
+        >
+          <text class="file-tab-text">{{ item.name }}</text>
+          <view class="file-tab-line" v-if="curNow === index"></view>
         </view>
-        <view class="searchArea">
-          <view class="fileArea">
-            <view style="margin-top: 15px; margin-left: 10px" class="fileTitle"
-              >文件名称</view
-            >
+      </view>
+
+      <view class="file-main">
+        <view class="search-card">
+          <view class="search-row">
+            <text class="search-label">文件名称</text>
             <u-input
-              style="margin-top: 15px; margin-right: 15px"
               v-model="fileName"
               type="text"
-              class="fileInput"
-            ></u-input
-          ></view>
-          <view class="pickerArea">
-            <view class="btns">
-              <u-button
-                class="fileBtn"
-                style="margin: 15px"
-                type="primary"
-                :text="fileType ? fileType : '选择文件类型'"
-                @click="pickershow = true"
-              ></u-button>
-              <u-button
-                class="fileBtn"
-                style="margin: 15px"
-                type="primary"
-                @click="searchFile"
-                >查询</u-button
-              >
+              class="search-input"
+              placeholder="请输入文件名称"
+              border="none"
+            ></u-input>
+          </view>
+          <view class="search-actions">
+            <view
+              class="action-btn action-btn-outline"
+              @click="pickershow = true"
+            >
+              <text class="action-btn-text">{{
+                fileType ? fileType : "选择文件类型"
+              }}</text>
+            </view>
+            <view class="action-btn action-btn-primary" @click="searchFile">
+              <text class="action-btn-text">查询</text>
             </view>
             <u-picker
               :show="pickershow"
@@ -66,84 +62,99 @@
             ></u-picker>
           </view>
         </view>
-        <view class="u-page">
+
+        <view class="file-list">
           <u-list>
-            <u-list-item
-              class="itemback"
-              v-for="(item, index) in fileData"
-              :key="index"
-            >
-              <view class="content flcard" @tap="openFile(item)">
-                <view
-                  class="demo-layout bg-purple-light"
-                  style="margin-bottom: 20rpx"
-                >
-                  <view style="margin-top: 10rpx">
-                    <text class="text-style1">{{ item.fileName }}</text>
-                  </view>
+            <u-list-item v-for="(item, index) in fileData" :key="index">
+              <view class="file-card">
+                <view class="file-card-header" @tap="openFile(item)">
+                  <text class="file-card-title">{{ item.fileName }}</text>
                 </view>
-                <view class="btnClass" style="margin-bottom: 30rpx">
-                  <u-button
-                    class="btn"
-                    type="primary"
-                    shape="circle"
-                    text="审批详情"
-                    @click="detailmodal(item)"
-                  ></u-button>
-                  <u-button
-                    class="btn"
-                    type="primary"
-                    shape="circle"
-                    text="提交"
-                    @click="commitmodal(item)"
-                  ></u-button>
-                  <u-button
-                    class="btn"
-                    type="primary"
-                    shape="circle"
-                    text="撤回"
-                    @click="retractmodal(item)"
-                  ></u-button>
-                  <u-button
-                    class="btn"
-                    type="primary"
-                    shape="circle"
-                    text="下载"
-                    @click="download(item)"
-                  ></u-button>
-                  <u-button
-                    class="btn"
-                    type="primary"
-                    shape="circle"
-                    text="删除"
-                    @click="showmodal(item)"
-                  ></u-button>
-                </view>
-                <view class="datacard laiyuan">
-                  <view style="margin: 20rpx 20rpx">
-                    <text class="text-style">{{ item.fileSource }}</text>
+                <view class="file-action-row">
+                  <view
+                    class="action-btn action-btn-primary"
+                    @click.stop="detailmodal(item)"
+                  >
+                    <text class="action-btn-text">审批详情</text>
                   </view>
-                  <view class="text-info">文件来源</view>
-                </view>
-                <view class="datacard zhuangtai">
-                  <view style="margin: 20rpx 20rpx">
-                    <text class="text-style">{{
-                      item.bpmStatus_dictText
-                    }}</text>
+                  <view
+                    class="action-btn action-btn-outline"
+                    @click.stop="commitmodal(item)"
+                  >
+                    <text class="action-btn-text">提交</text>
                   </view>
-                  <view class="text-info">审批状态</view>
-                </view>
-                <view class="datacard user">
-                  <view style="margin: 20rpx 20rpx">
-                    <text class="text-style">{{ item.createBy }}</text>
+                  <view
+                    class="action-btn action-btn-outline"
+                    @click.stop="retractmodal(item)"
+                  >
+                    <text class="action-btn-text">撤回</text>
+                  </view>
+                  <view
+                    class="action-btn action-btn-outline"
+                    @click.stop="download(item)"
+                  >
+                    <text class="action-btn-text">下载</text>
+                  </view>
+                  <view
+                    class="action-btn action-btn-outline"
+                    @click.stop="showmodal(item)"
+                  >
+                    <text class="action-btn-text">删除</text>
                   </view>
-                  <view class="text-info">创建人</view>
                 </view>
-                <view class="datacard time">
-                  <view style="margin: 20rpx 20rpx">
-                    <text class="text-style">{{ item.createTime }}</text>
+                <view class="file-info-grid" @tap="openFile(item)">
+                  <view class="file-info-card">
+                    <view class="file-info-icon-box">
+                      <image
+                        class="file-info-icon"
+                        src="/static/filecenter/文件来源.svg"
+                        mode="aspectFit"
+                      ></image>
+                    </view>
+                    <view class="file-info-content">
+                      <text class="file-info-value">{{ item.fileSource }}</text>
+                      <text class="file-info-label">文件来源</text>
+                    </view>
+                  </view>
+                  <view class="file-info-card">
+                    <view class="file-info-icon-box">
+                      <image
+                        class="file-info-icon"
+                        src="/static/filecenter/审批状态.svg"
+                        mode="aspectFit"
+                      ></image>
+                    </view>
+                    <view class="file-info-content">
+                      <text class="file-info-value">{{ item.bpmStatus_dictText }}</text>
+                      <text class="file-info-label">审批状态</text>
+                    </view>
+                  </view>
+                  <view class="file-info-card">
+                    <view class="file-info-icon-box">
+                      <image
+                        class="file-info-icon"
+                        src="/static/filecenter/创建人.svg"
+                        mode="aspectFit"
+                      ></image>
+                    </view>
+                    <view class="file-info-content">
+                      <text class="file-info-value">{{ item.createBy }}</text>
+                      <text class="file-info-label">创建人</text>
+                    </view>
+                  </view>
+                  <view class="file-info-card">
+                    <view class="file-info-icon-box">
+                      <image
+                        class="file-info-icon"
+                        src="/static/filecenter/上传时间.svg"
+                        mode="aspectFit"
+                      ></image>
+                    </view>
+                    <view class="file-info-content">
+                      <text class="file-info-value">{{ item.createTime }}</text>
+                      <text class="file-info-label">上传时间</text>
+                    </view>
                   </view>
-                  <view class="text-info">上传时间</view>
                 </view>
               </view>
             </u-list-item>
@@ -151,117 +162,223 @@
           <!-- 审批详情 -->
           <u-popup
             :show="detailShow"
-            :closeable="true"
-            :round="10"
-            mode="bottom"
+            mode="center"
+            :round="16"
+            :closeable="false"
             @close="detailClose"
           >
-            <view>
-              <view class="title">
-                <span class="firetext">流程审批进度历史</span>
+            <view class="detail-modal">
+              <view class="detail-modal-header">
+                <text class="detail-modal-title">审批详情</text>
+                <view class="detail-modal-close" @click="detailClose">
+                  <image
+                    class="detail-close-icon"
+                    src="/static/filecenter/关闭.svg"
+                    mode="aspectFit"
+                  />
+                </view>
               </view>
-              <view class="table-container">
-                <view class="table">
-                  <view class="table-header">
-                    <view class="table-cell">序号</view>
-                    <view class="table-cell">当前环节</view>
-                    <view class="table-cell">审批人</view>
-                    <view class="table-cell">审批结果</view>
-                    <view class="table-cell">审批开始时间</view>
-                    <view class="table-cell">审批结束时间</view>
-                    <view class="table-cell">处理意见</view>
-                    <view class="table-cell">状态</view>
-                    <!-- ... 根据需要添加更多表头 -->
+              <view class="detail-modal-divider"></view>
+              <scroll-view scroll-y class="detail-modal-body">
+                <view class="detail-section">
+                  <view class="detail-section-title">
+                    <text class="detail-section-prefix">//</text>
+                    <text class="detail-section-text">流程审批进度历史</text>
                   </view>
-                  <view
-                    class="table-row"
-                    v-for="(item, index) in tableData"
-                    :key="index"
-                  >
-                    <view class="table-cell"
-                      ><template>
-                        <span>{{ index + 1 }}</span>
-                      </template></view
-                    >
-                    <view class="table-cell">{{ item.name }}</view>
-                    <view class="table-cell">
-                      <template>
-                        <span
-                          v-if="item.assignees && item.assignees.length > 0"
-                        >
-                          {{ item.assignees[0].username }}
-                        </span>
-                        <!-- 如果没有审批人，可以显示空或占位符 -->
-                        <span v-else> - </span>
-                      </template></view
-                    >
-                    <view class="table-cell">{{ item.deleteReason }}</view>
-                    <view class="table-cell">{{ item.createTime }}</view>
-                    <view class="table-cell">{{ item.endTime }}</view>
-                    <view class="table-cell">{{ item.comment }}</view>
-                    <view class="table-cell">
-                      <template>
-                        <span v-if="item.assignees[0].isExecutor">
-                          已处理
-                        </span>
-                        <!-- 如果没有审批人，可以显示空或占位符 -->
-                        <span v-else> 待处理</span>
-                      </template></view
-                    >
-                    <!-- ... 根据需要添加更多单元格 -->
+                  <view class="detail-table-container">
+                    <view class="detail-table">
+                      <view class="detail-table-header">
+                        <view class="detail-table-cell">序号</view>
+                        <view class="detail-table-cell">当前环节</view>
+                        <view class="detail-table-cell">审批人</view>
+                        <view class="detail-table-cell">审批结果</view>
+                        <view class="detail-table-cell">审批开始时间</view>
+                        <view class="detail-table-cell">审批结束时间</view>
+                        <view class="detail-table-cell">处理意见</view>
+                        <view class="detail-table-cell">状态</view>
+                      </view>
+                      <view
+                        class="detail-table-row"
+                        v-for="(item, index) in tableData"
+                        :key="index"
+                      >
+                        <view class="detail-table-cell">
+                          <text>{{ index + 1 }}</text>
+                        </view>
+                        <view class="detail-table-cell">{{ item.name }}</view>
+                        <view class="detail-table-cell">
+                          <text
+                            v-if="item.assignees && item.assignees.length > 0"
+                          >
+                            {{ item.assignees[0].username }}
+                          </text>
+                          <text v-else> - </text>
+                        </view>
+                        <view class="detail-table-cell">{{
+                          item.deleteReason
+                        }}</view>
+                        <view class="detail-table-cell">{{
+                          item.createTime
+                        }}</view>
+                        <view class="detail-table-cell">{{ item.endTime }}</view>
+                        <view class="detail-table-cell">{{ item.comment }}</view>
+                        <view class="detail-table-cell">
+                          <text v-if="item.assignees[0].isExecutor">
+                            已处理
+                          </text>
+                          <text v-else> 待处理</text>
+                        </view>
+                      </view>
+                    </view>
                   </view>
                 </view>
-              </view>
-            </view>
-            <view>
-              <view class="title">
-                <span class="firetext">实时流程图</span>
-              </view>
-              <image style="width: 100%" :src="imageUrl" alt="" />
+                <view class="detail-section">
+                  <view class="detail-section-title">
+                    <text class="detail-section-prefix">//</text>
+                    <text class="detail-section-text">实时流程图</text>
+                  </view>
+                  <view class="detail-flowchart-wrap">
+                    <image
+                      class="detail-flowchart-img"
+                      :src="imageUrl"
+                      mode="widthFix"
+                    />
+                  </view>
+                </view>
+              </scroll-view>
             </view>
           </u-popup>
           <!-- 删除 -->
-          <u-modal
+          <u-popup
             :show="show"
-            :showCancelButton="true"
-            :showConfirmButton="true"
-            :content="content"
-            @confirm="confirm"
-            @cancel="cancel"
-          ></u-modal>
+            mode="center"
+            :round="16"
+            :closeable="false"
+            @close="cancel"
+          >
+            <view class="delete-modal">
+              <view class="delete-modal-header">
+                <text class="delete-modal-title">删除</text>
+                <view class="delete-modal-close" @click="cancel">
+                  <image
+                    class="delete-close-icon"
+                    src="/static/filecenter/关闭.svg"
+                    mode="aspectFit"
+                  />
+                </view>
+              </view>
+              <view class="delete-modal-divider"></view>
+              <view class="delete-modal-body">
+                <view class="delete-confirm-box">
+                  <image
+                    class="delete-confirm-icon"
+                    src="/static/filecenter/删除.svg"
+                    mode="aspectFit"
+                  />
+                  <text class="delete-confirm-text">确定删除？</text>
+                </view>
+              </view>
+              <view class="delete-modal-footer">
+                <view class="action-btn action-btn-outline" @click="cancel">
+                  <text class="action-btn-text">取消</text>
+                </view>
+                <view class="action-btn action-btn-primary" @click="confirm">
+                  <text class="action-btn-text">确定</text>
+                </view>
+              </view>
+            </view>
+          </u-popup>
           <!-- 提交 -->
-          <u-picker
+          <u-popup
             :show="commitShow"
-            :columns="[columns]"
-            title="选择审批"
-            @confirm="confirmCommit"
-            @cancel="cancelCommit"
+            mode="center"
+            :round="16"
+            :closeable="false"
+            @close="cancelCommit"
+          >
+            <view class="commit-modal">
+              <view class="commit-modal-header">
+                <text class="commit-modal-title">提交文件</text>
+                <view class="commit-modal-close" @click="cancelCommit">
+                  <image
+                    class="commit-close-icon"
+                    src="/static/filecenter/关闭.svg"
+                    mode="aspectFit"
+                  />
+                </view>
+              </view>
+              <view class="commit-modal-divider"></view>
+              <view class="commit-modal-body">
+                <view class="commit-form-box">
+                  <view class="commit-form-row">
+                    <view class="commit-form-label">
+                      <text class="commit-required">*</text>
+                      <text>选择审批</text>
+                    </view>
+                    <view class="commit-select" @click="openCommitPicker">
+                      <text class="commit-select-text">{{
+                        selectedCommitName
+                      }}</text>
+                      <text class="commit-select-arrow"></text>
+                    </view>
+                  </view>
+                </view>
+              </view>
+              <view class="commit-modal-footer">
+                <view class="action-btn action-btn-outline" @click="cancelCommit">
+                  <text class="action-btn-text">取消</text>
+                </view>
+                <view class="action-btn action-btn-primary" @click="confirmCommit">
+                  <text class="action-btn-text">确定</text>
+                </view>
+              </view>
+            </view>
+          </u-popup>
+          <u-picker
+            :show="commitPickerShow"
+            :columns="[commitPickerColumns]"
+            keyName="label"
+            :defaultIndex="[selectedCommitIndex]"
+            @cancel="commitPickerShow = false"
+            @confirm="onCommitPickerConfirm"
           ></u-picker>
           <!-- 撤回 -->
           <u-popup
             :show="showretract"
-            :closeable="true"
-            :round="10"
-            mode="bottom"
+            mode="center"
+            :round="16"
+            :closeable="false"
             @close="close"
           >
-            <view>
-              <u--textarea
-                v-model="value1"
-                placeholder="请输入撤回原因"
-              ></u--textarea>
-            </view>
-            <view class="button-container">
-              <u-button @click="cancelRetract" class="fileBtn" shape="circle"
-                >取消</u-button
-              >
-              <u-button
-                @click="confirmRetract"
-                class="fileBtn"
-                shape="circle"
-                type="primary"
-                >确认</u-button
-              >
+            <view class="retract-modal">
+              <view class="retract-modal-header">
+                <text class="retract-modal-title">撤销申请</text>
+                <view class="retract-modal-close" @click="close">
+                  <image
+                    class="retract-close-icon"
+                    src="/static/filecenter/关闭.svg"
+                    mode="aspectFit"
+                  />
+                </view>
+              </view>
+              <view class="retract-modal-divider"></view>
+              <view class="retract-modal-body">
+                <view class="retract-textarea-wrap">
+                  <u--textarea
+                    v-model="value1"
+                    placeholder="请输入撤回原因"
+                    border="none"
+                  ></u--textarea>
+                </view>
+              </view>
+              <view class="retract-modal-footer">
+                <view class="action-btn action-btn-outline" @click="cancelRetract">
+                  <text class="action-btn-text">取消</text>
+                </view>
+                <view class="action-btn action-btn-primary" @click="confirmRetract">
+                  <text class="action-btn-text">确定</text>
+                </view>
+              </view>
             </view>
           </u-popup>
           <u-notify
@@ -315,7 +432,6 @@ export default {
       fileData: [],
       bpmStatus: 1, //1处理中  2 已完成  3 已驳回
       show: false, //删除modal
-      content: "确定要删除吗？",
       selectItem: "", //选择文件
       showretract: false, //撤回popup
       value1: "", //撤回原因
@@ -323,7 +439,9 @@ export default {
       detailShow: false, //详情
       notifyShow: false, //撤回文件提示消息显示
       commitShow: false, //提交
+      commitPickerShow: false,
       columns: [],
+      selectedCommitIndex: 0,
       commitItem: "", //提交文件
       selectFile: [],
       tableData: [], //审批内容
@@ -336,8 +454,36 @@ export default {
   mounted() {
     this.getFileInfo();
   },
-  computed: {},
+  computed: {
+    commitPickerColumns() {
+      return (this.selectFile || []).map((item, index) => ({
+        label:
+          item.name ||
+          item.processName ||
+          item.procDefName ||
+          `审批流程${index + 1}`,
+        value: item.id,
+      }));
+    },
+    selectedCommitName() {
+      if (!this.commitPickerColumns.length) {
+        return "请选择审批";
+      }
+      const item = this.commitPickerColumns[this.selectedCommitIndex];
+      return item ? item.label : "请选择审批";
+    },
+  },
   methods: {
+    goBack() {
+      uni.navigateBack({
+        delta: 1,
+        fail() {
+          uni.switchTab({
+            url: "/pages/index/index",
+          });
+        },
+      });
+    },
     // fileTreeShow(e) {
     //   this.menushow = !this.menushow;
     // },
@@ -504,6 +650,7 @@ export default {
     },
     //撤回文件
     retractmodal(data) {
+      this.value1 = "";
       this.showretract = true;
       this.cancelItem = data;
     },
@@ -514,7 +661,6 @@ export default {
       this.showretract = false;
     },
     confirmRetract() {
-      this.value1 = "";
       var fileiId = this.cancelItem.id;
       var params = {
         tableId: fileiId,
@@ -594,6 +740,7 @@ export default {
     },
     // 提交
     commitmodal(data) {
+      this.selectedCommitIndex = 0;
       this.commitShow = true;
       this.commitItem = data;
       this.getListFile();
@@ -612,10 +759,11 @@ export default {
           .getListFile(params)
           .then((response) => {
             if (response.data.code == 200) {
-              this.selectFile = response.data.result;
+              this.selectFile = response.data.result || [];
+              this.columns = [];
+              this.selectedCommitIndex = 0;
               this.selectFile.forEach((item) => {
                 this.columns.push(item.id);
-                console.log(this.columns);
               });
             } else {
               // console.log("请求下载文件失败：", err);
@@ -626,9 +774,32 @@ export default {
           });
       });
     },
+    openCommitPicker() {
+      if (!this.commitPickerColumns.length) {
+        uni.showToast({
+          title: "暂无审批流程",
+          icon: "none",
+        });
+        return;
+      }
+      this.commitPickerShow = true;
+    },
+    onCommitPickerConfirm(e) {
+      this.commitPickerShow = false;
+      const selected = e.value && e.value[0];
+      if (!selected) {
+        return;
+      }
+      const index = this.commitPickerColumns.findIndex(
+        (item) => item.value === selected.value
+      );
+      this.selectedCommitIndex =
+        index >= 0 ? index : e.indexs && e.indexs[0] !== undefined ? e.indexs[0] : 0;
+    },
     confirmCommit() {
       var fileiId = this.commitItem.id;
-      var reqDefId = this.columns[0];
+      const selected = this.commitPickerColumns[this.selectedCommitIndex];
+      var reqDefId = (selected && selected.value) || this.columns[0];
       var params = {
         tableId: fileiId,
         procDefId: reqDefId,
@@ -640,6 +811,7 @@ export default {
           .then((response) => {
             if (response.data.code == 200) {
               this.commitShow = false;
+              this.commitPickerShow = false;
               this.getFileInfo();
             } else {
               // console.log("请求下载文件失败：", err);
@@ -652,206 +824,681 @@ export default {
     },
     cancelCommit() {
       this.commitShow = false;
+      this.commitPickerShow = false;
     },
   },
 };
 </script>
 
-<style scoped>
-.fileBtn {
-  background: linear-gradient(to right, #338afe, #07b4ff, #338afe);
-  border-radius: 5px;
+<style lang="scss" scoped>
+// .file-page {
+//   min-height: 100vh;
+//   background: linear-gradient(180deg, #c8d8f8 0%, #f4f7fd 280rpx, #f4f7fd 100%);
+// }
+
+.file-page-content {
+  padding-top: 50px;
+  // min-height: calc(100vh - 50px);
+}
+
+.file-tab-bar {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding: 16rpx 32rpx 0;
+}
+
+.file-tab-item {
+  position: relative;
+  margin-right: 48rpx;
+  padding-bottom: 16rpx;
 }
-.fileInput {
-  border: 1px solid #2a94ff !important;
+
+.file-tab-text {
+  font-size: 28rpx;
+  color: #000;
+  line-height: 1.4;
 }
-.text-info {
-  margin: 20rpx 20rpx;
-  font-size: 14px;
-  font-weight: 500;
-  color: #657497;
+
+.file-tab-item.active .file-tab-text {
+  color: #0065f8;
+  font-weight: 600;
 }
-.fileTitle {
-  margin-right: 20px;
-  line-height: 40px;
+
+.file-tab-line {
+  position: absolute;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  height: 6rpx;
+  border-radius: 3rpx;
+  background: #0065f8;
 }
-.fileArea,
-.pickerArea {
+
+.file-main {
+  height: calc(100vh - 138px);
+  padding: 20rpx 24rpx;
+  box-sizing: border-box;
+  // overflow-y: auto;
+}
+
+.search-card {
+  background: #ffffff;
+  border-radius: 16rpx;
+  padding: 24rpx;
+  margin-bottom: 20rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
+}
+
+.search-row {
   display: flex;
   flex-direction: row;
-  justify-content: space-around;
+  align-items: center;
+  margin-bottom: 20rpx;
+}
+
+.search-label {
+  flex-shrink: 0;
+  width: 140rpx;
+  font-size: 28rpx;
+  color: #000;
+}
+
+.search-input {
+  flex: 1;
+  height: 72rpx;
+  padding: 0 24rpx !important;
+  border-radius: 12rpx;
+  background: #eef5ff !important;
 }
-.searchArea {
+
+.search-actions {
   display: flex;
-  flex-direction: column;
-  background-color: #ffffff;
-  margin-bottom: 10rpx;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10rpx;
 }
-.btns {
+
+.file-list {
   width: 100%;
+  height: calc(100% - 118px);
+  overflow-y: auto;
+}
+
+.file-card {
+  background: #f8fbff;
+  border-radius: 16rpx;
+  padding: 24rpx;
+  margin-bottom: 20rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.04);
+}
+
+.file-card-header {
+  margin-bottom: 16rpx;
+}
+
+.file-card-title {
+  font-size: 28rpx;
+  font-weight: 700;
+  color: #000;
+  line-height: 1.4;
+  word-break: break-all;
+}
+
+.file-action-row {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  gap: 10rpx;
+  margin-bottom: 20rpx;
+}
+
+.action-btn {
+  flex: 1;
+  min-width: 0;
+  height: 56rpx;
+  border-radius: 8rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  padding: 0 8rpx;
+}
+
+.action-btn-text {
+  font-size: 24rpx;
+  font-weight: 500;
+  line-height: 1;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  max-width: 100%;
+}
+
+.action-btn-primary {
+  background: #0065f8;
+}
+
+.action-btn-primary .action-btn-text {
+  color: #ffffff;
+}
+
+.action-btn-outline {
+  background: #ffffff;
+  border: 1rpx solid #0065f8;
+}
+
+.action-btn-outline .action-btn-text {
+  color: #0065f8;
+}
+
+.file-info-grid {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  margin: 0 -6rpx;
+}
+
+.file-info-card {
+  width: calc(50% - 12rpx);
+  margin: 6rpx;
+  padding: 16rpx 12rpx;
+  box-sizing: border-box;
+  border-radius: 12rpx;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  background: linear-gradient(
+    135deg,
+    rgba(175, 195, 252, 0.55) 0%,
+    rgba(238, 245, 255, 0.35) 100%
+  );
+}
+
+.file-info-icon-box {
+  width: 56rpx;
+  height: 56rpx;
+  border-radius: 10rpx;
+  background: linear-gradient(135deg, #4d9dff 0%, #2b7cff 100%);
+  box-shadow: 0 4rpx 10rpx rgba(43, 124, 255, 0.22);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  margin-right: 12rpx;
+}
+
+.file-info-icon {
+  width: 32rpx;
+  height: 32rpx;
+}
+
+.file-info-content {
+  flex: 1;
+  min-width: 0;
+}
+
+.file-info-value {
+  display: block;
+  font-size: 24rpx;
+  font-weight: 700;
+  color: #0065f8;
+  line-height: 1.3;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.file-info-label {
+  display: block;
+  margin-top: 6rpx;
+  font-size: 24rpx;
+  color: #000;
+  line-height: 1.3;
+}
+
+.retract-modal {
+  width: 620rpx;
+  background: #ffffff;
+  border-radius: 16rpx;
+  overflow: hidden;
+  padding-bottom: 28rpx;
+  box-sizing: border-box;
+}
+
+.retract-modal-header {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  padding: 28rpx 28rpx 20rpx;
+}
+
+.retract-modal-title {
+  font-size: 32rpx;
+  font-weight: 700;
+  color: #1a1a1a;
+}
+
+.retract-modal-close {
+  width: 44rpx;
+  height: 44rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.retract-close-icon {
+  width: 28rpx;
+  height: 28rpx;
+}
+
+.retract-modal-divider {
+  height: 1rpx;
+  background: #eef0f4;
+  margin: 0 24rpx;
+}
+
+.retract-modal-body {
+  padding: 24rpx 28rpx;
+}
+
+.retract-textarea-wrap {
+  border: 1rpx solid #2b7cff;
+  border-radius: 8rpx;
+  overflow: hidden;
+  min-height: 200rpx;
+  background: #ffffff;
+}
+
+.retract-modal-footer {
   display: flex;
   flex-direction: row;
-  justify-content: space-around;
+  align-items: center;
+  justify-content: space-between;
+  gap: 20rpx;
+  padding: 0 28rpx;
+}
+
+.retract-modal-footer .action-btn {
+  flex: 1;
+  height: 64rpx;
+}
+
+.delete-modal {
+  width: 620rpx;
+  background: #ffffff;
+  border-radius: 16rpx;
+  overflow: hidden;
+  padding-bottom: 28rpx;
+  box-sizing: border-box;
 }
-.button-container {
+
+.delete-modal-header {
   display: flex;
+  flex-direction: row;
+  align-items: center;
   justify-content: space-between;
-  margin-top: 10px; /* 根据需要调整 */
+  padding: 28rpx 28rpx 20rpx;
+}
+
+.delete-modal-title {
+  font-size: 32rpx;
+  font-weight: 700;
+  color: #1a1a1a;
 }
-button {
-  /* 样式可以根据需要自定义 */
-  padding: 10px 20px;
-  background-color: #007aff;
-  color: white;
-  border: none;
-  border-radius: 5px;
-  cursor: pointer;
+
+.delete-modal-close {
+  width: 44rpx;
+  height: 44rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
-.container {
-  margin-top: 30px;
+
+.delete-close-icon {
+  width: 28rpx;
+  height: 28rpx;
+}
+
+.delete-modal-divider {
+  height: 1rpx;
+  background: #eef0f4;
+  margin: 0 24rpx;
 }
-.main {
+
+.delete-modal-body {
+  padding: 24rpx 28rpx;
+}
+
+.delete-confirm-box {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
+  gap: 16rpx;
+  padding: 40rpx 24rpx;
+  background: #f0f4ff;
+  border-radius: 8rpx;
+}
+
+.delete-confirm-icon {
+  width: 48rpx;
+  height: 52rpx;
+  flex-shrink: 0;
+}
+
+.delete-confirm-text {
+  font-size: 28rpx;
+  color: #1a1a1a;
+}
+
+.delete-modal-footer {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  gap: 20rpx;
+  padding: 0 28rpx;
+}
+
+.delete-modal-footer .action-btn {
+  flex: 1;
+  height: 64rpx;
+}
+
+.commit-modal {
+  width: 620rpx;
+  background: #ffffff;
+  border-radius: 16rpx;
+  overflow: hidden;
+  padding-bottom: 28rpx;
+  box-sizing: border-box;
+}
+
+.commit-modal-header {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  padding: 28rpx 28rpx 20rpx;
+}
+
+.commit-modal-title {
+  font-size: 32rpx;
+  font-weight: 700;
+  color: #1a1a1a;
+}
+
+.commit-modal-close {
+  width: 44rpx;
+  height: 44rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.commit-close-icon {
+  width: 28rpx;
+  height: 28rpx;
+}
+
+.commit-modal-divider {
+  height: 1rpx;
+  background: #eef0f4;
+  margin: 0 24rpx;
+}
+
+.commit-modal-body {
+  padding: 24rpx 28rpx;
+}
+
+.commit-form-box {
+  background: #f0f4ff;
+  border-radius: 8rpx;
+  padding: 32rpx 24rpx;
+}
+
+.commit-form-row {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  gap: 16rpx;
+}
+
+.commit-form-label {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  flex-shrink: 0;
+  font-size: 28rpx;
+  color: #1a1a1a;
+}
+
+.commit-required {
+  color: #ff4d4f;
+  margin-right: 4rpx;
+}
+
+.commit-select {
+  flex: 1;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  height: 64rpx;
+  padding: 0 20rpx;
+  background: #ffffff;
+  border: 1rpx solid #2b7cff;
+  border-radius: 8rpx;
+  box-sizing: border-box;
+}
+
+.commit-select-text {
+  flex: 1;
+  font-size: 26rpx;
+  color: #333333;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.commit-select-arrow {
+  width: 0;
+  height: 0;
+  margin-left: 12rpx;
+  border-left: 10rpx solid transparent;
+  border-right: 10rpx solid transparent;
+  border-top: 12rpx solid #2b7cff;
+  flex-shrink: 0;
+}
+
+.commit-modal-footer {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  gap: 20rpx;
+  padding: 0 28rpx;
+}
+
+.commit-modal-footer .action-btn {
+  flex: 1;
+  height: 64rpx;
+}
+
+.detail-modal {
+  width: 680rpx;
+  max-height: 80vh;
+  background: #ffffff;
+  border-radius: 16rpx;
+  overflow: hidden;
+  box-sizing: border-box;
   display: flex;
   flex-direction: column;
 }
 
-.itemback {
-  padding: 20rpx;
-  background-color: #ffffff;
-  margin-bottom: 10rpx;
+.detail-modal-header {
   display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  padding: 28rpx 28rpx 20rpx;
+  flex-shrink: 0;
+}
+
+.detail-modal-title {
+  font-size: 32rpx;
+  font-weight: 700;
+  color: #1a1a1a;
 }
-.btnClass {
+
+.detail-modal-close {
+  width: 44rpx;
+  height: 44rpx;
   display: flex;
-  justify-content: space-around;
-  margin-top: 20rpx;
+  align-items: center;
+  justify-content: center;
 }
-.btn {
-  background: linear-gradient(to right, #338afe, #07b4ff, #338afe);
-  border-radius: 5px;
-  border-radius: 10rpx;
-  margin-right: 10rpx; /* 示例：添加一些右外边距，但确保它不会导致换行 */
-}
-/* 最后一个按钮不需要右外边距 */
-.btn:last-child {
-  margin-right: 0;
-}
-.text-style {
-  color: #3787fe;
-  font-size: 16px;
-  font-weight: bold;
-}
-.text-style1 {
-  color: #000000;
-  font-size: large;
-  font-weight: bold;
-}
-.datacard {
-  width: 48%;
-  margin: 1%;
-  float: left;
-  height: 120rpx;
-  border-radius: 10px;
-}
-.time {
-  background: url(/static/filecenter/time.png),
-    linear-gradient(
-      to right,
-      rgba(55, 135, 254, 0.08),
-      rgba(4, 184, 255, 0.08),
-      rgba(60, 161, 237, 0.08)
-    );
-  background-size: auto 100%;
-  background-position: right;
-  background-repeat: no-repeat;
-}
-.laiyuan {
-  background: url(/static/filecenter/laiyuan.png),
-    linear-gradient(
-      to right,
-      rgba(55, 135, 254, 0.08),
-      rgba(4, 184, 255, 0.08),
-      rgba(60, 161, 237, 0.08)
-    );
-  background-size: auto 100%;
-  background-position: right;
-  background-repeat: no-repeat;
-}
-.user {
-  background: url(/static/filecenter/user.png),
-    linear-gradient(
-      to right,
-      rgba(55, 135, 254, 0.08),
-      rgba(4, 184, 255, 0.08),
-      rgba(60, 161, 237, 0.08)
-    );
-  background-size: auto 100%;
-  background-position: right;
-  background-repeat: no-repeat;
-}
-.zhuangtai {
-  background: url(/static/filecenter/zhuangtai.png),
-    linear-gradient(
-      to right,
-      rgba(55, 135, 254, 0.08),
-      rgba(4, 184, 255, 0.08),
-      rgba(60, 161, 237, 0.08)
-    );
-  background-size: auto 100%;
-  background-position: right;
-  background-repeat: no-repeat;
-}
-.datacard1 {
-  width: 100%;
-  margin: 1%;
-  float: left;
-  height: 100rpx;
-  text-align: center;
-  border-radius: 10px;
+
+.detail-close-icon {
+  width: 28rpx;
+  height: 28rpx;
+}
+
+.detail-modal-divider {
+  height: 1rpx;
+  background: #eef0f4;
+  margin: 0 24rpx;
+  flex-shrink: 0;
+}
+
+.detail-modal-body {
+  flex: 1;
+  max-height: calc(80vh - 100rpx);
+  padding: 24rpx 28rpx 28rpx;
+  box-sizing: border-box;
+}
+
+.detail-section {
+  margin-bottom: 32rpx;
+}
+
+.detail-section:last-child {
+  margin-bottom: 0;
+}
+
+.detail-section-title {
+  position: relative;
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  padding: 8rpx 0 20rpx;
+}
+
+.detail-section-title::before {
+  content: "";
+  position: absolute;
+  left: 0;
+  right: 0;
+  top: 50%;
+  transform: translateY(-50%);
+  height: 28rpx;
   background: linear-gradient(
-    to right,
-    rgba(55, 135, 254, 0.08),
-    rgba(4, 184, 255, 0.08),
-    rgba(60, 161, 237, 0.08)
+    90deg,
+    rgba(43, 124, 255, 0.18) 0%,
+    rgba(43, 124, 255, 0) 75%
   );
+  border-radius: 4rpx;
+  z-index: 0;
 }
-.title {
-  width: 100%;
-  height: 50rpx;
-  background: url(/static/warndata/title.png);
-  background-repeat: no-repeat;
-  background-size: 100% 100%;
-  display: flex; /* 将父级元素设置为 Flex 容器 */
-  align-items: center; /* 垂直居中子元素 */
-}
-.firetext {
-  margin: 20px;
-  font-weight: bold;
+
+.detail-section-prefix {
+  position: relative;
+  z-index: 1;
+  font-size: 28rpx;
+  font-weight: 700;
+  color: #2b7cff;
+  margin-right: 8rpx;
+  font-style: italic;
 }
-.custom-header-class {
-  background-color: #f8f8f8;
-  color: #333;
+
+.detail-section-text {
+  position: relative;
+  z-index: 1;
+  font-size: 28rpx;
+  font-weight: 700;
+  color: #1a1a1a;
 }
 
-.table-container {
-  overflow-x: auto; /* 允许横向滚动 */
+.detail-table-container {
+  overflow-x: auto;
+  border: 1rpx solid #b8d4ff;
+  border-radius: 8rpx;
 }
-.table {
-  width: 100%;
-  margin: 10px;
-  width: max-content; /* 或者设置一个足够大的宽度以容纳所有列 */
+
+.detail-table {
+  width: max-content;
+  min-width: 100%;
   display: flex;
   flex-direction: column;
 }
-.table-header,
-.table-row {
-  display: flex; /* 启用Flex布局 */
+
+.detail-table-header,
+.detail-table-row {
+  display: flex;
+  flex-direction: row;
+}
+
+.detail-table-header {
+  background: #e8f1ff;
+}
+
+.detail-table-header .detail-table-cell {
+  color: #2b7cff;
+  font-weight: 600;
+  background: #e8f1ff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.detail-table-row {
+  background: #ffffff;
 }
 
-.table-cell {
-  padding: 8px;
+.detail-table-cell {
   flex: 1;
+  min-width: 140rpx;
+  padding: 16rpx 12rpx;
+  font-size: 24rpx;
+  color: #333333;
   text-align: center;
-  border: 1px solid #ccc; /* 底部边框 */
+  border-right: 1rpx solid #b8d4ff;
+  border-bottom: 1rpx solid #b8d4ff;
+  box-sizing: border-box;
+  word-break: break-all;
+}
+
+.detail-table-cell:last-child {
+  border-right: none;
+}
+
+.detail-table-row:last-child .detail-table-cell {
+  border-bottom: none;
+}
+
+.detail-flowchart-wrap {
+  background: #f0f5ff;
+  border-radius: 8rpx;
+  padding: 24rpx;
+  overflow: hidden;
+}
+
+.detail-flowchart-img {
+  width: 100%;
+  display: block;
 }
 </style>

pages/gasreport/components/gasImgIdentify.vue

@@ -150,7 +150,7 @@
 import api from "@/api/api";
 import moment from "moment";
 import configService from "@/common/service/config.service.js";
-import { RHFselcet } from "@/uni_modules/fz-media-selcet";
+// import { RHFselcet } from "@/uni_modules/fz-media-selcet";
 import helangCompress from "@/components/helang-compress/helang-compress";
 export default {
   name: "gasFill",

pages/home/detail/autodoor/autodoor copy.vue

@@ -0,0 +1,1239 @@
+<template>
+  <view style="overflow: auto; height: 100%">
+    <!-- 建议放在外层 -->
+    <u-navbar
+      :title="name"
+      @leftClick="backPage"
+      :bgImage="backPic"
+      :bgStatusImage="backPic0"
+    >
+      <view class="u-nav-slot" slot="left">
+        <u-icon name="arrow-left" size="20"> </u-icon>
+      </view>
+    </u-navbar>
+    <view class="main">
+      <view class="u-page container">
+        <!-- <div class="button-grid flcard" v-if="this.TabCur == 'gate'">
+          <u-button
+            type="primary"
+            text="打开前门"
+            @click="showPasswordDialog('frontGateOpen_S')"
+          ></u-button>
+          <u-button
+            type="primary"
+            text="关闭前门"
+            @click="showPasswordDialog('frontGateClose_S')"
+          ></u-button>
+          <u-button
+            type="primary"
+            text="打开后门"
+            @click="showPasswordDialog('rearGateOpen_S')"
+          ></u-button>
+          <u-button
+            type="primary"
+            text="关闭后门"
+            @click="showPasswordDialog('rearGateClose_S')"
+          ></u-button>
+          <u-button
+            type="primary"
+            text="打开前后门"
+            @click="showPasswordDialog('sameTimeOpen')"
+          ></u-button>
+          <u-button
+            type="primary"
+            text="关闭前后门"
+            @click="showPasswordDialog('sameTimeClose')"
+          ></u-button>
+        </div>
+        <div
+          class="button-grid flcard"
+          v-if="this.TabCur == 'window' && this.nwindownum == 1"
+        >
+          <u-button
+            type="primary"
+            text="设定面积"
+            @click="showPasswordDialog('frontSetValue')"
+          ></u-button>
+        </div>
+        <div
+          class="button-grid flcard"
+          v-if="this.TabCur == 'window' && this.nwindownum == 2"
+        >
+          <u-button
+            type="primary"
+            text="设定前窗面积"
+            @click="showPasswordDialog('frontSetValue')"
+          ></u-button>
+          <u-button
+            type="primary"
+            text="设定后窗面积"
+            @click="showPasswordDialog('rearSetValue')"
+          ></u-button>
+        </div> -->
+        <div class="flcard deviceback" v-if="this.TabCur == 'gate'">
+          <doorAnimate
+            :gatestate1="frontGateStatus"
+            :gatestate2="midGateStatus"
+            :gatestate3="rearGateStatus"
+            :height="height"
+            :doorcount="ndoorcount"
+          >
+          </doorAnimate>
+        </div>
+        <div class="flcard deviceback" v-if="this.TabCur == 'windrect'">
+          <windrectAnimate
+            :state="state"
+            :title="title"
+            :height="height"
+            :type="deviceType"
+          >
+          </windrectAnimate>
+        </div>
+        <div class="flcard deviceback" v-if="this.TabCur == 'fanlocal'">
+          <fanlocalAnimate
+            :fan1State="fan1State"
+            :fan2State="fan2State"
+            :title="title"
+            :height="height"
+          >
+          </fanlocalAnimate>
+        </div>
+        <div class="flcard deviceback" v-if="this.TabCur == 'fanmain'">
+          <fanmainAnimate
+            ref="fanpage"
+            style="width: 100%"
+            :door1="door1"
+            :topdoor1="topdoor1"
+            :fundoor1="fundoor1"
+            :door2="door2"
+            :topdoor2="topdoor2"
+            :fundoor2="fundoor2"
+            :nowfengji="qidongfengji"
+          ></fanmainAnimate>
+        </div>
+        <div class="flcard deviceback" v-if="this.TabCur == 'window'">
+          <windowAnimate
+            :windowAngle="windowAngle"
+            :windowAngle1="windowAngle1"
+            :height="height"
+            :windowcount="nwindownum"
+          ></windowAnimate>
+        </div>
+        <div v-if="this.cameraList.length > 0">
+          <div
+            class="flcard deviceback"
+            v-for="(item, index) in cameraList"
+            :key="index"
+          >
+            <yingbing-video
+              v-if="item.devicekind == 'flv'"
+              style="width: 100%; height: 250px"
+              :src="item.addr"
+              autoplay
+              muted
+            ></yingbing-video>
+            <video
+              v-else
+              style="width: 100%; height: 250px"
+              id="myVideo"
+              controls
+              show-loading
+              autoplay
+              class="r-video"
+              :vslide-gesture="true"
+              :vslide-gesture-in-fullscreen="true"
+              :src="item.addr"
+            ></video>
+          </div>
+        </div>
+        <div class="flcard">
+          <div
+            class="flex-container"
+            v-if="TabCur != 'fanlocal' && TabCur != 'fanmain'"
+          >
+            <view
+              class="datacard"
+              v-for="(item, index) in deviceShowList"
+              :key="index"
+              v-show="
+                item.appShow == 1 &&
+                item.monitorcode != 'strinstallpos' &&
+                item.monitorcode != 'netStatus' &&
+                item.monitorcode != 'warnFlag' &&
+                item.monitorcode != 'readTime' &&
+                item.monitorcode != ''
+              "
+            >
+              <view
+                class="TabCurCSS"
+                style="
+                  padding-top: 10rpx;
+                  padding-bottom: 10rpx;
+                  display: flex;
+                  flex-direction: column;
+                  height: 100%;
+                "
+              >
+                <view
+                  v-if="item.datatype == 1 && item.monitorcode == 'doorUse'"
+                  class="demo-layout bg-purple-light"
+                  style="
+                    color: #3787fe;
+                    font-size: 30rpx;
+                    font-weight: bold;
+                    margin-left: 20rpx;
+                    text-align: left;
+                  "
+                >
+                  {{
+                    tableData[item.monitorcode] == "2"
+                      ? "行人"
+                      : tableData[item.monitorcode] == "1"
+                      ? "行车"
+                      : "-"
+                  }}
+                </view>
+                <view
+                  v-else-if="item.datatype == 1"
+                  class="demo-layout bg-purple-light"
+                  style="
+                    color: #3787fe;
+                    font-size: 30rpx;
+                    font-weight: bold;
+                    margin-left: 20rpx;
+                    text-align: left;
+                  "
+                >
+                  {{
+                    tableData[item.monitorcode] != undefined &&
+                    tableData[item.monitorcode] != null
+                      ? tableData[item.monitorcode]
+                      : "-"
+                  }}
+                </view>
+                <view
+                  v-else-if="item.datatype == 2"
+                  class="demo-layout bg-purple-light"
+                  style="
+                    color: #3787fe;
+                    font-size: 30rpx;
+                    font-weight: bold;
+                    margin-left: 20rpx;
+                    text-align: left;
+                  "
+                >
+                  {{
+                    tableData[item.monitorcode] != undefined &&
+                    tableData[item.monitorcode] != null
+                      ? tableData[item.monitorcode]
+                      : "-"
+                  }}
+                </view>
+                <view
+                  class="demo-layout bg-purple-light"
+                  style="
+                    margin-top: 20rpx;
+                    color: #677799;
+                    margin-left: 20rpx;
+                    text-align: left;
+                  "
+                >
+                  {{ item.des }}
+                </view>
+              </view>
+              <!-- <div class="right-content"></div> -->
+            </view>
+          </div>
+          <div class="flex-container" v-else-if="TabCur == 'fanmain'">
+            <div class="monitor-content">
+              <div class="zhuji">
+                <div>主机</div>
+                <div
+                  class="itemback"
+                  v-for="(item, index) in deviceShowList1"
+                  :key="index"
+                  v-show="item.appShow == 1"
+                >
+                  <div
+                    class="datacardtime"
+                    v-if="item.monitorcode == 'readTime' && item.datatype == 1"
+                  >
+                    <view
+                      class="demo-layout bg-purple-light"
+                      style="padding: 20rpx; color: #3787fe"
+                    >
+                      {{ readTime }}
+                    </view>
+                  </div>
+                  <div class="datacard" v-if="item.monitorcode !== 'readTime'">
+                    <div class="TabCurCSS">
+                      <view
+                        v-if="
+                          item.monitorcode == 'netStatus' && item.datatype == 1
+                        "
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{ doorNetStatus == "1" ? "正常" : "异常" }}
+                      </view>
+                      <view
+                        v-else-if="item.datatype == 1"
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan1")
+                              : item.monitorcode
+                          ] !== undefined &&
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan1")
+                              : item.monitorcode
+                          ] !== null
+                            ? tableData[
+                                item.monitorcode.startsWith("Fan")
+                                  ? item.monitorcode.replace(/^Fan/, "Fan1")
+                                  : item.monitorcode
+                              ]
+                            : "-"
+                        }}
+                      </view>
+                      <view
+                        v-else-if="item.datatype == 2"
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan1")
+                              : item.monitorcode
+                          ] !== undefined &&
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan1")
+                              : item.monitorcode
+                          ] !== null
+                            ? tableData[
+                                item.monitorcode.startsWith("Fan")
+                                  ? item.monitorcode.replace(/^Fan/, "Fan1")
+                                  : item.monitorcode
+                              ]
+                            : "-"
+                        }}
+                      </view>
+                      <div class="spacer"></div>
+                      <!-- 间距 -->
+                      <view
+                        class="demo-layout bg-purple-light"
+                        style="color: #677799"
+                      >
+                        {{ item.des }}
+                      </view>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div class="beiji">
+                <div>备机</div>
+                <div
+                  class="itemback"
+                  v-for="(item, index) in deviceShowList1"
+                  :key="index"
+                  v-show="item.appShow == 1"
+                >
+                  <div
+                    class="datacardtime"
+                    v-if="item.monitorcode == 'readTime' && item.datatype == 1"
+                  >
+                    <view
+                      class="demo-layout bg-purple-light"
+                      style="padding: 20rpx; color: #3787fe"
+                    >
+                      {{ readTime }}
+                    </view>
+                  </div>
+                  <div class="datacard" v-if="item.monitorcode !== 'readTime'">
+                    <div class="TabCurCSS">
+                      <view
+                        v-if="
+                          item.monitorcode == 'netStatus' && item.datatype == 1
+                        "
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{ doorNetStatus == "1" ? "正常" : "异常" }}
+                      </view>
+                      <view
+                        v-else-if="item.datatype == 1"
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan2")
+                              : item.monitorcode
+                          ] !== undefined &&
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan2")
+                              : item.monitorcode
+                          ] !== null
+                            ? tableData[
+                                item.monitorcode.startsWith("Fan")
+                                  ? item.monitorcode.replace(/^Fan/, "Fan2")
+                                  : item.monitorcode
+                              ]
+                            : "-"
+                        }}
+                      </view>
+                      <view
+                        v-else-if="item.datatype == 2"
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan2")
+                              : item.monitorcode
+                          ] !== undefined &&
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan2")
+                              : item.monitorcode
+                          ] !== null
+                            ? tableData[
+                                item.monitorcode.startsWith("Fan")
+                                  ? item.monitorcode.replace(/^Fan/, "Fan2")
+                                  : item.monitorcode
+                              ]
+                            : "-"
+                        }}
+                      </view>
+                      <div class="spacer"></div>
+                      <!-- 间距 -->
+                      <view
+                        class="demo-layout bg-purple-light"
+                        style="color: #677799"
+                      >
+                        {{ item.des }}
+                      </view>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="flex-container" v-else-if="TabCur == 'fanlocal'">
+            <div class="monitor-content">
+              <div class="zhuji">
+                <div>主机</div>
+                <div
+                  class="itemback"
+                  v-for="(item, index) in deviceShowList1"
+                  :key="index"
+                  v-show="item.appShow == 1"
+                >
+                  <div
+                    class="datacardtime"
+                    v-if="item.monitorcode == 'readTime' && item.datatype == 1"
+                  >
+                    <view
+                      class="demo-layout bg-purple-light"
+                      style="padding: 20rpx; color: #3787fe"
+                    >
+                      {{ readTime }}
+                    </view>
+                  </div>
+                  <div class="datacard" v-if="item.monitorcode !== 'readTime'">
+                    <div class="TabCurCSS">
+                      <view
+                        v-if="
+                          item.monitorcode == 'netStatus' && item.datatype == 1
+                        "
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{ doorNetStatus == "1" ? "正常" : "异常" }}
+                      </view>
+                      <view
+                        v-else-if="item.datatype == 1"
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan1")
+                              : item.monitorcode
+                          ] !== undefined &&
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan1")
+                              : item.monitorcode
+                          ] !== null
+                            ? tableData[
+                                item.monitorcode.startsWith("Fan")
+                                  ? item.monitorcode.replace(/^Fan/, "Fan1")
+                                  : item.monitorcode
+                              ]
+                            : "-"
+                        }}
+                      </view>
+                      <view
+                        v-else-if="item.datatype == 2"
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan1")
+                              : item.monitorcode
+                          ] !== undefined &&
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan1")
+                              : item.monitorcode
+                          ] !== null
+                            ? tableData[
+                                item.monitorcode.startsWith("Fan")
+                                  ? item.monitorcode.replace(/^Fan/, "Fan1")
+                                  : item.monitorcode
+                              ]
+                            : "-"
+                        }}
+                      </view>
+                      <div class="spacer"></div>
+                      <!-- 间距 -->
+                      <view
+                        class="demo-layout bg-purple-light"
+                        style="color: #677799"
+                      >
+                        {{ item.des }}
+                      </view>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div class="beiji">
+                <div>备机</div>
+                <div
+                  class="itemback"
+                  v-for="(item, index) in deviceShowList1"
+                  :key="index"
+                  v-show="item.appShow == 1"
+                >
+                  <div
+                    class="datacardtime"
+                    v-if="item.monitorcode == 'readTime' && item.datatype == 1"
+                  >
+                    <view
+                      class="demo-layout bg-purple-light"
+                      style="padding: 20rpx; color: #3787fe"
+                    >
+                      {{ readTime }}
+                    </view>
+                  </div>
+                  <div class="datacard" v-if="item.monitorcode !== 'readTime'">
+                    <div class="TabCurCSS">
+                      <view
+                        v-if="
+                          item.monitorcode == 'netStatus' && item.datatype == 1
+                        "
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{ doorNetStatus == "1" ? "正常" : "异常" }}
+                      </view>
+                      <view
+                        v-else-if="item.datatype == 1"
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan2")
+                              : item.monitorcode
+                          ] !== undefined &&
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan2")
+                              : item.monitorcode
+                          ] !== null
+                            ? tableData[
+                                item.monitorcode.startsWith("Fan")
+                                  ? item.monitorcode.replace(/^Fan/, "Fan2")
+                                  : item.monitorcode
+                              ]
+                            : "-"
+                        }}
+                      </view>
+                      <view
+                        v-else-if="item.datatype == 2"
+                        class="demo-layout bg-purple-light"
+                        style="margin-top: 60rpx; color: #3787fe"
+                      >
+                        {{
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan2")
+                              : item.monitorcode
+                          ] !== undefined &&
+                          tableData[
+                            item.monitorcode.startsWith("Fan")
+                              ? item.monitorcode.replace(/^Fan/, "Fan2")
+                              : item.monitorcode
+                          ] !== null
+                            ? tableData[
+                                item.monitorcode.startsWith("Fan")
+                                  ? item.monitorcode.replace(/^Fan/, "Fan2")
+                                  : item.monitorcode
+                              ]
+                            : "-"
+                        }}
+                      </view>
+                      <div class="spacer"></div>
+                      <!-- 间距 -->
+                      <view
+                        class="demo-layout bg-purple-light"
+                        style="color: #677799"
+                      >
+                        {{ item.des }}
+                      </view>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </view>
+    </view>
+    <u-popup :show="show" mode="bottom" :safeAreaInsetBottom="false">
+      <div class="containers">
+        <view class="passWordName">
+          <view
+            class="title"
+            style="margin-top: 15px"
+            v-if="this.TabCur == 'window'"
+            >风窗面积</view
+          >
+          <u-input
+            class="passArea"
+            style="margin-top: 15px; border-color: #2a94ff"
+            v-model="windowArea"
+            type="text"
+            v-if="this.TabCur == 'window'"
+          ></u-input>
+        </view>
+        <view class="passWordInput">
+          <view style="margin-top: 15px" class="title">输入密码</view>
+          <u-input
+            style="margin-top: 15px; border-color: #2a94ff"
+            v-model="password"
+            type="password"
+          ></u-input
+        ></view>
+      </div>
+      <view class="btns">
+        <u-button
+          style="margin: 20px"
+          type="primary"
+          @click="confirmPassword()"
+          color="linear-gradient(to right, rgb(53, 138, 254), rgb(38, 171, 244))"
+          >确认</u-button
+        >
+        <u-button
+          style="margin: 20px"
+          type="primary"
+          :plain="true"
+          @click="cancelPassword()"
+          >取消</u-button
+        >
+      </view>
+    </u-popup>
+  </view>
+</template>
+
+<script>
+import api from "@/api/api";
+import initDictOptions from "@/common/util/dictUtil.js";
+import doorAnimate from "../doorAnimate/doorAnimate.vue";
+import windowAnimate from "../windowAnimate/windowAnimate.vue";
+import windrectAnimate from "../windrectAnimate/windrectAnimate.vue";
+import fanlocalAnimate from "../fanlocalAnimate/fanlocalAnimate2.vue";
+import fanmainAnimate from "../fanmainAnimate/fanmainAnimate.vue";
+export default {
+  data() {
+    return {
+      tableData: {}, //监测数据
+      typeList: [], //展示字段
+      itemId: "", // 初始化 itemId
+      name: "", // 初始化 name
+      deviceid: "", //初始化设备id
+      TabCur: "",
+      checked: [],
+      backPic0: "url(/static/topnavbar0.png)",
+      backPic: "url(/static/topnavbar.png)",
+      frontAngle: "", //风窗打开角度
+      nwindownum: "", //风窗道数
+      ndoorcount: "", //风门道数
+      deviceType: "", //设备类型
+      show: false, //密码弹窗是否显示
+      password: "", //控制设备密码
+      paramcode: "", //控制字段
+      height: "200px",
+      popupStyle: {
+        // 弹窗样式
+        "background-color": "#fff",
+        padding: "20px",
+        "box-shadow": "0 2px 4px rgba(0, 0, 0, 0.1)",
+      },
+      frontGateStatus: "", //前门状态
+      rearGateStatus: "", //后门状态
+      midGateStatus: "", //状态
+      doorNetStatus: "", //风门通信状态
+      warnFlag: "", //风门报警
+      readTime: "", //时间
+      windowAngle: 0, //前窗打开角度
+      windowAngle1: 0, //后窗打开角度
+      windowArea: "", //风窗面积设定值
+      sign: "",
+      title: "测风设备",
+      fan1State: "",
+      fan2State: "",
+      deviceid: "", //ID
+      cameras: [], //摄像头数据
+      cameraList: [], //摄像数据
+      showColum: {},
+      deviceShowList: [],
+      deviceShowList1: [],
+      isFirstRequest: true, // 是否是第一次请求
+      fanMsStatus: true,
+      qidongfengji: "1",
+      fanMsStatus: true, //true抽风，false反风
+      door1: 0, //风门1#      1打开 0 关闭
+      topdoor1: 0, //水平风门1#      1打开 0 关闭
+      fundoor1: 0, //蝶阀1#      1打开 0 关闭
+      door2: 0, //风门2#      1打开 0 关闭
+      topdoor2: 0, //水平风门2#      1打开 0 关闭
+      fundoor2: 0, //蝶阀2#      1打开 0 关闭
+    };
+  },
+  onLoad(query) {
+    //保存id到 data 中 可以在整个页面中使用
+    this.itemId = query.id;
+    this.name = query.name;
+    this.TabCur = query.type;
+    this.ndoorcount = 2;
+  },
+  components: {
+    doorAnimate,
+    windowAnimate,
+    windrectAnimate,
+    fanlocalAnimate,
+    fanmainAnimate,
+  },
+  created() {
+    if (this.isFirstRequest) {
+      this.getDeviceInfo(this.itemId);
+    }
+    this.getShowColum();
+  },
+  mounted() {
+    this.startTimer();
+  },
+  methods: {
+    startTimer() {
+      this.timer = setInterval(() => {
+        // 执行定时任务
+        this.getDeviceInfo(this.itemId);
+      }, 5000);
+    },
+    stopTimer() {
+      // 停止定时器
+      clearInterval(this.timer);
+    },
+    // 返回上一个页面
+    backPage() {
+      this.$destroy();
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+    getShowColum() {
+      new Promise((resolve, reject) => {
+        api
+          .getShowColum({})
+          .then((response) => {
+            if (response.data.code == 200) {
+              var showlist = response.data.result;
+              this.$store.commit("SET_SHOWCOLUM", showlist);
+              this.showColum = showlist;
+              let original = this.TabCur;
+              let newName = original.startsWith("sys_")
+                ? original.substring(4)
+                : original;
+              if (this.TabCur == "fanlocal") {
+                const key = this.TabCur + "_monitor_right";
+                const key1 = this.deviceType + "_monitor_right";
+                if (this.showColum?.[key1]?.length > 0) {
+                  this.deviceShowList1 = this.showColum[key1];
+                } else {
+                  this.deviceShowList1 = this.showColum[key] ?? [];
+                }
+              } else if (this.TabCur == "fanmain") {
+                const key = this.TabCur + "_monitor_left";
+                const key1 = this.deviceType + "_monitor_left";
+                if (this.showColum?.[key1]?.length > 0) {
+                  this.deviceShowList1 = this.showColum[key1];
+                } else {
+                  this.deviceShowList1 = this.showColum[key] ?? [];
+                }
+              } else {
+                const key = newName + "_monitor";
+                const key1 = this.deviceType + "_monitor";
+                if (this.showColum?.[key1]?.length > 0) {
+                  this.deviceShowList = this.showColum[key1];
+                } else {
+                  this.deviceShowList = this.showColum[key] ?? [];
+                }
+              }
+
+              // this.deviceShowList = this.showColum[key];
+            } else {
+              resolve(response);
+            }
+          })
+          .catch((error) => {
+            console.log("catch===>response", response);
+            reject(error);
+          });
+      });
+    },
+    //获取详情数据
+    getDeviceInfo(ID) {
+      let IDString = String(ID); // 将 ID 转换为字符串
+      new Promise((resolve, reject) => {
+        api
+          .getDeviceMonitor({ devicetype: this.TabCur, ids: IDString })
+          .then((response) => {
+            if (
+              response.data.code == 200 &&
+              response.data.result.msgTxt[0].datalist.length > 0
+            ) {
+              var result = response.data.result.msgTxt[0].datalist[0];
+              let newData = { ...result, ...result.readData };
+              this.tableData = newData;
+              if (this.isFirstRequest) {
+                this.cameras = result.cameras;
+                this.getVideoUrlById(this.cameras);
+                this.isFirstRequest = false; // 设置为 false，表示已经请求过数据
+              }
+              if (this.tableData["frontGateClose"] == "1") {
+                this.tableData.frontGateOpen = "关闭";
+              } else if (this.tableData["frontGateClose"] == "0") {
+                this.tableData.frontGateOpen = "打开";
+              } else {
+                this.tableData.frontGateOpen = "关闭";
+              }
+              if (this.tableData["midGateClose"] == "1") {
+                this.tableData.midGateOpen = "关闭";
+              } else if (this.tableData["midGateClose"] == "0") {
+                this.tableData.midGateOpen = "打开";
+              } else {
+                this.tableData.midGateOpen = "关闭";
+              }
+              if (this.tableData["rearGateClose"] == "1") {
+                this.tableData.rearGateOpen = "关闭";
+              } else if (this.tableData["rearGateClose"] == "0") {
+                this.tableData.rearGateOpen = "打开";
+              } else {
+                this.tableData.rearGateOpen = "关闭";
+              }
+              this.fan1State = result.readData.Fan1StartStatus;
+              this.fan2State = result.readData.Fan2StartStatus;
+              this.nwindownum = result.nwindownum;
+              this.ndoorcount = result.ndoorcount;
+              this.deviceType = result.deviceType;
+              this.state = result.readData.sign;
+              this.frontGateStatus = this.tableData.frontGateOpen;
+              this.midGateStatus = this.tableData.midGateOpen;
+              this.rearGateStatus = this.tableData.rearGateOpen;
+              this.doorNetStatus = result.netStatus;
+              this.warnFlag = result.warnLevel_str;
+              this.readTime = result.readTime;
+              this.qidongfengji =
+                result.readData.Fan1MOT2_RunningStatus1 == "1" ||
+                result.readData.Fan1StartStatus == "1"
+                  ? "1"
+                  : "2";
+              if (this.qidongfengji == "1") {
+                this.fundoor1 = 1;
+                this.door1 = 1;
+                this.topdoor1 = 0;
+                this.fundoor2 = 0;
+                this.door2 = 0;
+                this.topdoor2 = 0;
+              } else if (this.qidongfengji == "2") {
+                this.fundoor1 = 0;
+                this.door1 = 0;
+                this.topdoor1 = 0;
+                this.fundoor2 = 1;
+                this.door2 = 1;
+                this.topdoor2 = 0;
+              }
+              this.$refs.fanpage.setQidongfengji(this.qidongfengji);
+              var maxarea = result.maxarea;
+              this.windowAngle =
+                (this.tableData.forntArea / maxarea) * 100 * 0.9;
+              this.windowAngle1 =
+                (this.tableData.rearArea / maxarea) * 100 * 0.9;
+              this.deviceid = result.deviceID;
+              this.$forceUpdate();
+            } else {
+              resolve(response);
+            }
+          })
+          .catch((error) => {
+            reject(error);
+          });
+      });
+    },
+    //获取监控URL 通过ID获取
+    getVideoUrlById(data) {
+      this.cameraList = []; // 清空摄像头列表
+      data.forEach((item) => {
+        const isHttp =
+          item.addr?.startsWith("http://") || item.addr?.startsWith("https://");
+        if (isHttp) {
+          if (item.addr.includes("0.0.0.0")) {
+            item.addr = item.addr.replace(
+              "0.0.0.0",
+              uni.getStorageSync("apiUrl").split("//")[1].split(":")[0]
+            );
+          }
+          this.cameraList.push(item);
+        } else {
+          this.getVideoUrlByCode(item.addr);
+        }
+      });
+    },
+    getVideoUrlByCode(ID) {
+      new Promise((resolve, reject) => {
+        api
+          .getCameraByCode({ cameraCode: ID, videoType: "" })
+          .then((response) => {
+            if (response.data.code == 200) {
+              const addr = response.data.result.url;
+              this.cameraList.push({
+                addr: addr,
+                cameraCode: ID,
+              });
+            } else {
+              resolve(response);
+            }
+          })
+          .catch((error) => {
+            reject(error);
+          });
+      });
+    },
+    //设备控制
+    ctrlDevice(pass) {
+      let IDString = String(this.itemId); // 将 ID 转换为字符串
+      const params = {
+        deviceid: IDString,
+        devicetype: this.deviceType,
+        paramcode: this.paramcode,
+        password: pass,
+        value: this.windowArea,
+      };
+      new Promise((resolve, reject) => {
+        api
+          .controlDevice(params)
+          .then((response) => {
+            if (response.data.code == 200) {
+              this.getDeviceInfo(IDString);
+              // console.log("操作成功");
+            } else {
+              resolve(response);
+            }
+          })
+          .catch((error) => {
+            reject(error);
+          });
+      });
+    },
+    // 显示密码输入弹窗
+    showPasswordDialog(controlCode) {
+      this.paramcode = controlCode;
+      this.show = true;
+    },
+    // 取消密码输入
+    cancelPassword() {
+      this.show = false;
+    },
+    confirmPassword() {
+      this.ctrlDevice(this.password);
+      // 发起请求后关闭密码输入弹窗
+      this.show = false;
+    },
+  },
+  destroyed() {
+    // 停止定时器
+    this.stopTimer();
+  },
+};
+</script> 
+<style lang="scss" scoped>
+.top-nav {
+  background-image: url(../../../../static/topnavbar.png);
+  background-size: cover; /* 背景图片大小适应 */
+  height: 100%;
+}
+.top-nav2 {
+  background-color: #ffffff;
+}
+.main {
+  margin-top: 80px;
+}
+.container {
+  display: flex;
+  flex-direction: column;
+}
+.button-grid {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 5px; /* 可以根据需要调整行列之间的间距 */
+}
+.fanContent {
+  display: flex;
+  flex-direction: column;
+  margin-top: 10rpx;
+  margin-bottom: 10rpx;
+}
+.top,
+.bottom {
+  flex: 1; /* 各占 50% */
+}
+.flcard {
+  padding: 20rpx;
+  background-color: #fff;
+  margin-bottom: 20rpx;
+}
+.deviceback {
+  background: linear-gradient(
+    to right,
+    rgba(75, 135, 254, 0.08),
+    rgba(24, 184, 255, 0.08),
+    rgba(80, 161, 237, 0.08)
+  );
+}
+.additional-div {
+  grid-column: span 2; /* 让附加内容跨越三列 */
+  display: flex;
+  align-items: center;
+}
+.checkbox-group {
+  margin-left: 10px; /* 可以根据需要调整间距 */
+}
+.card {
+  background-color: #ffffff;
+  margin: auto;
+  margin-top: 20rpx;
+  width: 90%;
+  height: 280rpx;
+  border: 1rpx solid #000000;
+  border-radius: 20rpx;
+}
+.flex-containe {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+}
+.datacardtime {
+  display: flex;
+  width: 100%;
+  flex: 1;
+  margin: 1%;
+  float: left;
+  height: 50px;
+  line-height: 29px;
+  text-align: center;
+  background: linear-gradient(
+    to right,
+    rgba(55, 135, 254, 0.08),
+    rgba(4, 184, 255, 0.08),
+    rgba(60, 161, 237, 0.08)
+  );
+}
+.datacard {
+  border-radius: 10rpx;
+  border: rgba(55, 135, 254, 0.28);
+  width: 47%;
+  margin: 1%;
+  float: left;
+  height: 75px;
+  text-align: center;
+  background-image: url("/static/dataBg.png");
+  background-size: 40% 100%;
+  background-position: right;
+  background-repeat: no-repeat;
+}
+
+.datacard .TabCurCSS {
+  background: linear-gradient(
+    to right,
+    rgba(75, 135, 254, 0.08),
+    rgba(24, 184, 255, 0.08),
+    rgba(80, 161, 237, 0.08)
+  );
+}
+.left-content {
+  padding-top: 10rpx;
+  padding-bottom: 10rpx;
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+.spacer {
+  height: 10rpx;
+}
+.right-content {
+  width: 50%; /* 右侧内容占据50%宽度 */
+  background-image: url("/static/dataBg.png");
+  background-size: 100% 125%;
+}
+
+/*风窗样式*/
+div.autowindow_new {
+  width: 200px;
+  height: 200px;
+  background-image: url(../../../../static/window/window-bk.png);
+  background-size: 100% 100%;
+  perspective: 800px;
+}
+/*风窗1 2 3 4*/
+
+div.window_new_1 {
+  margin-top: 12px;
+  margin-left: 15px;
+  width: 170px;
+  height: 30px;
+  background-color: crimson;
+  box-sizing: border-box;
+  float: left;
+  z-index: 1;
+  /* transition: all 2s; */
+  background-image: url(../../../../static/window/window_new1.png);
+  background-size: 100% 100%;
+}
+div.window_new_2 {
+  margin-top: 2px;
+  margin-left: 15px;
+  width: 170px;
+  height: 29px;
+  background-color: crimson;
+  box-sizing: border-box;
+  float: left;
+  z-index: 1;
+  /* transition: all 2s; */
+  background-image: url(../../../../static/window/window_new1.png);
+  background-size: 100% 100%;
+}
+div.window_new_3 {
+  margin-top: 2px;
+  margin-left: 15px;
+  width: 170px;
+  height: 29px;
+  background-color: crimson;
+  box-sizing: border-box;
+  float: left;
+  z-index: 1;
+  /* transition: all 2s; */
+  background-image: url(../../../../static/window/window_new1.png);
+  background-size: 100% 100%;
+}
+div.window_new_4 {
+  margin-top: 2px;
+  margin-left: 15px;
+  width: 170px;
+  height: 29px;
+  background-color: crimson;
+  box-sizing: border-box;
+  float: left;
+  z-index: 1;
+  /* transition: all 2s; */
+  background-image: url(../../../../static/window/window_new1.png);
+  background-size: 100% 100%;
+}
+div.window_new_5 {
+  margin-top: 2px;
+  margin-left: 15px;
+  width: 170px;
+  height: 29px;
+  background-color: crimson;
+  box-sizing: border-box;
+  float: left;
+  z-index: 1;
+  /* transition: all 2s; */
+  background-image: url(../../../../static/window/window_new1.png);
+  background-size: 100% 100%;
+}
+div.window_new_1 {
+  transition: all 2s ease;
+  transform-origin: center center;
+}
+div.window_new_2 {
+  transition: all 2s ease;
+  transform-origin: center center;
+}
+div.window_new_3 {
+  transition: all 2s ease;
+  transform-origin: center center;
+}
+div.window_new_4 {
+  transition: all 2s ease;
+  transform-origin: center center;
+}
+div.window_new_5 {
+  transition: all 2s ease;
+  transform-origin: center center;
+}
+.btns {
+  display: flex;
+}
+.containers {
+  background-color: #fff;
+}
+.passWordName {
+  margin: 20px;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+}
+.title {
+  margin-right: 20px;
+  line-height: 40px;
+}
+.passWordInput {
+  margin: 20px;
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+}
+.passArea {
+  border-color: red;
+}
+.monitor-content {
+  display: flex;
+  flex-direction: column;
+}
+</style>

pages/home/detail/doorAnimate/doorAnimate.vue

@@ -1,185 +1,120 @@
 <template>
   <view style="width: 100%; height: 100%">
     <div class="door-container">
-      <div style="display: flex" v-show="doorcount == 1">
-        <div class="door1" v-show="doorcount == 1" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate1 == '1' ||
-              gatestate1 == '开启' ||
-              gatestate1 == '打开' ||
-              gatestate1 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor1"
-          ></div>
+      <div v-show="doorcount == 1" :style="{ height: height }">
+        <div class="door1" v-show="doorcount == 1" style="height: 100%">
+          <div class="left_door" v-bind:class="gatestate1 == '1' ||
+            gatestate1 == '开启' ||
+            gatestate1 == '打开' ||
+            gatestate1 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor1"></div>
           <div class="doortitle">风门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate1 == '1' ||
-              gatestate1 == '开启' ||
-              gatestate1 == '打开' ||
-              gatestate1 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor1"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate1 == '1' ||
+            gatestate1 == '开启' ||
+            gatestate1 == '打开' ||
+            gatestate1 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor1"></div>
         </div>
-        <div></div>
+        <!-- <div></div> -->
       </div>
-      <div
-        style="
-          background: linear-gradient(
-            to right,
-            rgba(55, 135, 254, 0.08),
-            rgba(4, 184, 255, 0.08),
-            rgba(60, 161, 237, 0.08)
-          );
-          background-size: 100% 100%;
-          background-repeat: no-repeat;
-        "
-        v-show="doorcount == 2"
-      >
-        <div class="door2" v-show="doorcount == 2" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate1 == '1' ||
-              gatestate1 == '开启' ||
-              gatestate1 == '打开' ||
-              gatestate1 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor2"
-          ></div>
+      <div :style="{ height: height, }" style=" background: linear - gradient(
+          to right,
+          rgba(55, 135, 254, 0.08),
+          rgba(4, 184, 255, 0.08),
+          rgba(60, 161, 237, 0.08)
+        );
+        background-size: 100% 100%;
+        background-repeat: no-repeat" v-show="doorcount == 2">
+        <div class="door2" v-show="doorcount == 2" style="height: 100%">
+          <div class="left_door" v-bind:class="gatestate1 == '1' ||
+            gatestate1 == '开启' ||
+            gatestate1 == '打开' ||
+            gatestate1 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor2"></div>
           <div class="doortitle">前门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate1 == '1' ||
-              gatestate1 == '开启' ||
-              gatestate1 == '打开' ||
-              gatestate1 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor2"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate1 == '1' ||
+            gatestate1 == '开启' ||
+            gatestate1 == '打开' ||
+            gatestate1 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor2"></div>
         </div>
-        <div class="door2" v-show="doorcount == 2" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate3 == '1' ||
-              gatestate3 == '开启' ||
-              gatestate3 == '打开' ||
-              gatestate3 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor3"
-          ></div>
+        <div class="door2" v-show="doorcount == 2" style="height: 100%;">
+          <div class="left_door" v-bind:class="gatestate3 == '1' ||
+            gatestate3 == '开启' ||
+            gatestate3 == '打开' ||
+            gatestate3 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor3"></div>
           <div class="doortitle">后门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate3 == '1' ||
-              gatestate3 == '开启' ||
-              gatestate3 == '打开' ||
-              gatestate3 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor3"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate3 == '1' ||
+            gatestate3 == '开启' ||
+            gatestate3 == '打开' ||
+            gatestate3 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor3"></div>
         </div>
       </div>
-      <div style="" v-show="doorcount == 3">
-        <div class="door3" v-show="doorcount == 3" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate1 == '1' ||
-              gatestate1 == '开启' ||
-              gatestate1 == '打开' ||
-              gatestate1 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor4"
-          ></div>
+      <div style="" v-show="doorcount == 3" :style="{ height: height }">
+        <div class="door3" v-show="doorcount == 3" style="height: 100%">
+          <div class="left_door" v-bind:class="gatestate1 == '1' ||
+            gatestate1 == '开启' ||
+            gatestate1 == '打开' ||
+            gatestate1 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor4"></div>
           <div class="doortitle">前门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate1 == '1' ||
-              gatestate1 == '开启' ||
-              gatestate1 == '打开' ||
-              gatestate1 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor4"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate1 == '1' ||
+            gatestate1 == '开启' ||
+            gatestate1 == '打开' ||
+            gatestate1 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor4"></div>
         </div>
-        <div class="door3" v-show="doorcount == 3" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate2 == '1' ||
-              gatestate2 == '开启' ||
-              gatestate2 == '打开' ||
-              gatestate2 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor5"
-          ></div>
+        <div class="door3" v-show="doorcount == 3" style="height: 100%">
+          <div class="left_door" v-bind:class="gatestate2 == '1' ||
+            gatestate2 == '开启' ||
+            gatestate2 == '打开' ||
+            gatestate2 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor5"></div>
           <div class="doortitle">中门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate2 == '1' ||
-              gatestate2 == '开启' ||
-              gatestate2 == '打开' ||
-              gatestate2 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor5"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate2 == '1' ||
+            gatestate2 == '开启' ||
+            gatestate2 == '打开' ||
+            gatestate2 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor5"></div>
         </div>
-        <div class="door3" v-show="doorcount == 3" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate3 == '1' ||
-              gatestate3 == '开启' ||
-              gatestate3 == '打开' ||
-              gatestate3 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor6"
-          ></div>
+        <div class="door3" v-show="doorcount == 3" style="height: 100%">
+          <div class="left_door" v-bind:class="gatestate3 == '1' ||
+            gatestate3 == '开启' ||
+            gatestate3 == '打开' ||
+            gatestate3 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor6"></div>
           <div class="doortitle">后门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate3 == '1' ||
-              gatestate3 == '开启' ||
-              gatestate3 == '打开' ||
-              gatestate3 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor6"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate3 == '1' ||
+            gatestate3 == '开启' ||
+            gatestate3 == '打开' ||
+            gatestate3 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor6"></div>
         </div>
         <div>
           <!-- <video
@@ -194,114 +129,74 @@
           ></video> -->
         </div>
       </div>
-      <div style="" v-show="doorcount == 4">
-        <div class="door4" v-show="doorcount == 4" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate1 == '1' ||
-              gatestate1 == '开启' ||
-              gatestate1 == '打开' ||
-              gatestate1 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor7"
-          ></div>
+      <div style="" v-show="doorcount == 4" :style="{ height: height }">
+        <div class="door4" v-show="doorcount == 4" style="height: 100%">
+          <div class="left_door" v-bind:class="gatestate1 == '1' ||
+            gatestate1 == '开启' ||
+            gatestate1 == '打开' ||
+            gatestate1 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor7"></div>
           <div class="doortitle">1号门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate1 == '1' ||
-              gatestate1 == '开启' ||
-              gatestate1 == '打开' ||
-              gatestate1 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor7"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate1 == '1' ||
+            gatestate1 == '开启' ||
+            gatestate1 == '打开' ||
+            gatestate1 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor7"></div>
         </div>
-        <div class="door4" v-show="doorcount == 4" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate2 == '1' ||
-              gatestate2 == '开启' ||
-              gatestate2 == '打开' ||
-              gatestate2 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor8"
-          ></div>
+        <div class="door4" v-show="doorcount == 4" style="height: 100%">
+          <div class="left_door" v-bind:class="gatestate2 == '1' ||
+            gatestate2 == '开启' ||
+            gatestate2 == '打开' ||
+            gatestate2 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor8"></div>
           <div class="doortitle">2号门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate2 == '1' ||
-              gatestate2 == '开启' ||
-              gatestate2 == '打开' ||
-              gatestate2 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor8"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate2 == '1' ||
+            gatestate2 == '开启' ||
+            gatestate2 == '打开' ||
+            gatestate2 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor8"></div>
         </div>
-        <div class="door4" v-show="doorcount == 4" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate3 == '1' ||
-              gatestate3 == '开启' ||
-              gatestate3 == '打开' ||
-              gatestate3 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor9"
-          ></div>
+        <div class="door4" v-show="doorcount == 4" style="height: 100%">
+          <div class="left_door" v-bind:class="gatestate3 == '1' ||
+            gatestate3 == '开启' ||
+            gatestate3 == '打开' ||
+            gatestate3 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor9"></div>
           <div class="doortitle">3号门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate3 == '1' ||
-              gatestate3 == '开启' ||
-              gatestate3 == '打开' ||
-              gatestate3 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor9"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate3 == '1' ||
+            gatestate3 == '开启' ||
+            gatestate3 == '打开' ||
+            gatestate3 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor9"></div>
         </div>
-        <div class="door4" v-show="doorcount == 4" :style="{ height: height }">
-          <div
-            class="left_door"
-            v-bind:class="
-              gatestate4 == '1' ||
-              gatestate4 == '开启' ||
-              gatestate4 == '打开' ||
-              gatestate4 == 'true'
-                ? 'open_left'
-                : 'close_left'
-            "
-            id="leftdoor10"
-          ></div>
+        <div class="door4" v-show="doorcount == 4" style="height: 100%">
+          <div class="left_door" v-bind:class="gatestate4 == '1' ||
+            gatestate4 == '开启' ||
+            gatestate4 == '打开' ||
+            gatestate4 == 'true'
+            ? 'open_left'
+            : 'close_left'
+            " id="leftdoor10"></div>
           <div class="doortitle">4号门</div>
-          <div
-            class="right_door"
-            v-bind:class="
-              gatestate4 == '1' ||
-              gatestate4 == '开启' ||
-              gatestate4 == '打开' ||
-              gatestate4 == 'true'
-                ? 'open_right'
-                : 'close_right'
-            "
-            id="rightdoor10"
-          ></div>
+          <div class="right_door" v-bind:class="gatestate4 == '1' ||
+            gatestate4 == '开启' ||
+            gatestate4 == '打开' ||
+            gatestate4 == 'true'
+            ? 'open_right'
+            : 'close_right'
+            " id="rightdoor10"></div>
         </div>
         <div>
           <!-- <video
@@ -346,6 +241,7 @@ export default {
   methods: {},
   watch: {
     doorcount(val) {
+      console.log("doorcount", val);
       if (val == 1) {
         this.height = "180px";
       }
@@ -373,6 +269,7 @@ div.door1 {
   background-size: 100% 100%;
   perspective: 800px;
 }
+
 div.door2 {
   width: 50%;
   float: left;
@@ -380,6 +277,7 @@ div.door2 {
   background-size: 100% 100%;
   perspective: 800px;
 }
+
 div.door3 {
   width: 33.3%;
   float: left;
@@ -387,6 +285,7 @@ div.door3 {
   background-size: 100% 100%;
   perspective: 400px;
 }
+
 div.door4 {
   width: 50%;
   float: left;
@@ -394,6 +293,7 @@ div.door4 {
   background-size: 100% 100%;
   perspective: 800px;
 }
+
 /*左门/右门*/
 
 div.left_door {
@@ -409,6 +309,7 @@ div.left_door {
   background-image: url(/static/left.png);
   background-size: 100% 100%;
 }
+
 div.right_door {
   top: 12%;
   right: 10%;
@@ -422,26 +323,33 @@ div.right_door {
   background-image: url(/static/left.png);
   background-size: 100% 100%;
 }
+
 div.left_door {
   transform-origin: left center;
   border-right: 1px solid rgb(8, 8, 8);
 }
+
 div.right_door {
   transform-origin: right center;
   border-left: 1px solid rgb(8, 8, 8);
 }
+
 .open_left {
   transform: rotateY(100deg);
 }
+
 .open_right {
   transform: rotateY(-100deg);
 }
+
 .close_left {
   transform: rotateY(0);
 }
+
 .close_right {
   transform: rotateY(0deg);
 }
+
 /*使用css变形功能
 
     div.door:hover div.left_door{

pages/home/home copy.vue

@@ -0,0 +1,767 @@
+<template>
+  <view class="container">
+    <view v-if="!menushow" class="main">
+      <view class="u-page">
+        <u-list :class="{ empty: showList.length === 0 }">
+          <template v-if="showList.length > 0">
+            <u-list-item
+              class="itemback"
+              v-for="(item, index) in showList"
+              :key="index"
+            >
+              <div>
+                <u-row gutter="5" customStyle="margin-bottom: 10px">
+                  <u-col span="24">
+                    <span class="title">{{ item.strinstallpos }}</span>
+                  </u-col>
+                </u-row>
+                <u-row gutter="5" customStyle="margin-bottom: 10px">
+                  <u-col span="2" style="margin-right: 20rpx">
+                    <div v-if="item.netStatus == 0" class="error-tag1">
+                      <image
+                        src="/static/model/connectFalse.svg"
+                        alt=""
+                        class="icon-style"
+                      />
+                      <span style="float: right">断开</span>
+                    </div>
+                    <div v-else class="success-tag">
+                      <image
+                        src="/static/model/connectTrue.svg"
+                        alt=""
+                        class="icon-style"
+                      />
+                      <span style="float: right">连接</span>
+                    </div>
+                  </u-col>
+                  <u-col span="2">
+                    <div v-if="item.warnFlag == 0" class="success-tag">
+                      <image
+                        src="/static/model/alarmTrue.svg"
+                        alt=""
+                        class="icon-style"
+                      />
+                      <span style="float: right">正常</span>
+                    </div>
+                    <div v-else class="error-tag" @click="toggleWarn()">
+                      <image
+                        v-show="!isWarnVisible"
+                        src="/static/model/alarmFalse.svg"
+                        alt=""
+                        class="icon-style"
+                      />
+                      <span
+                        v-show="isWarnVisible"
+                        style="text-overflow: ellipsis; text-algin: center"
+                        >{{ item.warnDes }}</span
+                      >
+                    </div>
+                  </u-col>
+                  <u-col span="2"></u-col>
+                  <u-col span="5">
+                    <div class="time-bg">
+                      <span class="timetext">{{ item.readTime }}</span>
+                    </div>
+                  </u-col>
+                </u-row>
+                <view v-if="TabCur != 'fanmain' && TabCur != 'fanlocal'">
+                  <div @tap="openNewPage(item)">
+                    <view
+                      class="datacard"
+                      v-for="(showitem, index) in deviceShowList"
+                      :key="index"
+                      v-show="
+                        showitem.appShow == 1 &&
+                        showitem.monitorcode != 'strinstallpos' &&
+                        showitem.monitorcode != 'netStatus' &&
+                        showitem.monitorcode != 'warnFlag' &&
+                        showitem.monitorcode != 'readTime' &&
+                        showitem.monitorcode != ''
+                      "
+                    >
+                      <view
+                        class="TabCurCSS"
+                        style="
+                          padding-top: 10rpx;
+                          padding-bottom: 10rpx;
+                          display: flex;
+                          flex-direction: column;
+                          height: 100%;
+                        "
+                      >
+                        <view
+                          v-if="showitem.monitorcode == 'doorUse'"
+                          class="demo-layout bg-purple-light"
+                          style="
+                            margin-top: 10rpx;
+                            color: #3787fe;
+                            font-weight: bold;
+                            margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
+                          "
+                        >
+                          {{
+                            item[showitem.monitorcode] == "2"
+                              ? "行人"
+                              : item[showitem.monitorcode] == "1"
+                              ? "行车"
+                              : item[showitem.monitorcode] == "3"
+                              ? "短路"
+                              : item[showitem.monitorcode] == "3"
+                              ? "行车/短路"
+                              : "-"
+                          }}
+                        </view>
+                        <view
+                          v-else
+                          class="demo-layout bg-purple-light"
+                          style="
+                            color: #3787fe;
+                            font-size: 30rpx;
+                            font-weight: bold;
+                            margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
+                          "
+                        >
+                          {{
+                            item[showitem.monitorcode] == null ||
+                            item[showitem.monitorcode] == ""
+                              ? "-"
+                              : item[showitem.monitorcode]
+                          }}
+                        </view>
+                        <view
+                          class="demo-layout bg-purple-light"
+                          style="
+                            margin-top: 20rpx;
+                            color: #677799;
+                            margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
+                          "
+                        >
+                          {{ showitem.des }}
+                        </view>
+                      </view>
+                    </view>
+                  </div>
+                </view>
+
+                <div class="fanContent" @tap="openNewPage(item)" v-else>
+                  <div class="top">
+                    <view>主机</view>
+                    <view
+                      class="datacard"
+                      v-for="(showitem, index) in deviceShowList"
+                      :key="index"
+                      v-show="
+                        showitem.appShow == 1 &&
+                        showitem.monitorcode != 'strinstallpos' &&
+                        showitem.monitorcode != 'netStatus' &&
+                        showitem.monitorcode != 'warnFlag' &&
+                        showitem.monitorcode != 'readTime' &&
+                        showitem.monitorcode != ''
+                      "
+                    >
+                      <view
+                        class="TabCurCSS"
+                        style="
+                          padding-top: 10rpx;
+                          padding-bottom: 10rpx;
+                          display: flex;
+                          flex-direction: column;
+                          height: 100%;
+                        "
+                      >
+                        <view
+                          class="demo-layout bg-purple-light"
+                          style="
+                            color: #3787fe;
+                            font-size: 30rpx;
+                            font-weight: bold;
+                            margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
+                          "
+                        >
+                          {{
+                            item[
+                              showitem.monitorcode.startsWith("fan")
+                                ? showitem.monitorcode.replace(/^fan/, "fan1")
+                                : showitem.monitorcode.startsWith("Fan")
+                                ? showitem.monitorcode.replace(/^Fan/, "Fan1")
+                                : showitem.monitorcode
+                            ] !== undefined &&
+                            item[
+                              showitem.monitorcode.startsWith("fan")
+                                ? showitem.monitorcode.replace(/^fan/, "fan1")
+                                : showitem.monitorcode.startsWith("Fan")
+                                ? showitem.monitorcode.replace(/^Fan/, "Fan1")
+                                : showitem.monitorcode
+                            ] !== null
+                              ? item[
+                                  showitem.monitorcode.startsWith("fan")
+                                    ? showitem.monitorcode.replace(
+                                        /^fan/,
+                                        "fan1"
+                                      )
+                                    : showitem.monitorcode.startsWith("Fan")
+                                    ? showitem.monitorcode.replace(
+                                        /^Fan/,
+                                        "Fan1"
+                                      )
+                                    : showitem.monitorcode
+                                ]
+                              : "-"
+                          }}
+                        </view>
+                        <!-- <view
+                          v-else-if="showitem.datatype == 2"
+                          class="demo-layout bg-purple-light"
+                          style="
+                            color: #3787fe;
+                            font-size: 30rpx;
+                            margin-top: 20rpx;
+                          "
+                        >
+                          {{
+                            item.readData[
+                              showitem.monitorcode.startsWith("Fan")
+                                ? showitem.monitorcode.replace(/^Fan/, "Fan1")
+                                : showitem.monitorcode
+                            ] !== undefined &&
+                            item.readData[
+                              showitem.monitorcode.startsWith("Fan")
+                                ? showitem.monitorcode.replace(/^Fan/, "Fan1")
+                                : showitem.monitorcode
+                            ] !== null
+                              ? item.readData[
+                                  showitem.monitorcode.startsWith("Fan")
+                                    ? showitem.monitorcode.replace(
+                                        /^Fan/,
+                                        "Fan1"
+                                      )
+                                    : showitem.monitorcode
+                                ]
+                              : "-"
+                          }}
+                        </view> -->
+
+                        <view
+                          class="demo-layout bg-purple-light"
+                          style="
+                            margin-top: 20rpx;
+                            color: #677799;
+                            margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
+                          "
+                        >
+                          {{ showitem.des }}
+                        </view>
+                      </view>
+                    </view>
+                  </div>
+                  <div class="bottom">
+                    <view>备机</view>
+                    <view
+                      class="datacard"
+                      v-for="(showitem, index) in deviceShowList"
+                      :key="index"
+                      v-show="
+                        showitem.appShow == 1 &&
+                        showitem.monitorcode != 'strinstallpos' &&
+                        showitem.monitorcode != 'netStatus' &&
+                        showitem.monitorcode != 'warnFlag' &&
+                        showitem.monitorcode != 'readTime' &&
+                        showitem.monitorcode != ''
+                      "
+                    >
+                      <view
+                        class="TabCurCSS"
+                        style="
+                          padding-top: 10rpx;
+                          padding-bottom: 10rpx;
+                          display: flex;
+                          flex-direction: column;
+                          height: 100%;
+                        "
+                      >
+                        <view
+                          class="demo-layout bg-purple-light"
+                          style="
+                            color: #3787fe;
+                            font-size: 30rpx;
+                            font-weight: bold;
+                            margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
+                          "
+                        >
+                          {{
+                            item[
+                              showitem.monitorcode.startsWith("fan")
+                                ? showitem.monitorcode.replace(/^fan/, "fan2")
+                                : showitem.monitorcode.startsWith("Fan")
+                                ? showitem.monitorcode.replace(/^Fan/, "Fan2")
+                                : showitem.monitorcode
+                            ] !== undefined &&
+                            item[
+                              showitem.monitorcode.startsWith("fan")
+                                ? showitem.monitorcode.replace(/^fan/, "fan2")
+                                : showitem.monitorcode.startsWith("Fan")
+                                ? showitem.monitorcode.replace(/^Fan/, "Fan2")
+                                : showitem.monitorcode
+                            ] !== null
+                              ? item[
+                                  showitem.monitorcode.startsWith("fan")
+                                    ? showitem.monitorcode.replace(
+                                        /^fan/,
+                                        "fan2"
+                                      )
+                                    : showitem.monitorcode.startsWith("Fan")
+                                    ? showitem.monitorcode.replace(
+                                        /^Fan/,
+                                        "Fan2"
+                                      )
+                                    : showitem.monitorcode
+                                ]
+                              : "-"
+                          }}
+                        </view>
+                        <!-- <view
+                          v-else-if="showitem.datatype == 2"
+                          class="demo-layout bg-purple-light"
+                          style="
+                            color: #3787fe;
+                            font-size: 30rpx;
+                            margin-top: 20rpx;
+                          "
+                        >
+                          {{
+                            item.readData[
+                              showitem.monitorcode.startsWith("Fan")
+                                ? showitem.monitorcode.replace(/^Fan/, "Fan2")
+                                : showitem.monitorcode
+                            ] !== undefined &&
+                            item.readData[
+                              showitem.monitorcode.startsWith("Fan")
+                                ? showitem.monitorcode.replace(/^Fan/, "Fan2")
+                                : showitem.monitorcode
+                            ] !== null
+                              ? item.readData[
+                                  showitem.monitorcode.startsWith("Fan")
+                                    ? showitem.monitorcode.replace(
+                                        /^Fan/,
+                                        "Fan2"
+                                      )
+                                    : showitem.monitorcode
+                                ]
+                              : "-"
+                          }}
+                        </view> -->
+
+                        <view
+                          class="demo-layout bg-purple-light"
+                          style="
+                            margin-top: 20rpx;
+                            color: #677799;
+                            margin-top: 20rpx;
+                            margin-left: 20rpx;
+                            text-align: left;
+                          "
+                        >
+                          {{ showitem.des }}
+                        </view>
+                      </view>
+                    </view>
+                  </div>
+                </div>
+              </div>
+            </u-list-item>
+          </template>
+          <template v-else>
+            <div class="empty-message">数据为空</div>
+          </template>
+        </u-list>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+import api from "@/api/api";
+import { computed } from "vue";
+export default {
+  data() {
+    return {
+      deviceShow1: false,
+      menushow: false,
+      TabCur: "",
+      curlist: [],
+      deviceList: {},
+      List: [],
+      colums: {},
+      typeList: [], //详情页展示数据
+      deviceShowList: [], //设备展示字段
+      isWarnVisible: false,
+      deviceType1: "",
+      devices1: [],
+      showList: [],
+    };
+  },
+  props: ["showColum", "deviceType"],
+  watch: {
+    showColum(data) {
+      this.colums = data;
+    },
+    deviceType: {
+      async handler(data) {
+        if (data) {
+          this.TabCur = data;
+          this.curlist = this.deviceList[this.TabCur];
+          if (this.curlist == null) {
+            this.curlist = [];
+          }
+          // 选择设备分类，重新获取数据
+          await this.loadData(this.TabCur);
+          this.$emit("setMenushow", {
+            menushow: false,
+          });
+        }
+      },
+      immediate: true,
+    },
+  },
+  created() {
+    this.colums = this.showColum;
+    // this.deviceShowList = this.colums[key];
+  },
+  mounted() {
+    this.startTimer();
+  },
+  methods: {
+    toggleWarn() {
+      console.log("测试");
+      this.isWarnVisible = !this.isWarnVisible;
+    },
+    startTimer() {
+      // 每隔一段时间执行某个操作
+      this.timer = setInterval(async () => {
+        // 执行定时任务
+        await this.loadData(this.deviceType);
+        console.log("定时任务执行中...");
+      }, 5000);
+    },
+    stopTimer() {
+      // 停止定时器
+      clearInterval(this.timer);
+    },
+    getIcon(itemValue) {
+      // 根据itemValue获取对应的图标路径，如果找不到对应关系则返回默认图标
+      return "/static/sidebar/" + itemValue + ".svg";
+    },
+    getValueIcon(itemValue) {
+      // 根据itemValue获取对应的图标路径，如果找不到对应关系则返回默认图标
+      return "/static/sidebar/" + itemValue + ".svg";
+    },
+    loadData(type) {
+      return new Promise((resolve, reject) => {
+        api
+          .getDeviceMonitor({
+            devicetype: type,
+            pagetype: "normal",
+          })
+          .then((response) => {
+            if (response.data.code == 200) {
+              this.deviceList[type] = response.data.result.msgTxt[0].datalist;
+              this.curlist = this.deviceList[type];
+              const processedList = this.curlist.map((item) => {
+                const { readData, ...baseFields } = item;
+                return { ...baseFields, ...readData };
+              });
+              this.showList = processedList;
+              this.showList.forEach((item) => {
+                if (item.frontGateOpen == 1) {
+                  item.frontGateOpen = "打开";
+                } else {
+                  item.frontGateOpen = "关闭";
+                }
+                if (item.midGateOpen == 1) {
+                  item.midGateOpen = "打开";
+                } else {
+                  item.midGateOpen = "关闭";
+                }
+                if (item.rearGateOpen == 1) {
+                  item.rearGateOpen = "打开";
+                } else {
+                  item.rearGateOpen = "关闭";
+                }
+                if (item.midGateOpen == 1) {
+                  item.midGateOpen = "打开";
+                } else {
+                  item.midGateOpen = "关闭";
+                }
+                this.deviceType1 = item.deviceType;
+                let original = this.TabCur;
+                let newName = original.startsWith("sys_")
+                  ? original.substring(4)
+                  : original;
+                const key = newName + "_monitor";
+                const key1 = this.deviceType1 + "_monitor";
+                if (this.showColum?.[key1]?.length > 0) {
+                  this.deviceShowList = this.showColum[key1];
+                } else {
+                  this.deviceShowList = this.showColum[key] ?? [];
+                }
+              });
+              if (this.TabCur == "sys_pulping") {
+                this.loadNewData(this.curlist[0].deviceID);
+              }
+            } else {
+              resolve(response);
+            }
+          })
+          .catch((error) => {
+            // console.log("catch===>response", response);
+            reject(error);
+          });
+      });
+    },
+    loadNewData(ID) {
+      return new Promise((resolve, reject) => {
+        api
+          .getDeviceMonitor({
+            devicetype: "sys",
+            systemID: ID,
+          })
+          .then((response) => {
+            if (response.data.code == 200) {
+              this.curlist = [];
+              this.List = response.data.result.msgTxt;
+              this.List.forEach((item) => {
+                if (item.type === "pulping_auto") {
+                  this.curlist.push(item.datalist[0]);
+                }
+              });
+            } else {
+              resolve(response);
+            }
+          })
+          .catch((error) => {
+            // console.log("catch===>response", response);
+            reject(error);
+          });
+      });
+    },
+    devicemenuShow(e) {
+      this.menushow = !this.menushow;
+    },
+    //获取app展示字段数据
+    getShowList(type) {
+      const params = {
+        devicekind: type,
+        pagetype: "monitor",
+        pageNo: 1,
+        pageSize: 100,
+      };
+      return new Promise((resolve, reject) => {
+        api
+          .getShowColumList(params)
+          .then((response) => {
+            if (response.data.code == 200) {
+              this.typeList = response.data.result.records;
+              resolve(response);
+            } else {
+              resolve(response);
+            }
+          })
+          .catch((error) => {
+            reject(error);
+          });
+      });
+    },
+    openNewPage(params) {
+      const reqData = {
+        id: params.deviceID,
+        name: params.strinstallpos,
+        type: this.TabCur,
+      };
+      const reqparams = uni.$u.queryParams(reqData);
+      // const key = this.deviceType1 + "_monitor";
+      if (this.deviceShowList.length > 0) {
+        this.$destroy();
+        uni.navigateTo({
+          url: `/pages/home/detail/autodoor/autodoor${reqparams}`,
+        });
+      }
+      //   this.$destroy();
+      //   uni.navigateTo({
+      //     url: `/pages/home/detail/autodoor/autodoor?id=${params.deviceID}&name=${params.strinstallpos}&type=${this.TabCur}`,
+      //   });
+      // },
+    },
+  },
+  destroyed() {
+    // 停止定时器
+    this.stopTimer();
+  },
+};
+</script>
+
+<style>
+.time-bg {
+  background-color: #cce6fb;
+  border-radius: 5px;
+  height: 26px;
+  line-height: 25px;
+  text-align: center;
+  float: right;
+}
+.empty {
+  background: url("/static/empty.png") no-repeat;
+  background-size: 100% 50%;
+}
+.empty-message {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  font-size: 16px;
+  line-height: 80vh;
+  color: #333;
+}
+>>> .u-navbar--fixed {
+  /* margin-top: 20px; */
+}
+.main {
+  /* margin-top: 100rpx; */
+  display: flex;
+  flex-direction: column;
+}
+
+.card {
+  background-color: #ffffff;
+  margin: auto;
+  margin-top: 20rpx;
+  width: 10%;
+  height: 280rpx;
+  border: 1rpx solid #000000;
+  border-radius: 20rpx;
+}
+
+.menupage {
+  position: absolute;
+  z-index: 2;
+  width: 100%;
+}
+
+.timetext {
+  text-align: center;
+  color: #2591eb;
+  font-weight: bold;
+}
+
+.itemback {
+  padding: 20rpx;
+  background-color: #ffffff;
+  margin-bottom: 5rpx;
+}
+.fanContent {
+  display: flex;
+  flex-direction: column;
+  margin-top: 10rpx;
+  margin-bottom: 10rpx;
+}
+.top,
+.bottom {
+  flex: 1; /* 各占 50% */
+}
+.datacard .content {
+  width: 30rpx;
+  height: 30rpx;
+  left: 0rpx;
+  top: 0rpx;
+  position: absolute;
+}
+
+.datacard {
+  border-radius: 10rpx;
+  border: rgba(55, 135, 254, 0.28);
+  width: 47%;
+  margin: 1%;
+  float: left;
+  height: 75px;
+  text-align: center;
+  background: linear-gradient(
+    to right,
+    rgba(55, 135, 254, 0.08),
+    rgba(4, 184, 255, 0.08),
+    rgba(60, 161, 237, 0.08)
+  );
+  background-image: url("/static/dataBg.png");
+  background-size: 40% 100%;
+  background-position: right;
+  background-repeat: no-repeat;
+}
+
+.datacard .TabCurCSS {
+  background: linear-gradient(
+    to right,
+    rgba(75, 135, 254, 0.08),
+    rgba(24, 184, 255, 0.08),
+    rgba(80, 161, 237, 0.08)
+  );
+}
+
+.error-tag {
+  border-radius: 10%;
+  display: inline-block;
+  color: #e90000;
+  line-height: 50rpx;
+  font-size: 14px;
+  text-align: center;
+  width: 120rpx;
+  height: 50rpx;
+  padding-right: 30rpx;
+  background-color: rgba(233, 0, 0, 0.2);
+}
+
+.error-tag1 {
+  border-radius: 10%;
+  display: inline-block;
+  color: #696969;
+  line-height: 50rpx;
+  font-size: 14px;
+  text-align: center;
+  margin-top: 10rpx;
+  width: 120rpx;
+  height: 50rpx;
+  background-color: rgba(105, 105, 105, 0.2);
+}
+
+.success-tag {
+  border-radius: 10%;
+  color: #42c000;
+  line-height: 25px;
+  font-size: 14px;
+  width: 60px;
+  height: 26px;
+  padding-right: 15px;
+  background-color: rgba(226, 250, 214);
+}
+
+.icon-style {
+  margin: 7px;
+  width: 14px;
+  height: 14px;
+}
+
+.title {
+  margin-left: 40rpx;
+  float: left;
+  font-size: 28rpx;
+  font-weight: bold;
+}
+</style>

pages/home/home.vue

@@ -4,386 +4,105 @@
       <view class="u-page">
         <u-list :class="{ empty: showList.length === 0 }">
           <template v-if="showList.length > 0">
-            <u-list-item
-              class="itemback"
-              v-for="(item, index) in showList"
-              :key="index"
-            >
-              <div>
-                <u-row gutter="5" customStyle="margin-bottom: 10px">
-                  <u-col span="24">
-                    <span class="title">{{ item.strinstallpos }}</span>
-                  </u-col>
-                </u-row>
-                <u-row gutter="5" customStyle="margin-bottom: 10px">
-                  <u-col span="2" style="margin-right: 20rpx">
-                    <div v-if="item.netStatus == 0" class="error-tag1">
-                      <image
-                        src="/static/model/connectFalse.svg"
-                        alt=""
-                        class="icon-style"
-                      />
-                      <span style="float: right">断开</span>
-                    </div>
-                    <div v-else class="success-tag">
-                      <image
-                        src="/static/model/connectTrue.svg"
-                        alt=""
-                        class="icon-style"
-                      />
-                      <span style="float: right">连接</span>
-                    </div>
-                  </u-col>
-                  <u-col span="2">
-                    <div v-if="item.warnFlag == 0" class="success-tag">
-                      <image
-                        src="/static/model/alarmTrue.svg"
-                        alt=""
-                        class="icon-style"
-                      />
-                      <span style="float: right">正常</span>
-                    </div>
-                    <div v-else class="error-tag" @click="toggleWarn()">
-                      <image
-                        v-show="!isWarnVisible"
-                        src="/static/model/alarmFalse.svg"
-                        alt=""
-                        class="icon-style"
-                      />
-                      <span
-                        v-show="isWarnVisible"
-                        style="text-overflow: ellipsis; text-algin: center"
-                        >{{ item.warnDes }}</span
-                      >
-                    </div>
-                  </u-col>
-                  <u-col span="2"></u-col>
-                  <u-col span="5">
-                    <div class="time-bg">
-                      <span class="timetext">{{ item.readTime }}</span>
-                    </div>
-                  </u-col>
-                </u-row>
-                <view v-if="TabCur != 'fanmain' && TabCur != 'fanlocal'">
-                  <div @tap="openNewPage(item)">
-                    <view
-                      class="datacard"
-                      v-for="(showitem, index) in deviceShowList"
-                      :key="index"
-                      v-show="
-                        showitem.appShow == 1 &&
-                        showitem.monitorcode != 'strinstallpos' &&
-                        showitem.monitorcode != 'netStatus' &&
-                        showitem.monitorcode != 'warnFlag' &&
-                        showitem.monitorcode != 'readTime' &&
-                        showitem.monitorcode != ''
-                      "
-                    >
-                      <view
-                        class="TabCurCSS"
-                        style="
-                          padding-top: 10rpx;
-                          padding-bottom: 10rpx;
-                          display: flex;
-                          flex-direction: column;
-                          height: 100%;
-                        "
-                      >
-                        <view
-                          v-if="showitem.monitorcode == 'doorUse'"
-                          class="demo-layout bg-purple-light"
-                          style="
-                            margin-top: 10rpx;
-                            color: #3787fe;
-                            font-weight: bold;
-                            margin-top: 20rpx;
-                            margin-left: 20rpx;
-                            text-align: left;
-                          "
-                        >
-                          {{
-                            item[showitem.monitorcode] == "2"
-                              ? "行人"
-                              : item[showitem.monitorcode] == "1"
-                              ? "行车"
-                              : item[showitem.monitorcode] == "3"
-                              ? "短路"
-                              : item[showitem.monitorcode] == "3"
-                              ? "行车/短路"
-                              : "-"
-                          }}
-                        </view>
-                        <view
-                          v-else
-                          class="demo-layout bg-purple-light"
-                          style="
-                            color: #3787fe;
-                            font-size: 30rpx;
-                            font-weight: bold;
-                            margin-top: 20rpx;
-                            margin-left: 20rpx;
-                            text-align: left;
-                          "
-                        >
-                          {{
-                            item[showitem.monitorcode] == null ||
-                            item[showitem.monitorcode] == ""
-                              ? "-"
-                              : item[showitem.monitorcode]
-                          }}
-                        </view>
-                        <view
-                          class="demo-layout bg-purple-light"
-                          style="
-                            margin-top: 20rpx;
-                            color: #677799;
-                            margin-top: 20rpx;
-                            margin-left: 20rpx;
-                            text-align: left;
-                          "
-                        >
-                          {{ showitem.des }}
-                        </view>
-                      </view>
+            <u-list-item v-for="(item, index) in showList" :key="index">
+              <view class="device-card">
+                <!-- 标题 -->
+                <view class="card-title-row">
+                  <text class="card-title">{{ item.strinstallpos }}</text>
+                  <text class="card-time" v-if="item.readTime">{{ item.readTime }}</text>
+                </view>
+                <view class="card-divider"></view>
+
+                <!-- 状态标签行 -->
+                <view class="status-row">
+                  <view class="status-left">
+                    <view v-if="item.netStatus == 0" class="status-tag tag-offline">
+                      <image src="/static/model/connectFalse.svg" class="tag-icon" />
+                      <text>断开</text>
+                    </view>
+                    <view v-else class="status-tag tag-online">
+                      <image src="/static/model/connectTrue.svg" class="tag-icon" />
+                      <text>连接</text>
+                    </view>
+
+                    <view v-if="item.warnFlag == 0" class="status-tag tag-normal">
+                      <image src="/static/model/alarmTrue.svg" class="tag-icon" />
+                      <text>正常</text>
+                    </view>
+                    <view v-else class="status-tag tag-warn" @click="toggleWarn()">
+                      <image src="/static/model/alarmFalse.svg" class="tag-icon" />
+                      <text class="warn-text">{{ item.warnDes }}</text>
+                    </view>
+                  </view>
+
+                  <view v-if="hasDoorUse" class="door-use-btn">
+                    <text>{{ getDoorUseText(item.doorUse) }}</text>
+                  </view>
+                </view>
+
+                <!-- 普通设备数据 -->
+                <view v-if="TabCur != 'fanmain' && TabCur != 'fanlocal'" class="data-grid" @tap="openNewPage(item)">
+                  <view class="datacard" v-for="(showitem, sIndex) in deviceShowList" :key="sIndex"
+                    v-show="isDataField(showitem)">
+                    <view class="data-icon">
+                      <!-- <u-icon
+                        :name="getFieldIcon(showitem.monitorcode)"
+                        color="#ffffff"
+                        size="14"
+                      ></u-icon> -->
+                      <image class="icon-top" :src="getIcon1(showitem.monitorcode)" mode="aspectFit"></image>
+                    </view>
+                    <view class="data-text">
+                      <text class="data-value">{{
+                        getFieldValue(item, showitem)
+                      }}</text>
+                      <text class="data-label">{{ showitem.des }}</text>
                     </view>
-                  </div>
+                  </view>
                 </view>
 
-                <div class="fanContent" @tap="openNewPage(item)" v-else>
-                  <div class="top">
-                    <view>主机</view>
-                    <view
-                      class="datacard"
-                      v-for="(showitem, index) in deviceShowList"
-                      :key="index"
-                      v-show="
-                        showitem.appShow == 1 &&
-                        showitem.monitorcode != 'strinstallpos' &&
-                        showitem.monitorcode != 'netStatus' &&
-                        showitem.monitorcode != 'warnFlag' &&
-                        showitem.monitorcode != 'readTime' &&
-                        showitem.monitorcode != ''
-                      "
-                    >
-                      <view
-                        class="TabCurCSS"
-                        style="
-                          padding-top: 10rpx;
-                          padding-bottom: 10rpx;
-                          display: flex;
-                          flex-direction: column;
-                          height: 100%;
-                        "
-                      >
-                        <view
-                          class="demo-layout bg-purple-light"
-                          style="
-                            color: #3787fe;
-                            font-size: 30rpx;
-                            font-weight: bold;
-                            margin-top: 20rpx;
-                            margin-left: 20rpx;
-                            text-align: left;
-                          "
-                        >
-                          {{
-                            item[
-                              showitem.monitorcode.startsWith("fan")
-                                ? showitem.monitorcode.replace(/^fan/, "fan1")
-                                : showitem.monitorcode.startsWith("Fan")
-                                ? showitem.monitorcode.replace(/^Fan/, "Fan1")
-                                : showitem.monitorcode
-                            ] !== undefined &&
-                            item[
-                              showitem.monitorcode.startsWith("fan")
-                                ? showitem.monitorcode.replace(/^fan/, "fan1")
-                                : showitem.monitorcode.startsWith("Fan")
-                                ? showitem.monitorcode.replace(/^Fan/, "Fan1")
-                                : showitem.monitorcode
-                            ] !== null
-                              ? item[
-                                  showitem.monitorcode.startsWith("fan")
-                                    ? showitem.monitorcode.replace(
-                                        /^fan/,
-                                        "fan1"
-                                      )
-                                    : showitem.monitorcode.startsWith("Fan")
-                                    ? showitem.monitorcode.replace(
-                                        /^Fan/,
-                                        "Fan1"
-                                      )
-                                    : showitem.monitorcode
-                                ]
-                              : "-"
-                          }}
+                <!-- 风机设备：主机 / 备机 -->
+                <view class="fanContent" @tap="openNewPage(item)" v-else>
+                  <view class="fan-block">
+                    <view class="fan-label">主机</view>
+                    <view class="data-grid">
+                      <view class="datacard" v-for="(showitem, sIndex) in deviceShowList" :key="'f1-' + sIndex"
+                        v-show="isDataField(showitem)">
+                        <view class="data-icon">
+                          <u-icon :name="getFieldIcon(showitem.monitorcode)" color="#ffffff" size="14"></u-icon>
                         </view>
-                        <!-- <view
-                          v-else-if="showitem.datatype == 2"
-                          class="demo-layout bg-purple-light"
-                          style="
-                            color: #3787fe;
-                            font-size: 30rpx;
-                            margin-top: 20rpx;
-                          "
-                        >
-                          {{
-                            item.readData[
-                              showitem.monitorcode.startsWith("Fan")
-                                ? showitem.monitorcode.replace(/^Fan/, "Fan1")
-                                : showitem.monitorcode
-                            ] !== undefined &&
-                            item.readData[
-                              showitem.monitorcode.startsWith("Fan")
-                                ? showitem.monitorcode.replace(/^Fan/, "Fan1")
-                                : showitem.monitorcode
-                            ] !== null
-                              ? item.readData[
-                                  showitem.monitorcode.startsWith("Fan")
-                                    ? showitem.monitorcode.replace(
-                                        /^Fan/,
-                                        "Fan1"
-                                      )
-                                    : showitem.monitorcode
-                                ]
-                              : "-"
-                          }}
-                        </view> -->
-
-                        <view
-                          class="demo-layout bg-purple-light"
-                          style="
-                            margin-top: 20rpx;
-                            color: #677799;
-                            margin-top: 20rpx;
-                            margin-left: 20rpx;
-                            text-align: left;
-                          "
-                        >
-                          {{ showitem.des }}
+                        <view class="data-text">
+                          <text class="data-value">{{
+                            getFanFieldValue(item, showitem, 1)
+                          }}</text>
+                          <text class="data-label">{{ showitem.des }}</text>
                         </view>
                       </view>
                     </view>
-                  </div>
-                  <div class="bottom">
-                    <view>备机</view>
-                    <view
-                      class="datacard"
-                      v-for="(showitem, index) in deviceShowList"
-                      :key="index"
-                      v-show="
-                        showitem.appShow == 1 &&
-                        showitem.monitorcode != 'strinstallpos' &&
-                        showitem.monitorcode != 'netStatus' &&
-                        showitem.monitorcode != 'warnFlag' &&
-                        showitem.monitorcode != 'readTime' &&
-                        showitem.monitorcode != ''
-                      "
-                    >
-                      <view
-                        class="TabCurCSS"
-                        style="
-                          padding-top: 10rpx;
-                          padding-bottom: 10rpx;
-                          display: flex;
-                          flex-direction: column;
-                          height: 100%;
-                        "
-                      >
-                        <view
-                          class="demo-layout bg-purple-light"
-                          style="
-                            color: #3787fe;
-                            font-size: 30rpx;
-                            font-weight: bold;
-                            margin-top: 20rpx;
-                            margin-left: 20rpx;
-                            text-align: left;
-                          "
-                        >
-                          {{
-                            item[
-                              showitem.monitorcode.startsWith("fan")
-                                ? showitem.monitorcode.replace(/^fan/, "fan2")
-                                : showitem.monitorcode.startsWith("Fan")
-                                ? showitem.monitorcode.replace(/^Fan/, "Fan2")
-                                : showitem.monitorcode
-                            ] !== undefined &&
-                            item[
-                              showitem.monitorcode.startsWith("fan")
-                                ? showitem.monitorcode.replace(/^fan/, "fan2")
-                                : showitem.monitorcode.startsWith("Fan")
-                                ? showitem.monitorcode.replace(/^Fan/, "Fan2")
-                                : showitem.monitorcode
-                            ] !== null
-                              ? item[
-                                  showitem.monitorcode.startsWith("fan")
-                                    ? showitem.monitorcode.replace(
-                                        /^fan/,
-                                        "fan2"
-                                      )
-                                    : showitem.monitorcode.startsWith("Fan")
-                                    ? showitem.monitorcode.replace(
-                                        /^Fan/,
-                                        "Fan2"
-                                      )
-                                    : showitem.monitorcode
-                                ]
-                              : "-"
-                          }}
+                  </view>
+                  <view class="fan-block">
+                    <view class="fan-label">备机</view>
+                    <view class="data-grid">
+                      <view class="datacard" v-for="(showitem, sIndex) in deviceShowList" :key="'f2-' + sIndex"
+                        v-show="isDataField(showitem)">
+                        <view class="data-icon">
+                          <u-icon :name="getFieldIcon(showitem.monitorcode)" color="#ffffff" size="14"></u-icon>
                         </view>
-                        <!-- <view
-                          v-else-if="showitem.datatype == 2"
-                          class="demo-layout bg-purple-light"
-                          style="
-                            color: #3787fe;
-                            font-size: 30rpx;
-                            margin-top: 20rpx;
-                          "
-                        >
-                          {{
-                            item.readData[
-                              showitem.monitorcode.startsWith("Fan")
-                                ? showitem.monitorcode.replace(/^Fan/, "Fan2")
-                                : showitem.monitorcode
-                            ] !== undefined &&
-                            item.readData[
-                              showitem.monitorcode.startsWith("Fan")
-                                ? showitem.monitorcode.replace(/^Fan/, "Fan2")
-                                : showitem.monitorcode
-                            ] !== null
-                              ? item.readData[
-                                  showitem.monitorcode.startsWith("Fan")
-                                    ? showitem.monitorcode.replace(
-                                        /^Fan/,
-                                        "Fan2"
-                                      )
-                                    : showitem.monitorcode
-                                ]
-                              : "-"
-                          }}
-                        </view> -->
-
-                        <view
-                          class="demo-layout bg-purple-light"
-                          style="
-                            margin-top: 20rpx;
-                            color: #677799;
-                            margin-top: 20rpx;
-                            margin-left: 20rpx;
-                            text-align: left;
-                          "
-                        >
-                          {{ showitem.des }}
+                        <view class="data-text">
+                          <text class="data-value">{{
+                            getFanFieldValue(item, showitem, 2)
+                          }}</text>
+                          <text class="data-label">{{ showitem.des }}</text>
                         </view>
                       </view>
                     </view>
-                  </div>
-                </div>
-              </div>
+                  </view>
+                </view>
+              </view>
             </u-list-item>
           </template>
           <template v-else>
-            <div class="empty-message">数据为空</div>
+            <view class="empty-message">数据为空</view>
           </template>
         </u-list>
       </view>
@@ -413,6 +132,13 @@ export default {
     };
   },
   props: ["showColum", "deviceType"],
+  computed: {
+    hasDoorUse() {
+      return (this.deviceShowList || []).some(
+        (item) => item.appShow == 1 && item.monitorcode == "doorUse"
+      );
+    },
+  },
   watch: {
     showColum(data) {
       this.colums = data;
@@ -447,6 +173,74 @@ export default {
       console.log("测试");
       this.isWarnVisible = !this.isWarnVisible;
     },
+    isDataField(showitem) {
+      return (
+        showitem.appShow == 1 &&
+        showitem.monitorcode != "strinstallpos" &&
+        showitem.monitorcode != "netStatus" &&
+        showitem.monitorcode != "warnFlag" &&
+        showitem.monitorcode != "readTime" &&
+        showitem.monitorcode != "doorUse" &&
+        showitem.monitorcode != ""
+      );
+    },
+    getDoorUseText(val) {
+      if (val == "2") return "行人";
+      if (val == "1") return "行车";
+      if (val == "3") return "短路";
+      return "-";
+    },
+    getFieldValue(item, showitem) {
+      if (showitem.monitorcode == "doorUse") {
+        return this.getDoorUseText(item[showitem.monitorcode]);
+      }
+      const val = item[showitem.monitorcode];
+      if (val == null || val == "") return "-";
+      return val;
+    },
+    getFanFieldValue(item, showitem, fanNo) {
+      const code = showitem.monitorcode;
+      let key = code;
+      if (code.startsWith("fan")) {
+        key = code.replace(/^fan/, "fan" + fanNo);
+      } else if (code.startsWith("Fan")) {
+        key = code.replace(/^Fan/, "Fan" + fanNo);
+      }
+      if (item[key] !== undefined && item[key] !== null) {
+        return item[key];
+      }
+      return "-";
+    },
+    getFieldIcon(monitorcode) {
+      const code = (monitorcode || "").toLowerCase();
+      if (code.indexOf("gate") > -1 || code.indexOf("door") > -1) {
+        return "grid-fill";
+      }
+      if (code.indexOf("press") > -1 || code.indexOf("pressure") > -1) {
+        return "level";
+      }
+      if (code.indexOf("wind") > -1 || code.indexOf("speed") > -1) {
+        return "reload";
+      }
+      return "list";
+    },
+    getIcon1(monitorcode) {
+      const code = (monitorcode || "").toLowerCase();
+      if (code.indexOf("gate") > -1 || code.indexOf("door") > -1) {
+        return "/static/icon-new/door-icon.svg";
+      }
+      if (code.indexOf("press") > -1 || code.indexOf("pressure") > -1) {
+        return "/static/icon-new/qyyl-icon.svg";
+      }
+      if (code.indexOf("area") > -1) {
+        return "/static/icon-new/dmj.svg";
+      }
+       if (code.indexOf("m3") > -1 || code.indexOf("va") > -1 || code.indexOf("forward") > -1) {
+        return "/static/icon-new/fl.svg";
+      }
+
+       return "/static/icon-new/dmj.svg";
+    },
     startTimer() {
       // 每隔一段时间执行某个操作
       this.timer = setInterval(async () => {
@@ -513,8 +307,10 @@ export default {
                 const key1 = this.deviceType1 + "_monitor";
                 if (this.showColum?.[key1]?.length > 0) {
                   this.deviceShowList = this.showColum[key1];
+                  console.log(this.deviceShowList,'this.deviceShowList')
                 } else {
                   this.deviceShowList = this.showColum[key] ?? [];
+                  console.log(this.deviceShowList,'this.deviceShowList')
                 }
               });
               if (this.TabCur == "sys_pulping") {
@@ -611,157 +407,248 @@ export default {
 };
 </script>
 
-<style>
-.time-bg {
-  background-color: #cce6fb;
-  border-radius: 5px;
-  height: 26px;
-  line-height: 25px;
-  text-align: center;
-  float: right;
+<style scoped>
+.container {
+  min-height: 100%;
+  /* background: #f4f7fd; */
+}
+
+.main {
+  display: flex;
+  flex-direction: column;
+  /* background: #f4f7fd; */
 }
+
+.u-page {
+  padding: 20rpx 24rpx;
+  box-sizing: border-box;
+}
+
 .empty {
   background: url("/static/empty.png") no-repeat;
   background-size: 100% 50%;
 }
+
 .empty-message {
   display: flex;
   justify-content: center;
   align-items: center;
   font-size: 16px;
   line-height: 80vh;
-  color: #333;
+  color: #000;
 }
->>> .u-navbar--fixed {
-  /* margin-top: 20px; */
+
+/* ===== 设备卡片 ===== */
+.device-card {
+  background: #f9f9fb;
+  border-radius: 20rpx;
+  padding: 28rpx 24rpx 24rpx;
+  margin-bottom: 24rpx;
+  box-shadow: 0 4rpx 16rpx rgba(41, 121, 255, 0.04);
 }
-.main {
-  /* margin-top: 100rpx; */
+
+.card-title-row {
   display: flex;
-  flex-direction: column;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
 }
 
-.card {
-  background-color: #ffffff;
-  margin: auto;
-  margin-top: 20rpx;
-  width: 10%;
-  height: 280rpx;
-  border: 1rpx solid #000000;
-  border-radius: 20rpx;
+.card-title {
+  flex: 1;
+  font-size: 28rpx;
+  font-weight: 700;
+  color: #000;
+  line-height: 1.3;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
-.menupage {
-  position: absolute;
-  z-index: 2;
-  width: 100%;
+.card-time {
+  margin-left: 16rpx;
+  font-size: 24rpx;
+  color: #8a94a6;
+  flex-shrink: 0;
 }
 
-.timetext {
-  text-align: center;
-  color: #2591eb;
-  font-weight: bold;
+.card-divider {
+  height: 1rpx;
+  background: #efeff0;
+  margin: 20rpx 0;
 }
 
-.itemback {
-  padding: 20rpx;
-  background-color: #ffffff;
-  margin-bottom: 5rpx;
+/* ===== 状态行 ===== */
+.status-row {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 20rpx;
 }
-.fanContent {
+
+.status-left {
   display: flex;
-  flex-direction: column;
-  margin-top: 10rpx;
-  margin-bottom: 10rpx;
+  flex-direction: row;
+  align-items: center;
+  flex-wrap: wrap;
+  flex: 1;
+  min-width: 0;
+}
+
+.status-tag {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  height: 48rpx;
+  padding: 0 16rpx;
+  margin-right: 12rpx;
+  margin-bottom: 4rpx;
+  border-radius: 8rpx;
+  border-width: 1rpx;
+  border-style: solid;
+  font-size: 24rpx;
+  box-sizing: border-box;
 }
-.top,
-.bottom {
-  flex: 1; /* 各占 50% */
+
+.tag-icon {
+  width: 24rpx;
+  height: 24rpx;
+  margin-right: 8rpx;
+  flex-shrink: 0;
 }
-.datacard .content {
-  width: 30rpx;
-  height: 30rpx;
-  left: 0rpx;
-  top: 0rpx;
-  position: absolute;
+
+.tag-offline {
+  color: #888888;
+  background: #f5f5f5;
+  border-color: #d1d1d1;
 }
 
-.datacard {
-  border-radius: 10rpx;
-  border: rgba(55, 135, 254, 0.28);
-  width: 47%;
-  margin: 1%;
-  float: left;
-  height: 75px;
-  text-align: center;
-  background: linear-gradient(
-    to right,
-    rgba(55, 135, 254, 0.08),
-    rgba(4, 184, 255, 0.08),
-    rgba(60, 161, 237, 0.08)
-  );
-  background-image: url("/static/dataBg.png");
-  background-size: 40% 100%;
-  background-position: right;
-  background-repeat: no-repeat;
+.tag-online {
+  color: #42c000;
+  background: #e8f8e0;
+  border-color: #a8e08a;
 }
 
-.datacard .TabCurCSS {
-  background: linear-gradient(
-    to right,
-    rgba(75, 135, 254, 0.08),
-    rgba(24, 184, 255, 0.08),
-    rgba(80, 161, 237, 0.08)
-  );
+.tag-normal {
+  color: #42c000;
+  background: #e8f8e0;
+  border-color: #a8e08a;
 }
 
-.error-tag {
-  border-radius: 10%;
-  display: inline-block;
+.tag-warn {
   color: #e90000;
-  line-height: 50rpx;
-  font-size: 14px;
-  text-align: center;
-  width: 120rpx;
-  height: 50rpx;
-  padding-right: 30rpx;
-  background-color: rgba(233, 0, 0, 0.2);
+  background: #ffebee;
+  border-color: #ef9a9a;
+  max-width: 280rpx;
 }
 
-.error-tag1 {
-  border-radius: 10%;
-  display: inline-block;
-  color: #696969;
-  line-height: 50rpx;
-  font-size: 14px;
-  text-align: center;
-  margin-top: 10rpx;
-  width: 120rpx;
-  height: 50rpx;
-  background-color: rgba(105, 105, 105, 0.2);
+.warn-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
 }
 
-.success-tag {
-  border-radius: 10%;
-  color: #42c000;
-  line-height: 25px;
-  font-size: 14px;
-  width: 60px;
-  height: 26px;
-  padding-right: 15px;
-  background-color: rgba(226, 250, 214);
+.door-use-btn {
+  flex-shrink: 0;
+  height: 48rpx;
+  padding: 0 24rpx;
+  border-radius: 8rpx;
+  border: 1rpx solid #7eb6ff;
+  background: #f0f7ff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: #0065f8;
+  font-size: 28rpx;
+  font-weight: 500;
+}
+
+/* ===== 数据网格 ===== */
+.data-grid {
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  margin: 0 -6rpx;
+}
+
+.datacard {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  width: calc(33.33% - 12rpx);
+  margin: 6rpx;
+  padding: 16rpx 12rpx;
+  box-sizing: border-box;
+  border-radius: 12rpx;
+  background: linear-gradient(to bottom, rgba(175, 195, 252, .6) 0%, rgba(175, 195, 252, .1) 100%);
+}
+
+.data-icon {
+  width: 48rpx;
+  height: 48rpx;
+  border-radius: 8rpx;
+  background: linear-gradient(135deg, #75aaff 0%, #4d8cff 55%, #3b7ef0 100%);
+  box-shadow: 0 4rpx 10rpx rgba(61, 126, 240, 0.28);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  margin-right: 10rpx;
+}
+
+.icon-top {
+  width: 30rpx;
+  height: 28rpx;
 }
 
-.icon-style {
-  margin: 7px;
-  width: 14px;
-  height: 14px;
+.data-text {
+  flex: 1;
+  min-width: 0;
+  display: flex;
+  flex-direction: column;
 }
 
-.title {
-  margin-left: 40rpx;
-  float: left;
+.data-value {
   font-size: 28rpx;
-  font-weight: bold;
+  font-weight: 700;
+  color: #0065f8;
+  line-height: 1.3;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.data-label {
+  margin-top: 4rpx;
+  font-size: 24rpx;
+  color: #333333;
+  line-height: 1.3;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+/* ===== 风机 ===== */
+.fanContent {
+  display: flex;
+  flex-direction: column;
+}
+
+.fan-block {
+  margin-bottom: 12rpx;
+}
+
+.fan-label {
+  font-size: 24rpx;
+  font-weight: 600;
+  color: #000;
+  margin: 4rpx 6rpx 8rpx;
+}
+
+.menupage {
+  position: absolute;
+  z-index: 2;
+  width: 100%;
 }
 </style>

pages/index/index.vue

@@ -1,94 +1,71 @@
 <template>
   <view class="app-container">
-    <view
-      v-if="iframeloading"
-      class="loadding-box"
-      :style="{
-        height: wvHeight + 'px',
-        width: wvWidth + 'px',
-        marginTop: wvTop + 'px',
-        border: 'none',
-      }"
-    >
+    <view v-if="iframeloading" class="loadding-box" :style="{
+      height: wvHeight + 'px',
+      width: wvWidth + 'px',
+      marginTop: wvTop + 'px',
+      border: 'none',
+    }">
       <u-loading-icon></u-loading-icon>
     </view>
-    <iframe
-      v-if="PageCur == 'tun2D'"
-      ref="iframe"
-      src="http://182.92.126.35:8098/"
-      @load="viewLoad"
-      :style="{
-        height: wvHeight + 'px',
-        width: wvWidth + 'px',
-        marginTop: wvTop + 'px',
-        border: 'none',
-        background: '#000',
-      }"
-    ></iframe>
-    <Device
+    <iframe v-if="PageCur == 'tun2D'" ref="iframe" src="http://182.92.126.35:8098/" @load="viewLoad" :style="{
+      height: wvHeight + 'px',
+      width: wvWidth + 'px',
+      marginTop: wvTop + 'px',
+      border: 'none',
+      background: '#000',
+    }"></iframe>
+    <!-- <Device
       v-show="PageCur == 'device'"
       :style="{ marginTop: wvTop + 20 + 'px' }"
-    ></Device>
+    ></Device> -->
+    <Device v-show="PageCur == 'device'"></Device>
     <filecenter :cur="PageCur" v-show="PageCur == 'filecenter'"></filecenter>
     <warndata v-show="PageCur == 'warndata'" :cur="PageCur"></warndata>
     <gasreport :cur="PageCur" v-show="PageCur == 'gasreport'"></gasreport>
     <user :cur="PageCur" v-show="PageCur == 'user'"></user>
-    <u-tabbar
-      :value="PageCur"
-      @change="NavChange"
-      :fixed="true"
-      :placeholder="true"
-      :safeAreaInsetBottom="true"
-    >
+    <u-tabbar :value="PageCur" @change="NavChange" :fixed="true" :placeholder="true" :safeAreaInsetBottom="true">
+      <u-tabbar-item v-show="menus.device != null" text="设备中心" name="device" :icon="PageCur === 'device'
+        ? '/static/navIcon/sbzx-active.svg'
+        : '/static/navIcon/sbzx.svg'
+        "></u-tabbar-item>
+      <u-tabbar-item v-show="menus.warndata != null" text="预警分析" name="warndata" :icon="PageCur === 'warndata'
+        ? '/static/navIcon/yjfx-active.svg'
+        : '/static/navIcon/yjfx.svg'
+        "></u-tabbar-item>
       <u-tabbar-item
-        v-show="menus.device != null"
-        text="设备中心"
-        name="device"
-        :icon="
-          PageCur === 'device'
-            ? '/static/navIcon/device-active.png'
-            : '/static/navIcon/device.png'
-        "
-      ></u-tabbar-item>
-      <u-tabbar-item
-        v-show="menus.warndata != null"
-        text="预警分析"
-        name="warndata"
-        :icon="
-          PageCur === 'warndata'
-            ? '/static/navIcon/yjfx-active.png'
-            : '/static/navIcon/yjfx.png'
-        "
-      ></u-tabbar-item>
-      <u-tabbar-item
-        v-show="menus.filecenter != null"
-        text="文件共享"
-        name="filecenter"
-        :icon="
-          PageCur === 'filecenter'
-            ? '/static/navIcon/file-active.png'
-            : '/static/navIcon/file.png'
-        "
-      ></u-tabbar-item>
-      <u-tabbar-item
-        v-show="menus.gasreport != null"
-        text="瓦斯日报"
-        name="gasreport"
-        :icon="
-          PageCur === 'gasreport'
-            ? '/static/navIcon/gas-active.png'
-            : '/static/navIcon/gas.png'
-        "
-      ></u-tabbar-item>
-      <u-tabbar-item
-        text="我的"
-        name="user"
-        :icon="
-          PageCur === 'user'
-            ? '/static/navIcon/user-active.png'
-            : '/static/navIcon/user.png'
-        "
-      ></u-tabbar-item>
+        text=""
+        name=""
+        :customStyle="{ marginTop: '0rpx' }"
+      >
+        <view slot="active-icon" class="sw-tab-icon">
+          <image
+            class="sw-tab-img"
+            src="/static/navIcon/sw.svg"
+            mode="aspectFit"
+          ></image>
+        </view>
+        <view slot="inactive-icon" class="sw-tab-icon">
+          <image
+            class="sw-tab-img"
+            src="/static/navIcon/sw.svg"
+            mode="aspectFit"
+          ></image>
+        </view>
+      </u-tabbar-item>
+
+      <u-tabbar-item v-show="menus.filecenter != null" text="文件共享" name="filecenter" :icon="PageCur === 'filecenter'
+        ? '/static/navIcon/wjgx-active.svg'
+        : '/static/navIcon/wjgx.svg'
+        "></u-tabbar-item>
+      <!-- <u-tabbar-item v-show="menus.gasreport != null" text="瓦斯日报" name="gasreport" :icon="PageCur === 'gasreport'
+          ? '/static/navIcon/gas-active.png'
+          : '/static/navIcon/gas.png'
+        "></u-tabbar-item> -->
+      <u-tabbar-item text="我的" name="user" :icon="PageCur === 'user'
+        ? '/static/navIcon/user-active.png'
+        : '/static/navIcon/user.png'
+        "></u-tabbar-item>
     </u-tabbar>
   </view>
 </template>
@@ -202,9 +179,9 @@ export default {
   },
   onLoad() {
     this.changeWV();
-     
+
   },
-  mounted() {},
+  mounted() { },
   onShow() {
     // this.changeWV()
   },
@@ -212,7 +189,7 @@ export default {
     this.changeWV();
   },
   methods: {
-  
+
 
     NavChange: function (e) {
       this.PageCur = e;
@@ -244,9 +221,9 @@ export default {
           _this.wvHeight = _this.isLandScape
             ? sysinfo.windowHeight - sysinfo.statusBarHeight - 20
             : sysinfo.windowHeight -
-              sysinfo.statusBarHeight -
-              sysinfo.statusBarHeight -
-              38;
+            sysinfo.statusBarHeight -
+            sysinfo.statusBarHeight -
+            38;
           _this.wvWidth = _this.isLandScape
             ? sysinfo.windowWidth
             : sysinfo.windowWidth;
@@ -263,12 +240,31 @@ export default {
 <style>
 .app-container {
   width: 100%;
-  height: 100%;
+  height: 100vh;
+  background: url('../../static/desk-img/1-3.png') no-repeat;
+  background-size: 100% auto;
 }
+
 .loadding-box {
   position: absolute;
   display: flex;
   justify-content: center;
   align-items: center;
 }
+
+.sw-tab-icon {
+  width: 104rpx;
+  height: 84rpx;
+  border-radius: 16rpx;
+  background: linear-gradient(180deg, #4da3ff 0%, #007aff 100%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  box-shadow: 0 6rpx 16rpx rgba(0, 122, 255, 0.35);
+}
+
+.sw-tab-img {
+  width: 56rpx;
+  height: 56rpx;
+}
 </style>

pages/login/login copy.vue

@@ -0,0 +1,494 @@
+  <template>
+    <view class="zai-box">
+      <u-icon name="setting-fill" color="#2979ff" size="28" @click="setIp"></u-icon>
+      <scroll-view scroll-y class="page" v-if="!ipShow">
+        <view class="text-center" :style="[{ animation: 'show ' + 0.4 + 's 1' }]">
+          <!-- <image src="/static/desk-img/logo-lblt.png" mode='aspectFit' class="zai-logo "></image> -->
+          <image src="/static/desk-img/logo.png" mode='aspectFit' class="zai-logo "></image>
+          <!-- <image src="/static/dhz-logo.png" mode='aspectFit' class="zai-logo "></image> -->
+        </view>
+        <view class="text-center" :style="[{ animation: 'show ' + 0.4 + 's 1' }]">
+          <!-- <u-link  class="zai-title2 text-shadow " href="http://localhost:8080?ticket=234" >切换单点登录</u-link> -->
+          <view class="zai-title2 text-shadow " @click="changeloginType">切换单点登录</view>
+        </view>
+        <view class="box padding-lr-xl login-paddingtop" :style="[{ animation: 'show ' + 0.6 + 's 1' }]">
+          <block>
+            <view class="cu-form-group margin-top  shadow-warp" :class="[shape == 'round' ? 'round' : '']">
+              <view class="title"><text class="cuIcon-people margin-right-xs"></text>账号:</view>
+              <input placeholder="请输入账号" name="input" v-model="userName"></input>
+            </view>
+            <view class="cu-form-group margin-top shadow-warp" :class="[shape == 'round' ? 'round' : '']">
+              <view class="title"><text class="cuIcon-lock margin-right-xs"></text>密码:</view>
+              <input class="uni-input" placeholder="请输入密码" :password="!showPassword" v-model="password" />
+              <view class="action text-lg">
+                <text :class="[showPassword ? 'cuIcon-attention' : 'cuIcon-attentionforbid']"
+                  @click="changePassword"></text>
+              </view>
+            </view>
+            <view class="padding text-center margin-top">
+              <button class="cu-btn bg-blue lg margin-right shadow" :loading="loading"
+                :class="[shape == 'round' ? 'round' : '']" @tap="onLogin"><text space="emsp">{{ loading ? "登录中..." :
+                  "登录" }}</text>
+              </button>
+            </view>
+          </block>
+          <!-- #ifdef APP-PLUS -->
+          <view class="padding flex flex-direction  text-center">
+            当前版本:{{ version }}
+          </view>
+          <!-- #endif -->
+
+        </view>
+      </scroll-view>
+      <!-- 登录加载弹窗 -->
+      <view class="cu-load load-modal" v-if="loading">
+        <!-- <view class="cuIcon-emojifill text-orange"></view> -->
+        <image src="/static/desk-img/144.png" mode="aspectFit" class="round"></image>
+        <view class="gray-text">登录中...</view>
+      </view>
+      <scroll-view scroll-y class="page" v-if="ipShow">
+        <!-- <view class="IPSet">
+            <span class="text-style">IP地址：  <u--input
+              placeholder="请输入IP地址"
+              border="surround"
+              v-model="IPValue"
+            ></u--input></span>
+            <span class="text-style">端口号：  <u--input
+              placeholder="请输入端口号"
+              border="surround"
+              v-model="PortValue"
+            ></u--input></span>
+            <span class="text-style"><u-button :plain="true" color="#18a5ff" size="small" @tap="saveIP()">保存</u-button></span>
+        </view> -->
+        <!-- <scroll-view scroll-y class="page"> -->
+        <view class="IPSet">
+          <span class="text-style"><u-button :plain="true" color="#18a5ff" size="small" :text="IPSet ? IPSet : '选择IP地址'"
+              @tap="changeIP()"></u-button></span>
+          <u-picker :show="ipShow1" :columns="IpConfig" @cancel="ipShow = false" @confirm="selectIpAddr"
+            keyName="label"></u-picker>
+        </view>
+        <!-- </scroll-view> -->
+      </scroll-view>
+    </view>
+
+  </template>
+
+<script>
+import { ACCESS_TOKEN, USER_NAME, USER_INFO } from "@/common/util/constants";
+import { mapActions } from "vuex";
+import configService from "@/common/service/config.service.js";
+import { AesEncryption, getLoginCipher } from "@/common/util/cipher.js";
+
+import api from "@/api/api";
+export default {
+  data() {
+    return {
+      ipShow: false,
+      ipShow1: false,
+      shape: "", //round 圆形
+      loading: false,
+      userName: "",
+      password: "",
+      phoneNo: "",
+      smsCode: "",
+      showPassword: false, //是否显示明文
+      smsCountDown: 0,
+      smsCountInterval: null,
+      toggleDelay: false,
+      version: "",
+      //第三方登录相关信息
+      thirdType: "",
+      thirdLoginInfo: "",
+      thirdLoginState: false,
+      bindingPhoneModal: false,
+      thirdUserUuid: "",
+      IPValue: "",
+      PortValue: "",
+      fullIPVal: "", //完整IP地址
+      IPSet: "",
+      IpConfig: [
+        [
+          { label: "棋盘井", value: "http://10.35.116.82:9999", code: 'qpj' },
+          { label: "准东二矿", value: "http://172.19.7.101:9999", code: 'zdrk' },
+          { label: "大海则煤矿", value: "http://172.16.53.16:9999", code: 'dhz' },
+          { label: "大柳塔井", value: "http://10.248.135.10:9999", code: 'dlt' },
+          { label: "活鸡兔井", value: "http://10.248.135.121:9999", code: 'hjt' },
+          { label: "寸草塔二矿", value: "http://10.246.63.5:9999", code: 'cctr' },
+          { label: "乌兰木伦", value: "http://10.246.183.35:9999", code: 'wlml' },
+          { label: "哈拉沟煤矿", value: "http://10.248.223.12:9999", code: 'hlg' },
+          { label: "布尔台", value: "http://10.246.95.4:9999", code: 'brt' },
+          { label: "上湾", value: "http://10.246.167.205:9999", code: 'sw' },
+          { label: "锦界", value: "http://10.248.151.42:9999", code: 'jj' },
+          { label: "补连塔", value: "http://10.246.175.16:9999", code: 'blt' },
+          { label: "寸草塔", value: "http://10.246.23.171:9999", code: 'cct' },
+          { label: "柳塔", value: "http://10.246.87.121:9999", code: 'lt' },
+          { label: "石圪台", value: "http://10.246.191.13:9999", code: 'sgt' },
+          { label: "榆家梁", value: "http://10.248.143.211:9999", code: 'yjl' },
+          { label: "开发", value: "http://182.92.126.35:9999", code: 'kf' },
+          { label: "测试", value: "http://182.92.126.35:9998", code: 'cs' },
+          { label: "特拉布拉", value: "http://10.7.0.19:9999", code: 'lblt' },
+        ],
+      ],
+    };
+  },
+  onLoad: function (option) {
+    console.log("=======option.ticket======" + JSON.stringify(option.ticket));
+    this.loginCas(option.ticket);
+    // #ifdef APP-PLUS
+    var that = this;
+    plus.runtime.getProperty(plus.runtime.appid, function (wgtinfo) {
+      that.version = wgtinfo.version;
+    });
+    // #endif
+  },
+  computed: {
+    isSendSMSEnable() {
+      return this.smsCountDown <= 0 && this.phoneNo.length > 4;
+    },
+    getSendBtnText() {
+      if (this.smsCountDown > 0) {
+        return this.smsCountDown + "秒后发送";
+      } else {
+        return "发送验证码";
+      }
+    },
+    canSMSLogin() {
+      return this.userName.length > 4 && this.smsCode.length > 4;
+    },
+    canPwdLogin() {
+      return this.userName.length > 4 && this.password.length > 4;
+    },
+  },
+  methods: {
+    ...mapActions(["mLogin", "PhoneLogin", "ThirdLogin"]),
+
+    // 判断是否在APP环境中
+    isApp() {
+      return typeof plus !== "undefined";
+    },
+
+    onLogin: function () {
+      if (!this.userName || this.userName.length == 0) {
+        this.$tip.toast("请填写用户名");
+        return;
+      }
+      if (!this.password || this.password.length == 0) {
+        this.$tip.toast("请填写密码");
+        return;
+      }
+      let loginParams = {
+        username: this.userName,
+        password: this.password,
+        clientId: uni.getStorageSync('push_cid')
+      };
+      // 加密
+      const loginCipher = getLoginCipher();
+      const encryption = new AesEncryption({
+        key: loginCipher.key,
+        iv: loginCipher.iv,
+      });
+      loginParams.password = encryption.encryptByAES(loginParams.password);
+      this.loading = true;
+      this.mLogin(loginParams)
+        .then((res) => {
+          this.loading = false;
+          if (res.data.success) {
+            if (this.isApp()) {
+              // console.log('当前是APP环境');
+              this.saveClientId();
+            } else {
+              this.getPermissionList();
+            }
+            // #ifdef APP-PLUS
+
+            // #endif
+            // #ifndef APP-PLUS
+            // #endif
+          } else {
+            this.$tip.alert(res.data.message);
+          }
+        })
+        .catch((err) => {
+          let msg = err.data.message || "请求出现错误，请稍后再试";
+          this.loading = false;
+          this.$tip.alert(msg);
+        })
+        .finally(() => {
+          this.loading = false;
+        });
+    },
+
+    loginCas(value) {
+      var than = this;
+
+      // this.$tip.success(configService.apiUrl);
+      var ser = configService.apiUrl;
+      ser = ser.replace(9999, 8092);
+      // this.$tip.success(ser);
+      new Promise((resolve, reject) => {
+        api
+          .validateCasLogin(
+            "",
+            "?ticket=" + value + "&service=" + encodeURIComponent(ser)
+          )
+          .then((response) => {
+            // than.$tip.success("登录成功1");
+
+            // if (response.data.code == 200) {
+            // 	uni.setStorageSync(ACCESS_TOKEN, response.data.result.token);
+            // } else {
+            // }
+            const result = response.data.result;
+            const userInfo = result.userInfo;
+            uni.setStorageSync(ACCESS_TOKEN, result.token);
+            uni.setStorageSync(USER_INFO, userInfo);
+            console.log("userInfo=" + userInfo);
+            than.$store.commit("SET_TOKEN", result.token);
+            console.log("result.token=" + result.token);
+            than.$store.commit("SET_DICT", result.sysAllDictItems);
+            than.$store.commit("SET_AVATAR", userInfo.avatar);
+            than.$store.commit("SET_NAME", {
+              username: userInfo.username,
+              realname: userInfo.realname,
+            });
+
+            // than.$tip.success("loginCas=");
+            than.getPermissionList();
+          })
+          .catch((error) => {
+            // debugger;
+            console.log("catch===>response", error);
+            // uni.navigateTo({
+            //   url: "/pages/home/home",
+            // });
+          });
+      });
+    },
+
+    //获取权限菜单
+    getPermissionList() {
+      new Promise((resolve, reject) => {
+        api
+          .getPermission({})
+          .then((response) => {
+            console.log(response, "权限菜单----------------");
+            if (response.statusCode == 200) {
+              let data = response.data.result.menuApp;
+              let dataBtn = response.data.result.appauth;
+              uni.setStorageSync("menuPermission", data);
+              uni.setStorageSync("btnPermission", dataBtn);
+              this.$tip.success("登录成功!");
+              uni.navigateTo({
+                url: "/pages/index/index",
+              });
+            } else {
+              reject(response);
+            }
+          })
+          .catch((error) => {
+            console.log("catch===>response", response);
+            reject(error);
+          });
+      });
+    },
+    saveClientId() {
+      this.getPermissionList();
+      // var info = plus.push.getClientInfo();
+      // var cid = info.clientid;
+      // this.$http
+      //   .get("/sys/user/saveClientId", { params: { clientId: cid } })
+      //   .then((res) => {
+      //     console.log("res::saveClientId>", res);
+      //     //获取权限菜单
+      //     this.getPermissionList();
+      //   });
+    },
+    changePassword() {
+      this.showPassword = !this.showPassword;
+    },
+    onSMSSend() {
+      let smsParams = {};
+      smsParams.mobile = this.phoneNo;
+      smsParams.smsmode = "0";
+      let checkPhone = new RegExp(/^[1]([3-9])[0-9]{9}$/);
+      if (!smsParams.mobile || smsParams.mobile.length == 0) {
+        this.$tip.toast("请输入手机号");
+        return false;
+      }
+      if (!checkPhone.test(smsParams.mobile)) {
+        this.$tip.toast("请输入正确的手机号");
+        return false;
+      }
+      this.$http.post("/sys/sms", smsParams).then((res) => {
+        if (res.data.success) {
+          this.smsCountDown = 60;
+          this.startSMSTimer();
+        } else {
+          this.smsCountDown = 0;
+          this.$tip.toast(res.data.message);
+        }
+      });
+    },
+    startSMSTimer() {
+      this.smsCountInterval = setInterval(() => {
+        this.smsCountDown--;
+        if (this.smsCountDown <= 0) {
+          clearInterval(this.smsCountInterval);
+        }
+      }, 1000);
+    },
+    onSMSLogin() {
+      let checkPhone = new RegExp(/^[1]([3-9])[0-9]{9}$/);
+
+      if (!this.phoneNo || this.phoneNo.length == 0) {
+        this.$tip.toast("请填写手机号");
+        return;
+      }
+      if (!checkPhone.test(this.phoneNo)) {
+        this.$tip.toast("请输入正确的手机号");
+        return false;
+      }
+      if (!this.smsCode || this.smsCode.length == 0) {
+        this.$tip.toast("请填短信验证码");
+        return;
+      }
+      let loginParams = {
+        mobile: this.phoneNo,
+        captcha: this.smsCode,
+      };
+      this.PhoneLogin(loginParams)
+        .then((res) => {
+          console.log("res====》", res);
+          if (res.data.success) {
+            this.$tip.success("登录成功!");
+            uni.navigateTo({
+              url: "/pages/inedx/inedx",
+            });
+          } else {
+            this.$tip.error(res.data.message);
+          }
+        })
+        .catch((err) => {
+          let msg =
+            ((err.response || {}).data || {}).message ||
+            err.data.message ||
+            "请求出现错误，请稍后再试";
+          this.$tip.error(msg);
+        });
+    },
+    loginSuccess() {
+      // 登陆成功，重定向到主页
+      this.$Router.replace({ name: "index" });
+    },
+    requestFailed(err) {
+      this.$message.warning("登录失败");
+    },
+    changeloginType() {
+      console.log("changeloginType====");
+      console.log(configService, "changeloginType====");
+      var tourl = configService.apiUrl;
+      tourl = tourl.replace(9999, 8092);
+      // this.$tip.success("tourl="+tourl);
+      var rastourl =
+        "https://id.shendong.com.cn/default" + "/login?service=" + tourl;
+      // rastourl ="http://182.92.126.35:8092/?ticket=234";
+      console.log("===========" + rastourl);
+      this.openBrowser(rastourl);
+      // window.location.href='/pages/index/index?ticket=123'
+      // this.$router.push({ path: '/pages/index/index?ticket=123',query:"2w354" })
+    },
+    openBrowser(url) {
+      // 使用uni.navigateTo打开内置浏览器
+      console.log("----url---------------" + url);
+      // this.$tip.success("url="+url);
+      uni.navigateTo({
+        url: "/pages/webview/webview?url=" + encodeURIComponent(url),
+      });
+    },
+
+    setIp() {
+      console.log("点击成功");
+      this.ipShow = !this.ipShow;
+    },
+    changeIP() {
+      this.ipShow1 = true;
+    },
+    selectIpAddr(e) {
+      this.ipShow1 = false;
+      const fullURL = e.value[0].value;
+      this.IPSet = e.value[0].label;
+      const apiCode = e.value[0].code
+      configService.apiUrl = fullURL;
+      uni.setStorageSync("apiUrl", configService.apiUrl);
+      uni.setStorageSync("apiCode", apiCode);
+      setTimeout(() => {
+        uni.getStorageSync("apiUrl");
+      }, 100);
+      uni.navigateTo({ url: "/pages/login/login" });
+    },
+  },
+  beforeDestroy() {
+    if (this.smsCountInterval) {
+      clearInterval(this.smsCountInterval);
+    }
+  },
+};
+</script>
+
+<style>
+.login-paddingtop {
+  padding-top: 300upx;
+}
+
+.zai-box {
+  height: 100vh;
+  background-image: url(/static/desk-img/loginBg.png);
+  background-size: cover;
+  padding: 0 20upx;
+  padding-top: 100upx;
+  position: relative;
+}
+
+.zai-logo {
+  width: 200upx;
+  height: 150px;
+}
+
+.zai-title {
+  margin-top: 20upx;
+  font-size: 58upx;
+  color: #000000;
+  text-align: center;
+}
+
+.input-placeholder,
+.zai-input {
+  color: #94afce;
+}
+
+.zai-btn {
+  background: #ff65a3;
+  color: #fff;
+  border: 0;
+  border-radius: 100upx;
+  font-size: 36upx;
+}
+
+.zai-btn:after {
+  border: 0;
+}
+
+/*按钮点击效果*/
+.zai-btn.button-hover {
+  transform: translate(1upx, 1upx);
+}
+
+.IPSet {
+  display: flex;
+  flex-direction: column;
+}
+
+.text-style {
+  margin: 20px;
+}
+</style>

pages/login/login.vue

@@ -1,77 +1,94 @@
-  <template>
-    <view class="zai-box">
-      <u-icon name="setting-fill" color="#2979ff" size="28" @click="setIp"></u-icon>
-      <scroll-view scroll-y class="page" v-if="!ipShow">
-        <view class="text-center" :style="[{ animation: 'show ' + 0.4 + 's 1' }]">
-          <!-- <image src="/static/desk-img/logo-lblt.png" mode='aspectFit' class="zai-logo "></image> -->
-          <image src="/static/desk-img/logo.png" mode='aspectFit' class="zai-logo "></image>
-          <!-- <image src="/static/dhz-logo.png" mode='aspectFit' class="zai-logo "></image> -->
+<template>
+  <view class="login-page">
+    <!-- 顶部插画区 -->
+    <view class="login-header">
+      <image class="header-bg" src="/static/desk-img/1-2.png" mode="aspectFill"></image>
+      <view class="header-mask"></view>
+      <view class="header-content">
+        <view class="header-top">
+          <image class="logo" src="/static/desk-img/1-1.png" mode="aspectFit"></image>
+          <u-icon name="setting-fill" color="#2979ff" size="22" @click="setIp"></u-icon>
         </view>
-        <view class="text-center" :style="[{ animation: 'show ' + 0.4 + 's 1' }]">
-          <!-- <u-link  class="zai-title2 text-shadow " href="http://localhost:8080?ticket=234" >切换单点登录</u-link> -->
-          <view class="zai-title2 text-shadow " @click="changeloginType">切换单点登录</view>
-        </view>
-        <view class="box padding-lr-xl login-paddingtop" :style="[{ animation: 'show ' + 0.6 + 's 1' }]">
-          <block>
-            <view class="cu-form-group margin-top  shadow-warp" :class="[shape == 'round' ? 'round' : '']">
-              <view class="title"><text class="cuIcon-people margin-right-xs"></text>账号:</view>
-              <input placeholder="请输入账号" name="input" v-model="userName"></input>
-            </view>
-            <view class="cu-form-group margin-top shadow-warp" :class="[shape == 'round' ? 'round' : '']">
-              <view class="title"><text class="cuIcon-lock margin-right-xs"></text>密码:</view>
-              <input class="uni-input" placeholder="请输入密码" :password="!showPassword" v-model="password" />
-              <view class="action text-lg">
-                <text :class="[showPassword ? 'cuIcon-attention' : 'cuIcon-attentionforbid']"
-                  @click="changePassword"></text>
-              </view>
-            </view>
-            <view class="padding text-center margin-top">
-              <button class="cu-btn bg-blue lg margin-right shadow" :loading="loading"
-                :class="[shape == 'round' ? 'round' : '']" @tap="onLogin"><text space="emsp">{{ loading ? "登录中..." :
-                  "登录" }}</text>
-              </button>
-            </view>
-          </block>
-          <!-- #ifdef APP-PLUS -->
-          <view class="padding flex flex-direction  text-center">
-            当前版本:{{ version }}
-          </view>
-          <!-- #endif -->
+        <view class="welcome-text">您好，欢迎使用</view>
+        <view class="platform-name">“一通三防”智能管控平台</view>
+      </view>
+    </view>
 
+    <!-- 登录表单 -->
+    <view class="login-body" v-if="!ipShow">
+      <view class="form-area">
+        <view class="input-item">
+          <u-icon name="account-fill" color="#2979ff" size="22"></u-icon>
+          <input
+            class="input-field"
+            placeholder="账号"
+            placeholder-class="input-placeholder"
+            v-model="userName"
+          />
         </view>
-      </scroll-view>
-      <!-- 登录加载弹窗 -->
-      <view class="cu-load load-modal" v-if="loading">
-        <!-- <view class="cuIcon-emojifill text-orange"></view> -->
-        <image src="/static/desk-img/144.png" mode="aspectFit" class="round"></image>
-        <view class="gray-text">登录中...</view>
-      </view>
-      <scroll-view scroll-y class="page" v-if="ipShow">
-        <!-- <view class="IPSet">
-            <span class="text-style">IP地址：  <u--input
-              placeholder="请输入IP地址"
-              border="surround"
-              v-model="IPValue"
-            ></u--input></span>
-            <span class="text-style">端口号：  <u--input
-              placeholder="请输入端口号"
-              border="surround"
-              v-model="PortValue"
-            ></u--input></span>
-            <span class="text-style"><u-button :plain="true" color="#18a5ff" size="small" @tap="saveIP()">保存</u-button></span>
-        </view> -->
-        <!-- <scroll-view scroll-y class="page"> -->
-        <view class="IPSet">
-          <span class="text-style"><u-button :plain="true" color="#18a5ff" size="small" :text="IPSet ? IPSet : '选择IP地址'"
-              @tap="changeIP()"></u-button></span>
-          <u-picker :show="ipShow1" :columns="IpConfig" @cancel="ipShow = false" @confirm="selectIpAddr"
-            keyName="label"></u-picker>
+        <view class="input-item">
+          <u-icon name="lock-fill" color="#2979ff" size="22"></u-icon>
+          <input
+            class="input-field"
+            placeholder="密码"
+            placeholder-class="input-placeholder"
+            :password="!showPassword"
+            v-model="password"
+          />
+          <u-icon
+            :name="showPassword ? 'eye-fill' : 'eye-off'"
+            color="#2979ff"
+            size="22"
+            @click="changePassword"
+          ></u-icon>
         </view>
-        <!-- </scroll-view> -->
-      </scroll-view>
+        <view class="sso-link" @click="changeloginType">切换单点登录</view>
+      </view>
+
+      <view class="footer-area">
+        <button
+          class="login-btn"
+          :loading="loading"
+          :disabled="loading"
+          @tap="onLogin"
+        >
+          {{ loading ? "登录中..." : "登录" }}
+        </button>
+        <!-- #ifdef APP-PLUS -->
+        <view class="version-text">当前版本:{{ version }}</view>
+        <!-- #endif -->
+      </view>
+    </view>
+
+    <!-- 登录加载弹窗 -->
+    <view class="cu-load load-modal" v-if="loading">
+      <image src="/static/desk-img/144.png" mode="aspectFit" class="round"></image>
+      <view class="gray-text">登录中...</view>
     </view>
 
-  </template>
+    <!-- IP 配置 -->
+    <view class="ip-panel" v-if="ipShow">
+      <view class="IPSet">
+        <span class="text-style">
+          <u-button
+            :plain="true"
+            color="#18a5ff"
+            size="small"
+            :text="IPSet ? IPSet : '选择IP地址'"
+            @tap="changeIP()"
+          ></u-button>
+        </span>
+        <u-picker
+          :show="ipShow1"
+          :columns="IpConfig"
+          @cancel="ipShow = false"
+          @confirm="selectIpAddr"
+          keyName="label"
+        ></u-picker>
+      </view>
+    </view>
+  </view>
+</template>
 
 <script>
 import { ACCESS_TOKEN, USER_NAME, USER_INFO } from "@/common/util/constants";
@@ -435,52 +452,166 @@ export default {
 };
 </script>
 
-<style>
-.login-paddingtop {
-  padding-top: 300upx;
+<style scoped>
+.login-page {
+  min-height: 100vh;
+  background: #ffffff;
+  display: flex;
+  flex-direction: column;
+  position: relative;
+  overflow: hidden;
 }
 
-.zai-box {
-  height: 100vh;
-  background-image: url(/static/desk-img/loginBg.png);
-  background-size: cover;
-  padding: 0 20upx;
-  padding-top: 100upx;
+/* ===== 顶部插画 ===== */
+.login-header {
   position: relative;
+  width: 100%;
+  height: 520rpx;
+  flex-shrink: 0;
+}
+
+.header-bg {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  z-index: 0;
+}
+
+.header-mask {
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  height: 160rpx;
+  background: linear-gradient(to bottom, rgba(255, 255, 255, 0), #ffffff);
+  z-index: 1;
+}
+
+.header-content {
+  position: relative;
+  z-index: 2;
+  padding: 88rpx 48rpx 0;
+  box-sizing: border-box;
+}
+
+.header-top {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 36rpx;
+}
+
+.logo {
+  width: 72rpx;
+  height: 84rpx;
+}
+
+.welcome-text {
+  font-size: 36rpx;
+  color: #1a1a1a;
+  font-weight: 500;
+  line-height: 1.4;
+  margin-bottom: 12rpx;
+}
+
+.platform-name {
+  font-size: 40rpx;
+  color: #111111;
+  font-weight: 700;
+  line-height: 1.4;
+  letter-spacing: 1rpx;
+}
+
+/* ===== 表单区 ===== */
+.login-body {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+  padding: 40rpx 48rpx 80rpx;
+  box-sizing: border-box;
+  background: #ffffff;
 }
 
-.zai-logo {
-  width: 200upx;
-  height: 150px;
+.form-area {
+  width: 100%;
 }
 
-.zai-title {
-  margin-top: 20upx;
-  font-size: 58upx;
-  color: #000000;
+.input-item {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  height: 96rpx;
+  padding: 0 28rpx;
+  margin-bottom: 28rpx;
+  background: #eff3ff;
+  border-radius: 16rpx;
+  box-sizing: border-box;
+}
+
+.input-field {
+  flex: 1;
+  height: 96rpx;
+  margin-left: 20rpx;
+  font-size: 30rpx;
+  color: #333333;
+}
+
+.input-placeholder {
+  color: #9aa3b5;
+  font-size: 30rpx;
+}
+
+.sso-link {
+  margin-top: 8rpx;
+  text-align: right;
+  font-size: 26rpx;
+  color: #2979ff;
+}
+
+/* ===== 底部登录 ===== */
+.footer-area {
+  width: 100%;
+  padding-bottom: env(safe-area-inset-bottom);
+}
+
+.login-btn {
+  width: 100%;
+  height: 96rpx;
+  line-height: 96rpx;
+  background: #007aff;
+  color: #ffffff;
+  font-size: 34rpx;
+  font-weight: 600;
+  border-radius: 48rpx;
+  border: none;
   text-align: center;
+  padding: 0;
 }
 
-.input-placeholder,
-.zai-input {
-  color: #94afce;
+.login-btn::after {
+  border: none;
 }
 
-.zai-btn {
-  background: #ff65a3;
-  color: #fff;
-  border: 0;
-  border-radius: 100upx;
-  font-size: 36upx;
+.login-btn[disabled] {
+  opacity: 0.75;
 }
 
-.zai-btn:after {
-  border: 0;
+.version-text {
+  margin-top: 24rpx;
+  text-align: center;
+  font-size: 24rpx;
+  color: #999999;
 }
 
-/*按钮点击效果*/
-.zai-btn.button-hover {
-  transform: translate(1upx, 1upx);
+/* ===== IP 配置 ===== */
+.ip-panel {
+  flex: 1;
+  background: #ffffff;
+  padding: 40rpx 48rpx;
 }
 
 .IPSet {

static/filecenter/上传时间.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="28" viewBox="0 0 28 28">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_56238" data-name="路径 56238" d="M77.5,91A13.5,13.5,0,1,1,91,77.5,13.5,13.5,0,0,1,77.5,91Zm0-3.857A9.643,9.643,0,1,0,67.857,77.5,9.643,9.643,0,0,0,77.5,87.143Zm7.749-11.571v3.857H75.571V69.786h3.857v5.786Z" transform="translate(-63.5 -63.5)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

static/filecenter/关闭.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16.912" height="16.912" viewBox="0 0 16.912 16.912">
+  <path id="路径_56280" data-name="路径 56280" d="M33.878,27.061l6.887-6.889a.9.9,0,0,0,0-1.268l-.038-.038a.9.9,0,0,0-1.268,0l-6.886,6.9-6.886-6.9a.9.9,0,0,0-1.268,0l-.037.038a.885.885,0,0,0,0,1.268l6.886,6.889-6.886,6.888a.9.9,0,0,0,0,1.268l.037.038a.9.9,0,0,0,1.268,0l6.886-6.888,6.886,6.888a.9.9,0,0,0,1.268,0l.038-.037a.9.9,0,0,0,0-1.268Z" transform="translate(-24.114 -18.604)" fill="#0065f8"/>
+</svg>

static/filecenter/创建人.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="27.253" height="26.132" viewBox="0 0 27.253 26.132">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_56236" data-name="路径 56236" d="M83.607,115.751a.911.911,0,0,1-.913-.906v-2.221a10.753,10.753,0,0,1,1.94-6.176,10.992,10.992,0,0,1,4.977-3.943l.332-.132-.282-.22a6.409,6.409,0,0,1-2.5-5.076,6.5,6.5,0,0,1,13,0,6.409,6.409,0,0,1-2.5,5.077l-.281.22.332.132a10.988,10.988,0,0,1,4.977,3.942,10.753,10.753,0,0,1,1.94,6.176v2.221a.911.911,0,0,1-.913.906Zm22.626-3.332c-.011-.608.67-6.595-4.325-9.273-.675-.462-.866-.523-.866-.9a.91.91,0,0,1,.622-.836l.006,0,.006,0c3.516-3.754-.673-8.194-1.319-8.477-.105-.17-.129-.208-.055-.09a5.373,5.373,0,0,1,5.291,5.348,5.313,5.313,0,0,1-1.4,3.587l-.18.2.238.122a8.624,8.624,0,0,1,4.7,7.7v1.718a.91.91,0,0,1-.913.906Z" transform="translate(-82.193 -90.119)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

static/filecenter/删除.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="33.652" height="36" viewBox="0 0 33.652 36">
+  <g id="组_15422" data-name="组 15422" transform="translate(-36.102)">
+    <path id="路径_56282" data-name="路径 56282" d="M53.2,0a6.8,6.8,0,0,0-6.791,6.57H37.831a1.728,1.728,0,1,0,0,3.456h1.91V29.394C39.741,33.03,42.21,36,45.254,36H60.782c3.044,0,5.512-2.952,5.512-6.606V10.045h1.729a1.728,1.728,0,1,0,0-3.456H59.972A6.773,6.773,0,0,0,53.2,0ZM49.406,6.261a3.546,3.546,0,0,1,7.043,0H49.406Zm-3.96,26.59c-1.1,0-2.3-1.384-2.3-3.36V10.174H63.493V29.508c0,1.977-1.2,3.36-2.3,3.36H45.446v-.018Z" transform="translate(0 0)" fill="#0068fb"/>
+    <path id="路径_56283" data-name="路径 56283" d="M325.411,433.858a1.649,1.649,0,0,0,1.565-1.726v-9.851a1.573,1.573,0,1,0-3.13,0v9.851a1.637,1.637,0,0,0,1.566,1.726Zm5.478,0a1.65,1.65,0,0,0,1.566-1.726v-9.851a1.573,1.573,0,1,0-3.131,0v9.851a1.65,1.65,0,0,0,1.566,1.726Zm4.7,0a1.65,1.65,0,0,0,1.565-1.726v-9.851a1.573,1.573,0,1,0-3.13,0v9.851A1.637,1.637,0,0,0,335.585,433.858Z" transform="translate(-277.57 -405.685)" fill="#0068fb"/>
+  </g>
+</svg>

static/filecenter/审批状态.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="21.212" height="26.701" viewBox="0 0 21.212 26.701">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_56279" data-name="路径 56279" d="M168.052,61.65a5.695,5.695,0,0,0-2.935,10.6l-.559,4.491h-4.679A1.767,1.767,0,0,0,158.11,78.5v3.681a1.767,1.767,0,0,0,1.768,1.761h16.113a1.767,1.767,0,0,0,1.768-1.761V78.5a1.767,1.767,0,0,0-1.768-1.761h-4.457l-.558-4.485a5.695,5.695,0,0,0-2.925-10.607Zm9.008,23.738H158.81a.981.981,0,1,0,0,1.962H177.06a.981.981,0,0,0,0-1.962Z" transform="translate(-157.329 -61.15)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

static/filecenter/文件来源.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="30.003" height="26.132" viewBox="0 0 30.003 26.132">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_56278" data-name="路径 56278" d="M45.59,108.526a.96.96,0,0,1,.811-.437H63.644v-2.837a.961.961,0,0,0-.967-.967h-11.1l-1.621-4.319a1,1,0,0,0-.92-.639H38.855a.961.961,0,0,0-.967.967v23.2a.961.961,0,0,0,.967.967H62.677a.971.971,0,0,0,.967-.967l3.118-13.455H46.369l-2.806,2.089a.564.564,0,0,1-.873-.639.644.644,0,0,1,.109-.172l2.791-2.791Z" transform="translate(-37.388 -98.828)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

static/icon-new/dmj.svg

@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="36.359" height="27.94" viewBox="0 0 36.359 27.94">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#cce0ff"/>
+      <stop offset="1" stop-color="#8fbbff"/>
+    </linearGradient>
+  </defs>
+  <g id="组_15193" data-name="组 15193" transform="translate(-8.837 -12.74)">
+    <g id="组_15191" data-name="组 15191" transform="translate(11.087 12.74)" opacity="0.6">
+      <path id="路径_11" data-name="路径 11" d="M138.762,97.28c-5.505,0-7.016,11.01-10.794,11.01s-4.577-2.591-9.5-2.591c-5.505,0-5.829,4.318-5.829,4.318V122.97h34.11V106.779S144.267,97.28,138.762,97.28Z" transform="translate(-112.64 -97.28)" fill="#2663ca"/>
+      <path id="路径_12" data-name="路径 12" d="M139.194,344.551c-5.505,0-7.232,5.181-11.01,5.181s-7.491-6.692-11.658-6.692a4.473,4.473,0,0,0-3.886,2.375v12.953h34.11V348.221S144.7,344.551,139.194,344.551Z" transform="translate(-112.64 -332.678)" fill="#2663ca"/>
+    </g>
+    <g id="组_15192" data-name="组 15192" transform="translate(8.837 14.989)">
+      <path id="路径_11-2" data-name="路径 11" d="M138.762,97.28c-5.505,0-7.016,11.01-10.794,11.01s-4.577-2.591-9.5-2.591c-5.505,0-5.829,4.318-5.829,4.318V122.97h34.11V106.779S144.267,97.28,138.762,97.28Z" transform="translate(-112.64 -97.28)" fill="url(#linear-gradient)"/>
+      <path id="路径_12-2" data-name="路径 12" d="M139.194,344.551c-5.505,0-7.232,5.181-11.01,5.181s-7.491-6.692-11.658-6.692a4.473,4.473,0,0,0-3.886,2.375v12.953h34.11V348.221S144.7,344.551,139.194,344.551Z" transform="translate(-112.64 -332.678)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

static/icon-new/door-icon.svg

@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="31.319" height="28.408" viewBox="0 0 31.319 28.408">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#cce0ff"/>
+      <stop offset="1" stop-color="#8fbbff"/>
+    </linearGradient>
+  </defs>
+  <g id="组_15193" data-name="组 15193" transform="translate(-8.837 -12.989)">
+    <g id="图标_自动风门" transform="translate(10.889 12.989)" opacity="0.6">
+      <path id="路径_55283" data-name="路径 55283" d="M33.4,20.213v16.71l9.538,3.949V16.77Zm1.354,9.608c0,.278-.133.5-.3.5s-.3-.225-.3-.5V27.815c0-.278.136-.5.3-.5s.3.224.3.5ZM19.34,16.77v24.1l9.538-3.949V20.213Zm8.785,13.051c0,.278-.135.5-.3.5s-.293-.225-.293-.5V27.815c0-.278.135-.5.293-.5s.3.224.3.5Z" transform="translate(-16.504 -15.767)" fill="#2663ca"/>
+      <path id="路径_55284" data-name="路径 55284" d="M28.434,34.761h-1.3v-23.1A1.755,1.755,0,0,0,25.382,9.91H3.792a1.755,1.755,0,0,0-1.755,1.755h0v23.1H.739a.753.753,0,1,0,0,1.505H28.434a.753.753,0,1,0,0-1.505ZM11.573,14.9V30.558L3.54,33.886v-21.9Zm1.04,16.873a.752.752,0,0,0,.467-.7V14.357a.75.75,0,0,0-.5-.708L6.4,11.414H22.777l-6.183,2.235a.75.75,0,0,0-.5.708V31.065a.752.752,0,0,0,.467.7l7.25,3.013H5.363ZM25.631,11.994V33.886L17.6,30.558V14.9Z" transform="translate(0.047 -9.91)" fill="#2663ca"/>
+    </g>
+    <g id="图标_自动风门-2" data-name="图标_自动风门" transform="translate(8.837 15.041)">
+      <path id="路径_55283-2" data-name="路径 55283" d="M33.4,20.213v16.71l9.538,3.949V16.77Zm1.354,9.608c0,.278-.133.5-.3.5s-.3-.225-.3-.5V27.815c0-.278.136-.5.3-.5s.3.224.3.5ZM19.34,16.77v24.1l9.538-3.949V20.213Zm8.785,13.051c0,.278-.135.5-.3.5s-.293-.225-.293-.5V27.815c0-.278.135-.5.293-.5s.3.224.3.5Z" transform="translate(-16.504 -15.767)" fill="url(#linear-gradient)"/>
+      <path id="路径_55284-2" data-name="路径 55284" d="M28.434,34.761h-1.3v-23.1A1.755,1.755,0,0,0,25.382,9.91H3.792a1.755,1.755,0,0,0-1.755,1.755h0v23.1H.739a.753.753,0,1,0,0,1.505H28.434a.753.753,0,1,0,0-1.505ZM11.573,14.9V30.558L3.54,33.886v-21.9Zm1.04,16.873a.752.752,0,0,0,.467-.7V14.357a.75.75,0,0,0-.5-.708L6.4,11.414H22.777l-6.183,2.235a.75.75,0,0,0-.5.708V31.065a.752.752,0,0,0,.467.7l7.25,3.013H5.363ZM25.631,11.994V33.886L17.6,30.558V14.9Z" transform="translate(0.047 -9.91)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

static/icon-new/fl.svg

@@ -0,0 +1,16 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="32.396" height="29.369" viewBox="0 0 32.396 29.369">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#cce0ff"/>
+      <stop offset="1" stop-color="#8fbbff"/>
+    </linearGradient>
+  </defs>
+  <g id="组_15193" data-name="组 15193" transform="translate(-8.837 -12.989)">
+    <g id="组_15195" data-name="组 15195" transform="translate(10.958 12.989)">
+      <path id="路径_55263" data-name="路径 55263" d="M90.632,137.083a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757h20.436a1.514,1.514,0,0,0,0-3.028h-6.8a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757h6.8a4.541,4.541,0,0,1,0,9.083Zm-4.541,6.055a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757h18.165a.757.757,0,0,1,.757.757v1.514a.757.757,0,0,1-.757.757Zm7.569,6.055a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757H98.2a.757.757,0,0,1,.757.757v1.514a.757.757,0,0,1-.757.757Zm7.569-3.028h9.839a4.541,4.541,0,0,1,0,9.083h-6.81a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757h6.81a1.514,1.514,0,0,0,0-3.028h-9.839a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757Z" transform="translate(-85.334 -128)" fill="#2663ca"/>
+    </g>
+    <g id="组_15194" data-name="组 15194" transform="translate(8.837 15.111)">
+      <path id="路径_55263-2" data-name="路径 55263" d="M90.632,137.083a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757h20.436a1.514,1.514,0,0,0,0-3.028h-6.8a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757h6.8a4.541,4.541,0,0,1,0,9.083Zm-4.541,6.055a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757h18.165a.757.757,0,0,1,.757.757v1.514a.757.757,0,0,1-.757.757Zm7.569,6.055a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757H98.2a.757.757,0,0,1,.757.757v1.514a.757.757,0,0,1-.757.757Zm7.569-3.028h9.839a4.541,4.541,0,0,1,0,9.083h-6.81a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757h6.81a1.514,1.514,0,0,0,0-3.028h-9.839a.757.757,0,0,1-.757-.757v-1.514a.757.757,0,0,1,.757-.757Z" transform="translate(-85.334 -128)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

static/icon-new/qyyl-icon.svg

@@ -0,0 +1,18 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="33.897" height="30.829" viewBox="0 0 33.897 30.829">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#cce0ff"/>
+      <stop offset="1" stop-color="#8fbbff"/>
+    </linearGradient>
+  </defs>
+  <g id="组_15193" data-name="组 15193" transform="translate(-8.971 -12.989)">
+    <g id="组_15198" data-name="组 15198" transform="translate(11.198 12.989)" opacity="0.6">
+      <path id="路径_55264" data-name="路径 55264" d="M81.9,131.959l-4.248,1.462a4.273,4.273,0,0,1-3.1-.123l-3.6-1.567a7.473,7.473,0,0,0-6.816.451l-3.656,2.2L62.1,137.1l3.656-2.2a4.291,4.291,0,0,1,3.917-.261l3.6,1.568a7.436,7.436,0,0,0,5.4.211l4.248-1.462a4.282,4.282,0,0,1,3.1.12l4.329,1.877,1.261-2.909-4.329-1.877A7.453,7.453,0,0,0,81.9,131.959Zm8.831-13.79A15.835,15.835,0,0,0,60.3,124.333a16.215,16.215,0,0,0,.247,2.807l.232,1.307h5.139a1.585,1.585,0,1,0,0-3.17H63.5c-.025-.314-.035-.627-.035-.94a12.593,12.593,0,0,1,2.047-6.9l1.106,1.106a1.584,1.584,0,0,0,2.24-2.24l-1.293-1.293a12.64,12.64,0,0,1,6.932-3.237,1.628,1.628,0,0,0-.018.229v1.9a1.585,1.585,0,0,0,3.17,0V112a1.893,1.893,0,0,0-.018-.247A12.683,12.683,0,0,1,88.8,124.333c0,.313-.011.631-.035.94H86.352a1.585,1.585,0,0,0,0,3.17h5.139l.232-1.307a15.874,15.874,0,0,0,.247-2.807A15.63,15.63,0,0,0,90.727,118.169Z" transform="translate(-60.3 -108.5)" fill="#2663ca"/>
+      <path id="路径_55265" data-name="路径 55265" d="M430.321,383.765a1.582,1.582,0,0,0-2.24,0l-4.85,4.85a3.006,3.006,0,0,0-.567-.056,2.864,2.864,0,1,0,2.864,2.864,3.009,3.009,0,0,0-.056-.567l4.85-4.85A1.582,1.582,0,0,0,430.321,383.765Z" transform="translate(-407.137 -373.62)" fill="#2663ca"/>
+    </g>
+    <g id="组_15197" data-name="组 15197" transform="translate(8.971 15.216)">
+      <path id="路径_55264-2" data-name="路径 55264" d="M81.9,131.959l-4.248,1.462a4.273,4.273,0,0,1-3.1-.123l-3.6-1.567a7.473,7.473,0,0,0-6.816.451l-3.656,2.2L62.1,137.1l3.656-2.2a4.291,4.291,0,0,1,3.917-.261l3.6,1.568a7.436,7.436,0,0,0,5.4.211l4.248-1.462a4.282,4.282,0,0,1,3.1.12l4.329,1.877,1.261-2.909-4.329-1.877A7.453,7.453,0,0,0,81.9,131.959Zm8.831-13.79A15.835,15.835,0,0,0,60.3,124.333a16.215,16.215,0,0,0,.247,2.807l.232,1.307h5.139a1.585,1.585,0,1,0,0-3.17H63.5c-.025-.314-.035-.627-.035-.94a12.593,12.593,0,0,1,2.047-6.9l1.106,1.106a1.584,1.584,0,0,0,2.24-2.24l-1.293-1.293a12.64,12.64,0,0,1,6.932-3.237,1.628,1.628,0,0,0-.018.229v1.9a1.585,1.585,0,0,0,3.17,0V112a1.893,1.893,0,0,0-.018-.247A12.683,12.683,0,0,1,88.8,124.333c0,.313-.011.631-.035.94H86.352a1.585,1.585,0,0,0,0,3.17h5.139l.232-1.307a15.874,15.874,0,0,0,.247-2.807A15.63,15.63,0,0,0,90.727,118.169Z" transform="translate(-60.3 -108.5)" fill="url(#linear-gradient)"/>
+      <path id="路径_55265-2" data-name="路径 55265" d="M430.321,383.765a1.582,1.582,0,0,0-2.24,0l-4.85,4.85a3.006,3.006,0,0,0-.567-.056,2.864,2.864,0,1,0,2.864,2.864,3.009,3.009,0,0,0-.056-.567l4.85-4.85A1.582,1.582,0,0,0,430.321,383.765Z" transform="translate(-407.137 -373.62)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

static/navIcon/sbzx-active.svg

@@ -0,0 +1,22 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="45" height="40" viewBox="0 0 45 40">
+  <defs>
+    <linearGradient id="linear-gradient" y1="0.055" x2="1" y2="0.073" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#0068fb"/>
+      <stop offset="1" stop-color="#0068fb" stop-opacity="0"/>
+    </linearGradient>
+  </defs>
+  <g id="组_15302" data-name="组 15302" transform="translate(-29 -1247)">
+    <g id="组_15144" data-name="组 15144" transform="translate(-249 1105)">
+      <rect id="矩形_4343" data-name="矩形 4343" width="40" height="40" transform="translate(283 142)" fill="none"/>
+      <g id="组_15171" data-name="组 15171" transform="translate(222 44.618)" opacity="0.3">
+        <path id="路径_56200" data-name="路径 56200" d="M93.316,551.06H58.684A2.684,2.684,0,0,1,56,548.4V536.6a2.684,2.684,0,0,1,2.684-2.681H93.316A2.684,2.684,0,0,1,96,536.6v11.8a2.684,2.684,0,0,1-2.684,2.663Z" transform="translate(0 -415.577)" fill="url(#linear-gradient)"/>
+        <path id="路径_56201" data-name="路径 56201" d="M93.316,116.42H58.684A2.684,2.684,0,0,1,56,113.74V101.961a2.684,2.684,0,0,1,2.684-2.681H93.316A2.684,2.684,0,0,1,96,101.961V113.74A2.684,2.684,0,0,1,93.316,116.42Z" transform="translate(0)" fill="url(#linear-gradient)"/>
+      </g>
+      <g id="组_15154" data-name="组 15154" transform="translate(227 44.618)">
+        <path id="路径_56200-2" data-name="路径 56200" d="M93.316,551.06H58.684A2.684,2.684,0,0,1,56,548.4V536.6a2.684,2.684,0,0,1,2.684-2.681H93.316A2.684,2.684,0,0,1,96,536.6v11.8a2.684,2.684,0,0,1-2.684,2.663Zm-33.807-3.509H92.491V537.429H59.509Z" transform="translate(0 -415.577)" fill="#0068fb"/>
+        <path id="路径_56201-2" data-name="路径 56201" d="M87.709,128.666H74.095a1.754,1.754,0,0,1,0-3.509H87.709a1.754,1.754,0,1,1,0,3.509Zm-22.33,1.091a2.846,2.846,0,1,1,2.846-2.846A2.846,2.846,0,0,1,65.379,129.757Zm0-3.509a.663.663,0,1,0,.471.193A.667.667,0,0,0,65.379,126.248Zm27.937-9.828H58.684A2.684,2.684,0,0,1,56,113.74V101.961a2.684,2.684,0,0,1,2.684-2.681H93.316A2.684,2.684,0,0,1,96,101.961V113.74A2.684,2.684,0,0,1,93.316,116.42Zm-33.807-3.509H92.491V102.789H59.509Z" transform="translate(0)" fill="#0068fb"/>
+        <path id="路径_56202" data-name="路径 56202" d="M230.136,234.363H216.521a1.754,1.754,0,1,1,0-3.509h13.614a1.754,1.754,0,1,1,0,3.509Zm-22.33,1.088a2.846,2.846,0,1,1,2.846-2.842A2.846,2.846,0,0,1,207.806,235.451Zm0-3.509a.667.667,0,1,0,.667.667A.667.667,0,0,0,207.806,231.942Z" transform="translate(-142.427 -124.757)" fill="#0068fb"/>
+      </g>
+    </g>
+  </g>
+</svg>

static/navIcon/sbzx.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
+  <g id="组_15298" data-name="组 15298" transform="translate(-34 -1247)">
+    <g id="组_15144" data-name="组 15144" transform="translate(-249 1105)">
+      <rect id="矩形_4343" data-name="矩形 4343" width="40" height="40" transform="translate(283 142)" fill="none"/>
+      <g id="组_15154" data-name="组 15154" transform="translate(227 44.618)">
+        <path id="路径_56200" data-name="路径 56200" d="M93.316,551.06H58.684A2.684,2.684,0,0,1,56,548.4V536.6a2.684,2.684,0,0,1,2.684-2.681H93.316A2.684,2.684,0,0,1,96,536.6v11.8a2.684,2.684,0,0,1-2.684,2.663Zm-33.807-3.509H92.491V537.429H59.509Z" transform="translate(0 -415.577)" fill="#a0a8bc"/>
+        <path id="路径_56201" data-name="路径 56201" d="M87.709,128.666H74.095a1.754,1.754,0,0,1,0-3.509H87.709a1.754,1.754,0,1,1,0,3.509Zm-22.33,1.091a2.846,2.846,0,1,1,2.846-2.846A2.846,2.846,0,0,1,65.379,129.757Zm0-3.509a.663.663,0,1,0,.471.193A.667.667,0,0,0,65.379,126.248Zm27.937-9.828H58.684A2.684,2.684,0,0,1,56,113.74V101.961a2.684,2.684,0,0,1,2.684-2.681H93.316A2.684,2.684,0,0,1,96,101.961V113.74A2.684,2.684,0,0,1,93.316,116.42Zm-33.807-3.509H92.491V102.789H59.509Z" transform="translate(0)" fill="#a0a8bc"/>
+        <path id="路径_56202" data-name="路径 56202" d="M230.136,234.363H216.521a1.754,1.754,0,1,1,0-3.509h13.614a1.754,1.754,0,1,1,0,3.509Zm-22.33,1.088a2.846,2.846,0,1,1,2.846-2.842A2.846,2.846,0,0,1,207.806,235.451Zm0-3.509a.667.667,0,1,0,.667.667A.667.667,0,0,0,207.806,231.942Z" transform="translate(-142.427 -124.757)" fill="#a0a8bc"/>
+      </g>
+    </g>
+  </g>
+</svg>

static/navIcon/sw.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="38.014" height="40.125" viewBox="0 0 38.014 40.125">
+  <g id="组_15295" data-name="组 15295" transform="translate(-356 -32)">
+    <g id="组_15293" data-name="组 15293" transform="translate(271.607 -28.875)">
+      <path id="路径_56241" data-name="路径 56241" d="M151.512,124.777H151.3l-19.735-5.628a.682.682,0,0,1-.492-.562.668.668,0,0,1,.281-.7l12.691-9.145a1.051,1.051,0,0,1,.555-.146.628.628,0,0,1,.159.027l19.657,5.606a.684.684,0,0,1,.493.563.668.668,0,0,1-.281.7l-12.7,9.149a1,1,0,0,1-.423.142v0Zm-16.736-6.23,16.337,4.663a.691.691,0,0,0,.594-.1l9.775-7.062a.691.691,0,0,0-.215-1.225l-16.338-4.654a.691.691,0,0,0-.594.1l-9.774,7.052a.691.691,0,0,0,.214,1.225Zm6.162,12.986-.013-.018a.691.691,0,0,1,.149-.977l2.952-2.122a.946.946,0,0,1,.634-.142l3.57,1.01a.691.691,0,1,1-.381,1.329l-2.876-.835a.691.691,0,0,0-.6.1l-2.48,1.795A.691.691,0,0,1,140.938,131.532Zm9.158-.9.007-.024a.691.691,0,0,1,.851-.475l2.193.614a.691.691,0,0,1,.478.855l-.007.025a.691.691,0,0,1-.851.476l-2.192-.615a.691.691,0,0,1-.478-.855Zm-13.225,3.763-.014-.021a.691.691,0,0,1,.187-.957l1.886-1.276a.691.691,0,0,1,.962.188l.015.022a.691.691,0,0,1-.187.957l-1.886,1.275a.691.691,0,0,1-.961-.188Zm18.172-2.345.007-.024a.691.691,0,0,1,.854-.475l1.514.431a.691.691,0,0,1,.475.856l-.007.024a.691.691,0,0,1-.854.474l-1.514-.431a.691.691,0,0,1-.475-.855Z" transform="translate(-44.585 -45.592)" fill="#fff"/>
+      <path id="路径_56242" data-name="路径 56242" d="M151.512,663.142H151.3l-19.735-5.63a.682.682,0,0,1-.492-.562.668.668,0,0,1,.281-.7l3.683-2.637a.691.691,0,0,1,.95.142l.018.024a.691.691,0,0,1-.144.979l-1.3.939a.691.691,0,0,0,.215,1.224l16.343,4.654a.691.691,0,0,0,.594-.1l9.765-7.058a.691.691,0,0,0-.219-1.225l-1.482-.414a.691.691,0,1,1,.375-1.329l4.26,1.216a.682.682,0,0,1,.492.562.668.668,0,0,1-.281.706l-12.541,9.046a.692.692,0,0,1-.266.116,1.5,1.5,0,0,1-.3.055Zm0,0" transform="translate(-44.586 -564.252)" fill="#fff"/>
+      <path id="路径_56243" data-name="路径 56243" d="M132.6,133.562h.016a.935.935,0,0,1,.935.935V152.34a.935.935,0,0,1-.935.935H132.6a.935.935,0,0,1-.935-.935V134.5A.935.935,0,0,1,132.6,133.562Zm19.276,5.63a.935.935,0,0,1,.935.935V157.97a.935.935,0,0,1-.935.935h-.015a.935.935,0,0,1-.935-.936l.015-17.843A.935.935,0,0,1,151.876,139.192Zm-6.6.7h.244a.935.935,0,0,1,.935.935v2.355a.935.935,0,0,1-.935.935h-.244a.935.935,0,0,1-.935-.935v-2.355a.935.935,0,0,1,.935-.935Zm0-7.038h.244a.935.935,0,0,1,.935.935v1.649a.935.935,0,0,1-.935.935h-.244a.935.935,0,0,1-.935-.935v-1.649A.935.935,0,0,1,145.277,132.854Zm0-8.443h.244a.935.935,0,0,1,.935.935V128.4a.935.935,0,0,1-.935.935h-.244a.935.935,0,0,1-.935-.935v-3.059a.935.935,0,0,1,.935-.935Zm19.26,5.63h.016a.935.935,0,0,1,.935.935v17.841a.935.935,0,0,1-.935.935h-.016a.935.935,0,0,1-.935-.935V130.976a.935.935,0,0,1,.935-.935Zm-1.163,0" transform="translate(-45.168 -60.707)" fill="#fff"/>
+      <path id="路径_56244" data-name="路径 56244" d="M106.926,101a2.816,2.816,0,1,1,2.814-2.818A2.816,2.816,0,0,1,106.926,101ZM119.6,91.852a2.812,2.812,0,1,0-.015,0ZM99.88,86.222h0ZM87.2,95.371a2.814,2.814,0,1,1,2.817-2.815A2.814,2.814,0,0,1,87.2,95.371Zm0-19.7a2.813,2.813,0,1,1,2.817-2.815A2.885,2.885,0,0,1,87.2,75.67ZM99.88,66.523a2.561,2.561,0,0,1-1.96-.846,2.778,2.778,0,0,1-.845-1.97,2.824,2.824,0,1,1,2.82,2.815H99.88ZM119.6,72.151a2.812,2.812,0,1,0-.015,0ZM106.926,81.3a2.813,2.813,0,1,1,2.817-2.813A2.813,2.813,0,0,1,106.926,81.3Zm0,0" fill="#fff"/>
+    </g>
+  </g>
+</svg>

static/navIcon/wjgx-active.svg

@@ -0,0 +1,21 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="44.949" height="40" viewBox="0 0 44.949 40">
+  <defs>
+    <linearGradient id="linear-gradient" y1="0.055" x2="1" y2="0.073" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#0068fb"/>
+      <stop offset="1" stop-color="#0068fb" stop-opacity="0"/>
+    </linearGradient>
+  </defs>
+  <g id="组_15304" data-name="组 15304" transform="translate(-29.051 -1247)">
+    <g id="组_15144" data-name="组 15144" transform="translate(-249 1105)">
+      <rect id="矩形_4343" data-name="矩形 4343" width="40" height="40" transform="translate(283 142)" fill="none"/>
+      <g id="组_15172" data-name="组 15172" transform="translate(214.051 78.102)" opacity="0.3">
+        <path id="路径_56204" data-name="路径 56204" d="M220.5,245.374a5.7,5.7,0,1,0-5.7-5.7,5.758,5.758,0,0,0,.263,1.719l-3.3,2.066a4.274,4.274,0,1,0-.232,6.853l4.658,3.335c-.009.094-.013.183-.013.276a2.85,2.85,0,1,0,1.674-2.6L213.2,248a4.285,4.285,0,0,0,.169-1.2,4.5,4.5,0,0,0-.1-.922l3.3-2.071A5.678,5.678,0,0,0,220.5,245.374Z" transform="translate(-122.3 -152.875)" fill="url(#linear-gradient)"/>
+        <path id="路径_56205" data-name="路径 56205" d="M96.729,76.825V66.85A2.853,2.853,0,0,0,93.879,64H66.85A2.853,2.853,0,0,0,64,66.85V98.2a2.853,2.853,0,0,0,2.85,2.85H82.524a1.423,1.423,0,0,0,1.425-1.425C83.949,98.835,96.729,77.613,96.729,76.825Z" transform="translate(0 0)" fill="url(#linear-gradient)"/>
+      </g>
+      <g id="组_15159" data-name="组 15159" transform="translate(219.102 78.102)">
+        <path id="路径_56204-2" data-name="路径 56204" d="M211.949,225.425A1.423,1.423,0,0,0,210.524,224h-17.1a1.425,1.425,0,1,0,0,2.85h17.1A1.423,1.423,0,0,0,211.949,225.425Zm0,8.55a1.423,1.423,0,0,0-1.425-1.425h-17.1a1.425,1.425,0,1,0,0,2.85h17.1A1.423,1.423,0,0,0,211.949,233.975ZM193.425,241.1a1.425,1.425,0,1,0,0,2.85h8.55a1.425,1.425,0,1,0,0-2.85Zm27.074,4.275a5.7,5.7,0,1,0-5.7-5.7,5.758,5.758,0,0,0,.263,1.719l-3.3,2.066a4.274,4.274,0,1,0-.232,6.853l4.658,3.335c-.009.094-.013.183-.013.276a2.85,2.85,0,1,0,1.674-2.6L213.2,248a4.285,4.285,0,0,0,.169-1.2,4.5,4.5,0,0,0-.1-.922l3.3-2.071A5.678,5.678,0,0,0,220.5,245.374Zm0-8.55a2.85,2.85,0,1,1-2.85,2.85A2.853,2.853,0,0,1,220.5,236.824Zm-11.4,11.4a1.425,1.425,0,1,1,1.425-1.425A1.429,1.429,0,0,1,209.1,248.224Z" transform="translate(-122.3 -152.875)" fill="#0068fb"/>
+        <path id="路径_56205-2" data-name="路径 56205" d="M82.524,98.2H68.275a1.423,1.423,0,0,1-1.425-1.425v-28.5a1.423,1.423,0,0,1,1.425-1.425h25.6v9.975a1.425,1.425,0,0,0,2.85,0V66.85A2.853,2.853,0,0,0,93.879,64H66.85A2.853,2.853,0,0,0,64,66.85V98.2a2.853,2.853,0,0,0,2.85,2.85H82.524a1.425,1.425,0,0,0,0-2.85Z" transform="translate(0 0)" fill="#0068fb"/>
+      </g>
+    </g>
+  </g>
+</svg>

static/navIcon/wjgx.svg

@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
+  <g id="组_15300" data-name="组 15300" transform="translate(-34 -1247)">
+    <g id="组_15144" data-name="组 15144" transform="translate(-249 1105)">
+      <rect id="矩形_4343" data-name="矩形 4343" width="40" height="40" transform="translate(283 142)" fill="none"/>
+      <g id="组_15159" data-name="组 15159" transform="translate(219.102 78.102)">
+        <path id="路径_56204" data-name="路径 56204" d="M211.949,225.425A1.423,1.423,0,0,0,210.524,224h-17.1a1.425,1.425,0,1,0,0,2.85h17.1A1.423,1.423,0,0,0,211.949,225.425Zm0,8.55a1.423,1.423,0,0,0-1.425-1.425h-17.1a1.425,1.425,0,1,0,0,2.85h17.1A1.423,1.423,0,0,0,211.949,233.975ZM193.425,241.1a1.425,1.425,0,1,0,0,2.85h8.55a1.425,1.425,0,1,0,0-2.85Zm27.074,4.275a5.7,5.7,0,1,0-5.7-5.7,5.758,5.758,0,0,0,.263,1.719l-3.3,2.066a4.274,4.274,0,1,0-.232,6.853l4.658,3.335c-.009.094-.013.183-.013.276a2.85,2.85,0,1,0,1.674-2.6L213.2,248a4.285,4.285,0,0,0,.169-1.2,4.5,4.5,0,0,0-.1-.922l3.3-2.071A5.678,5.678,0,0,0,220.5,245.374Zm0-8.55a2.85,2.85,0,1,1-2.85,2.85A2.853,2.853,0,0,1,220.5,236.824Zm-11.4,11.4a1.425,1.425,0,1,1,1.425-1.425A1.429,1.429,0,0,1,209.1,248.224Z" transform="translate(-122.3 -152.875)" fill="#a0a8bc"/>
+        <path id="路径_56205" data-name="路径 56205" d="M82.524,98.2H68.275a1.423,1.423,0,0,1-1.425-1.425v-28.5a1.423,1.423,0,0,1,1.425-1.425h25.6v9.975a1.425,1.425,0,0,0,2.85,0V66.85A2.853,2.853,0,0,0,93.879,64H66.85A2.853,2.853,0,0,0,64,66.85V98.2a2.853,2.853,0,0,0,2.85,2.85H82.524a1.425,1.425,0,0,0,0-2.85Z" transform="translate(0 0)" fill="#a0a8bc"/>
+      </g>
+    </g>
+  </g>
+</svg>

static/navIcon/yjfx-active.svg

@@ -0,0 +1,15 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="42.683" height="41" viewBox="0 0 42.683 41">
+  <defs>
+    <linearGradient id="linear-gradient" y1="0.055" x2="1" y2="0.073" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#0068fb"/>
+      <stop offset="1" stop-color="#0068fb" stop-opacity="0"/>
+    </linearGradient>
+  </defs>
+  <g id="组_15303" data-name="组 15303" transform="translate(-31.317 -1246.5)">
+    <g id="组_15144" data-name="组 15144" transform="translate(-249 1105)">
+      <rect id="矩形_4343" data-name="矩形 4343" width="40" height="40" transform="translate(283 142)" fill="none"/>
+      <path id="路径_56209" data-name="路径 56209" d="M228.188,180.2h-31.07l-.268.022a1.7,1.7,0,0,0,.268,3.372h31.069l.268-.022a1.7,1.7,0,0,0-.267-3.372ZM198,166.566v9.815l.018.261a1.736,1.736,0,0,0,1.7,1.509h25.791l.255-.019a1.755,1.755,0,0,0,1.464-1.75v-9.815l-.012-.623a14.613,14.613,0,1,0-29.216.623Zm.853-16.2-.229-.2a1.618,1.618,0,0,0-2.112.2,1.737,1.737,0,0,0,0,2.4l1.626,1.684.229.2a1.618,1.618,0,0,0,2.112-.2,1.737,1.737,0,0,0,0-2.4Zm13.771-1a1.676,1.676,0,0,0,1.649-1.7v-2.382l-.022-.274a1.646,1.646,0,0,0-3.276.274v2.382l.022.274A1.666,1.666,0,0,0,212.629,149.366Zm14.535,5.106,1.626-1.684.189-.235a1.739,1.739,0,0,0-.189-2.161,1.619,1.619,0,0,0-2.341,0l-1.626,1.684-.189.235a1.739,1.739,0,0,0,.189,2.161A1.618,1.618,0,0,0,227.164,154.471Z" transform="translate(85.347 -1.59)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" opacity="0.3" fill="url(#linear-gradient)"/>
+      <path id="路径_56203" data-name="路径 56203" d="M228.188,180.2h-31.07l-.268.022a1.7,1.7,0,0,0,.268,3.372h31.069l.268-.022a1.7,1.7,0,0,0-.267-3.372ZM198,166.566v9.815l.018.261a1.736,1.736,0,0,0,1.7,1.509h25.791l.255-.019a1.755,1.755,0,0,0,1.464-1.75v-9.815l-.012-.623a14.613,14.613,0,1,0-29.216.623Zm14.619-11.213.549.014a11.45,11.45,0,0,1,10.767,11.2l0,8.157H208.051v-7.206l-.022-.274a1.667,1.667,0,0,0-1.627-1.423l-.268.022a1.686,1.686,0,0,0-1.381,1.675l0,7.206h-3.442l0-8.157.014-.552A11.462,11.462,0,0,1,212.624,155.353Zm-13.766-4.992-.229-.2a1.618,1.618,0,0,0-2.112.2,1.737,1.737,0,0,0,0,2.4l1.626,1.684.229.2a1.618,1.618,0,0,0,2.112-.2,1.737,1.737,0,0,0,0-2.4Zm13.771-1a1.676,1.676,0,0,0,1.649-1.7v-2.382l-.022-.274a1.646,1.646,0,0,0-3.276.274v2.382l.022.274A1.666,1.666,0,0,0,212.629,149.366Zm14.535,5.106,1.626-1.684.189-.235a1.739,1.739,0,0,0-.189-2.161,1.619,1.619,0,0,0-2.341,0l-1.626,1.684-.189.235a1.739,1.739,0,0,0,.189,2.161A1.618,1.618,0,0,0,227.164,154.471Z" transform="translate(90.347 -1.59)" fill="#0068fb" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1"/>
+    </g>
+  </g>
+</svg>

static/navIcon/yjfx.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
+  <g id="组_15299" data-name="组 15299" transform="translate(-34 -1247)">
+    <g id="组_15144" data-name="组 15144" transform="translate(-249 1105)">
+      <rect id="矩形_4343" data-name="矩形 4343" width="40" height="40" transform="translate(283 142)" fill="none"/>
+      <path id="路径_56203" data-name="路径 56203" d="M228.188,180.2h-31.07l-.268.022a1.7,1.7,0,0,0,.268,3.372h31.069l.268-.022a1.7,1.7,0,0,0-.267-3.372ZM198,166.566v9.815l.018.261a1.736,1.736,0,0,0,1.7,1.509h25.791l.255-.019a1.755,1.755,0,0,0,1.464-1.75v-9.815l-.012-.623a14.613,14.613,0,1,0-29.216.623Zm14.619-11.213.549.014a11.45,11.45,0,0,1,10.767,11.2l0,8.157H208.051v-7.206l-.022-.274a1.667,1.667,0,0,0-1.627-1.423l-.268.022a1.686,1.686,0,0,0-1.381,1.675l0,7.206h-3.442l0-8.157.014-.552A11.462,11.462,0,0,1,212.624,155.353Zm-13.766-4.992-.229-.2a1.618,1.618,0,0,0-2.112.2,1.737,1.737,0,0,0,0,2.4l1.626,1.684.229.2a1.618,1.618,0,0,0,2.112-.2,1.737,1.737,0,0,0,0-2.4Zm13.771-1a1.676,1.676,0,0,0,1.649-1.7v-2.382l-.022-.274a1.646,1.646,0,0,0-3.276.274v2.382l.022.274A1.666,1.666,0,0,0,212.629,149.366Zm14.535,5.106,1.626-1.684.189-.235a1.739,1.739,0,0,0-.189-2.161,1.619,1.619,0,0,0-2.341,0l-1.626,1.684-.189.235a1.739,1.739,0,0,0,.189,2.161A1.618,1.618,0,0,0,227.164,154.471Z" transform="translate(90.347 -1.59)" fill="#a0a8bc"/>
+    </g>
+  </g>
+</svg>

static/navIcon/瓦斯日报-1.svg

@@ -0,0 +1,11 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40" viewBox="0 0 40 40">
+  <g id="组_15301" data-name="组 15301" transform="translate(-34 -1247)">
+    <g id="组_15144" data-name="组 15144" transform="translate(-249 1105)">
+      <rect id="矩形_4343" data-name="矩形 4343" width="40" height="40" transform="translate(283 142)" fill="none"/>
+      <g id="组_15160" data-name="组 15160" transform="translate(189.667 110)">
+        <path id="路径_56206" data-name="路径 56206" d="M125.333,32h-24A5.333,5.333,0,0,0,96,37.333V66.667A5.333,5.333,0,0,0,101.333,72h24a5.333,5.333,0,0,0,5.333-5.333V37.333A5.333,5.333,0,0,0,125.333,32ZM128,66.667a2.667,2.667,0,0,1-2.667,2.667h-24a2.667,2.667,0,0,1-2.667-2.667V37.333a2.667,2.667,0,0,1,2.667-2.667h24A2.667,2.667,0,0,1,128,37.333Z" fill="#a0a8bc"/>
+        <path id="路径_56207" data-name="路径 56207" d="M245.333,214.667H226.667a1.333,1.333,0,0,0,0,2.667h18.667a1.333,1.333,0,0,0,0-2.667Zm0-6.667H226.667a1.333,1.333,0,0,0,0,2.667h18.667a1.333,1.333,0,0,0,0-2.667Zm0-16a2.667,2.667,0,0,0-2.667,2.667,2.517,2.517,0,0,0,.131.651l-3.48,3.48a2.517,2.517,0,0,0-.651-.131,2.436,2.436,0,0,0-.541.109l-2.235-2.235A2.437,2.437,0,0,0,236,196a2.667,2.667,0,1,0-5.333,0,2.517,2.517,0,0,0,.131.651l-3.48,3.48a2.517,2.517,0,0,0-.651-.131,2.667,2.667,0,1,0,2.667,2.667,2.517,2.517,0,0,0-.131-.651l3.48-3.48a2.517,2.517,0,0,0,.651.131,2.481,2.481,0,0,0,.613-.125l2.179,2.179a2.482,2.482,0,0,0-.125.613,2.667,2.667,0,0,0,5.333,0,2.517,2.517,0,0,0-.131-.651l3.48-3.48a2.517,2.517,0,0,0,.651.131,2.667,2.667,0,0,0,0-5.333Z" transform="translate(-122.667 -153.333)" fill="#a0a8bc"/>
+      </g>
+    </g>
+  </g>
+</svg>

static/navIcon/瓦斯日报-2.svg

@@ -0,0 +1,20 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="42.333" height="40" viewBox="0 0 42.333 40">
+  <defs>
+    <linearGradient id="linear-gradient" y1="0.055" x2="1" y2="0.073" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#0068fb"/>
+      <stop offset="1" stop-color="#0068fb" stop-opacity="0"/>
+    </linearGradient>
+  </defs>
+  <g id="组_15305" data-name="组 15305" transform="translate(-31.667 -1247)">
+    <g id="组_15144" data-name="组 15144" transform="translate(-249 1105)">
+      <rect id="矩形_4343" data-name="矩形 4343" width="40" height="40" transform="translate(283 142)" fill="none"/>
+      <g id="组_15173" data-name="组 15173" transform="translate(184.667 110)" opacity="0.3">
+        <path id="路径_56206" data-name="路径 56206" d="M125.333,32h-24A5.333,5.333,0,0,0,96,37.333V66.667A5.333,5.333,0,0,0,101.333,72h24a5.333,5.333,0,0,0,5.333-5.333V37.333A5.333,5.333,0,0,0,125.333,32Z" fill="url(#linear-gradient)"/>
+      </g>
+      <g id="组_15160" data-name="组 15160" transform="translate(189.667 110)">
+        <path id="路径_56206-2" data-name="路径 56206" d="M125.333,32h-24A5.333,5.333,0,0,0,96,37.333V66.667A5.333,5.333,0,0,0,101.333,72h24a5.333,5.333,0,0,0,5.333-5.333V37.333A5.333,5.333,0,0,0,125.333,32ZM128,66.667a2.667,2.667,0,0,1-2.667,2.667h-24a2.667,2.667,0,0,1-2.667-2.667V37.333a2.667,2.667,0,0,1,2.667-2.667h24A2.667,2.667,0,0,1,128,37.333Z" fill="#0068fb"/>
+        <path id="路径_56207" data-name="路径 56207" d="M245.333,214.667H226.667a1.333,1.333,0,0,0,0,2.667h18.667a1.333,1.333,0,0,0,0-2.667Zm0-6.667H226.667a1.333,1.333,0,0,0,0,2.667h18.667a1.333,1.333,0,0,0,0-2.667Zm0-16a2.667,2.667,0,0,0-2.667,2.667,2.517,2.517,0,0,0,.131.651l-3.48,3.48a2.517,2.517,0,0,0-.651-.131,2.436,2.436,0,0,0-.541.109l-2.235-2.235A2.437,2.437,0,0,0,236,196a2.667,2.667,0,1,0-5.333,0,2.517,2.517,0,0,0,.131.651l-3.48,3.48a2.517,2.517,0,0,0-.651-.131,2.667,2.667,0,1,0,2.667,2.667,2.517,2.517,0,0,0-.131-.651l3.48-3.48a2.517,2.517,0,0,0,.651.131,2.481,2.481,0,0,0,.613-.125l2.179,2.179a2.482,2.482,0,0,0-.125.613,2.667,2.667,0,0,0,5.333,0,2.517,2.517,0,0,0-.131-.651l3.48-3.48a2.517,2.517,0,0,0,.651.131,2.667,2.667,0,0,0,0-5.333Z" transform="translate(-122.667 -153.333)" fill="#0068fb"/>
+      </g>
+    </g>
+  </g>
+</svg>

static/warndata/C2H4.svg

@@ -0,0 +1,22 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="39.52" height="20.039" viewBox="0 0 39.52 20.039">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <g id="C_H_2" data-name="C H 2" transform="translate(-898.614 -562.47)">
+    <g id="组_15355" data-name="组 15355" transform="translate(898.614 562.47)" style="isolation: isolate">
+      <path id="路径_56255" data-name="路径 56255" d="M901.013,581.3a4.85,4.85,0,0,1-1.752-1.74,4.6,4.6,0,0,1-.647-2.387v-9.928a4.6,4.6,0,0,1,.647-2.388,4.856,4.856,0,0,1,1.752-1.74,4.661,4.661,0,0,1,2.4-.647H905a4.663,4.663,0,0,1,2.4.647,4.767,4.767,0,0,1,1.74,1.74,4.666,4.666,0,0,1,.636,2.388v.6h-2.187v-.6A2.59,2.59,0,0,0,905,564.656h-1.584a2.485,2.485,0,0,0-1.841.759,2.512,2.512,0,0,0-.748,1.83v9.928a2.51,2.51,0,0,0,.748,1.829,2.481,2.481,0,0,0,1.841.759H905a2.591,2.591,0,0,0,2.588-2.589v-.6h2.187v.6a4.662,4.662,0,0,1-.636,2.387,4.762,4.762,0,0,1-1.74,1.74,4.664,4.664,0,0,1-2.4.647h-1.584A4.661,4.661,0,0,1,901.013,581.3Z" transform="translate(-898.614 -562.47)" fill="url(#linear-gradient)"/>
+    </g>
+    <g id="组_15356" data-name="组 15356" transform="translate(910.243 573.031)" style="isolation: isolate">
+      <path id="路径_56256" data-name="路径 56256" d="M937.788,593.249h-6.58v-.915a3.03,3.03,0,0,1,.294-1.373,4.178,4.178,0,0,1,.73-1.04,7.39,7.39,0,0,1,.948-.828q.512-.376.948-.741a4.438,4.438,0,0,0,.73-.763,1.505,1.505,0,0,0,.294-.921.847.847,0,0,0-.305-.7,1.283,1.283,0,0,0-.828-.245,2.871,2.871,0,0,0-.577.065,4,4,0,0,0-.627.185,4.54,4.54,0,0,0-.6.283,2.312,2.312,0,0,0-.5.37v-2.113a4.189,4.189,0,0,1,1.329-.583,6.11,6.11,0,0,1,1.394-.158,4.313,4.313,0,0,1,1.264.179,2.879,2.879,0,0,1,1.019.539,2.6,2.6,0,0,1,.681.883,2.767,2.767,0,0,1,.25,1.209,2.512,2.512,0,0,1-.278,1.155,5.168,5.168,0,0,1-.692,1.024,7.858,7.858,0,0,1-.893.883q-.48.4-.893.718c-.276.211-.506.392-.692.545s-.278.272-.278.359v.044h3.856Z" transform="translate(-931.208 -583.771)" fill="url(#linear-gradient)"/>
+    </g>
+    <g id="组_15357" data-name="组 15357" transform="translate(918.198 562.47)" style="isolation: isolate">
+      <path id="路径_56257" data-name="路径 56257" d="M949.08,562.47h2.209v8.345h6.76V562.47h2.187v19.478h-2.187V573h-6.76v8.947H949.08Z" transform="translate(-949.08 -562.47)" fill="url(#linear-gradient)"/>
+    </g>
+    <g id="组_15358" data-name="组 15358" transform="translate(930.203 573.249)" style="isolation: isolate">
+      <path id="路径_56258" data-name="路径 56258" d="M988.534,591.553h-1.2v1.917h-2.321v-1.917H980.6v-1.536a23.673,23.673,0,0,0,2.14-2.7,23.357,23.357,0,0,0,1.781-3.11h2.811v5.654h1.2Zm-3.519-1.689V586.41q-.24.513-.534,1.019t-.61.959q-.315.451-.632.833a6.632,6.632,0,0,1-.6.643Z" transform="translate(-980.603 -584.21)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

static/warndata/CH4.svg

@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="37.522" height="23.059" viewBox="0 0 37.522 23.059">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <g id="CH_" data-name="CH " transform="translate(-771.614 -562.47)">
+    <g id="组_15349" data-name="组 15349" transform="translate(771.614 562.47)" style="isolation: isolate">
+      <path id="路径_56248" data-name="路径 56248" d="M774.374,584.138a5.582,5.582,0,0,1-2.016-2,5.3,5.3,0,0,1-.745-2.747V567.964a5.3,5.3,0,0,1,.745-2.748,5.587,5.587,0,0,1,2.016-2,5.363,5.363,0,0,1,2.76-.744h1.823a5.367,5.367,0,0,1,2.76.744,5.485,5.485,0,0,1,2,2,5.369,5.369,0,0,1,.731,2.748v.693h-2.516v-.693a2.98,2.98,0,0,0-2.978-2.979h-1.823a2.859,2.859,0,0,0-2.118.873,2.89,2.89,0,0,0-.86,2.106v11.424a2.888,2.888,0,0,0,.86,2.105,2.854,2.854,0,0,0,2.118.873h1.823a2.981,2.981,0,0,0,2.978-2.979v-.693h2.516v.693a5.366,5.366,0,0,1-.731,2.747,5.481,5.481,0,0,1-2,2,5.367,5.367,0,0,1-2.76.745h-1.823A5.363,5.363,0,0,1,774.374,584.138Z" transform="translate(-771.614 -562.47)" fill="url(#linear-gradient)"/>
+      <path id="路径_56249" data-name="路径 56249" d="M798.838,562.47h2.542v9.6h7.779v-9.6h2.516v22.412h-2.516v-10.3H801.38v10.3h-2.542Z" transform="translate(-784.306 -562.47)" fill="url(#linear-gradient)"/>
+    </g>
+    <g id="组_15350" data-name="组 15350" transform="translate(800.01 574.873)" style="isolation: isolate">
+      <path id="路径_56250" data-name="路径 56250" d="M844.535,592.659h-1.379v2.206h-2.67v-2.206h-5.077v-1.768a27.256,27.256,0,0,0,2.463-3.1,26.741,26.741,0,0,0,2.05-3.579h3.234v6.506h1.379Zm-4.049-1.943v-3.974q-.276.59-.614,1.172t-.7,1.1q-.363.519-.727.958a7.677,7.677,0,0,1-.689.74Z" transform="translate(-835.409 -584.21)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

static/warndata/CO.svg

@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="29.908" height="23.458" viewBox="0 0 29.908 23.458">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <g id="CO" transform="translate(-771.614 -468.47)">
+    <g id="组_15348" data-name="组 15348" transform="translate(771.614 468.47)" style="isolation: isolate">
+      <path id="路径_56246" data-name="路径 56246" d="M774.5,491.149a5.842,5.842,0,0,1-2.11-2.1,5.542,5.542,0,0,1-.779-2.875V474.221a5.546,5.546,0,0,1,.779-2.876,5.848,5.848,0,0,1,2.11-2.1,5.613,5.613,0,0,1,2.888-.779H779.3a5.616,5.616,0,0,1,2.889.779,5.741,5.741,0,0,1,2.1,2.1,5.619,5.619,0,0,1,.766,2.876v.725h-2.633v-.725A3.119,3.119,0,0,0,779.3,471.1h-1.908a2.992,2.992,0,0,0-2.217.914,3.024,3.024,0,0,0-.9,2.2v11.957a3.022,3.022,0,0,0,.9,2.2,2.988,2.988,0,0,0,2.217.914H779.3a3.12,3.12,0,0,0,3.117-3.118v-.726h2.633v.726a5.615,5.615,0,0,1-.766,2.875,5.736,5.736,0,0,1-2.1,2.1,5.617,5.617,0,0,1-2.889.779h-1.908A5.613,5.613,0,0,1,774.5,491.149Z" transform="translate(-771.614 -468.47)" fill="url(#linear-gradient)"/>
+      <path id="路径_56247" data-name="路径 56247" d="M801.64,491.055a6.479,6.479,0,0,1-2.378-2.365,6.3,6.3,0,0,1-.873-3.238V474.945a6.3,6.3,0,0,1,.873-3.238,6.475,6.475,0,0,1,2.378-2.365,6.369,6.369,0,0,1,3.252-.873h.941a6.3,6.3,0,0,1,3.238.873,6.507,6.507,0,0,1,2.365,2.365,6.3,6.3,0,0,1,.874,3.238v10.507a6.3,6.3,0,0,1-.874,3.238,6.511,6.511,0,0,1-2.365,2.365,6.3,6.3,0,0,1-3.238.873h-.941A6.369,6.369,0,0,1,801.64,491.055Zm-.067-3.7a3.974,3.974,0,0,0,1.4,1.411,3.666,3.666,0,0,0,1.922.524h.941a3.666,3.666,0,0,0,1.921-.524,3.974,3.974,0,0,0,1.4-1.411,3.685,3.685,0,0,0,.524-1.908V474.945a3.689,3.689,0,0,0-.524-1.908,3.978,3.978,0,0,0-1.4-1.41,3.666,3.666,0,0,0-1.921-.524h-.941a3.666,3.666,0,0,0-1.922.524,3.978,3.978,0,0,0-1.4,1.41,3.688,3.688,0,0,0-.524,1.908v10.507A3.685,3.685,0,0,0,801.573,487.36Z" transform="translate(-782.4 -468.47)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

static/warndata/CO2.svg

@@ -0,0 +1,17 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="37.102" height="24.278" viewBox="0 0 37.102 24.278">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <g id="CO2" transform="translate(-898.614 -469.47)">
+    <g id="组_15361" data-name="组 15361" transform="translate(898.614 469.47)" style="isolation: isolate">
+      <path id="路径_56261" data-name="路径 56261" d="M901.52,492.284a5.879,5.879,0,0,1-2.122-2.108,5.576,5.576,0,0,1-.784-2.892V475.255a5.579,5.579,0,0,1,.784-2.893,5.883,5.883,0,0,1,2.122-2.108,5.646,5.646,0,0,1,2.906-.783h1.919a5.65,5.65,0,0,1,2.906.783,5.774,5.774,0,0,1,2.108,2.108,5.653,5.653,0,0,1,.77,2.893v.729H909.48v-.729a3.138,3.138,0,0,0-3.136-3.136h-1.919a3.009,3.009,0,0,0-2.23.919,3.043,3.043,0,0,0-.906,2.217v12.028a3.04,3.04,0,0,0,.906,2.216,3,3,0,0,0,2.23.92h1.919a3.139,3.139,0,0,0,3.136-3.136v-.73h2.649v.73a5.649,5.649,0,0,1-.77,2.892,5.771,5.771,0,0,1-2.108,2.108,5.651,5.651,0,0,1-2.906.784h-1.919A5.647,5.647,0,0,1,901.52,492.284Z" transform="translate(-898.614 -469.47)" fill="url(#linear-gradient)"/>
+      <path id="路径_56262" data-name="路径 56262" d="M928.659,492.189a6.516,6.516,0,0,1-2.392-2.379,6.333,6.333,0,0,1-.878-3.258V475.984a6.331,6.331,0,0,1,.878-3.257,6.512,6.512,0,0,1,2.392-2.379,6.407,6.407,0,0,1,3.271-.878h.946a6.333,6.333,0,0,1,3.257.878,6.546,6.546,0,0,1,2.379,2.379,6.333,6.333,0,0,1,.879,3.257v10.569a6.336,6.336,0,0,1-.879,3.258,6.551,6.551,0,0,1-2.379,2.379,6.333,6.333,0,0,1-3.257.878h-.946A6.407,6.407,0,0,1,928.659,492.189Zm-.067-3.717A4,4,0,0,0,930,489.892a3.688,3.688,0,0,0,1.933.527h.946a3.687,3.687,0,0,0,1.932-.527,4,4,0,0,0,1.406-1.419,3.708,3.708,0,0,0,.527-1.919V475.984a3.71,3.71,0,0,0-.527-1.919,4,4,0,0,0-1.406-1.419,3.686,3.686,0,0,0-1.932-.527h-.946a3.688,3.688,0,0,0-1.933.527,4,4,0,0,0-1.406,1.419,3.71,3.71,0,0,0-.527,1.919v10.569A3.707,3.707,0,0,0,928.592,488.472Z" transform="translate(-910.945 -469.47)" fill="url(#linear-gradient)"/>
+    </g>
+    <g id="组_15362" data-name="组 15362" transform="translate(927.744 482.265)" style="isolation: isolate">
+      <path id="路径_56263" data-name="路径 56263" d="M974.182,502.254H966.21v-1.109a3.67,3.67,0,0,1,.357-1.663,5.053,5.053,0,0,1,.884-1.26,8.98,8.98,0,0,1,1.148-1q.621-.455,1.149-.9a5.377,5.377,0,0,0,.884-.924,1.824,1.824,0,0,0,.356-1.115,1.029,1.029,0,0,0-.369-.851,1.556,1.556,0,0,0-1-.3,3.459,3.459,0,0,0-.7.079,4.845,4.845,0,0,0-.759.225,5.524,5.524,0,0,0-.726.343,2.773,2.773,0,0,0-.6.449v-2.56a5.078,5.078,0,0,1,1.61-.706,7.412,7.412,0,0,1,1.689-.191,5.226,5.226,0,0,1,1.531.218,3.49,3.49,0,0,1,1.234.654,3.149,3.149,0,0,1,.825,1.069,3.35,3.35,0,0,1,.3,1.464,3.043,3.043,0,0,1-.336,1.4,6.246,6.246,0,0,1-.838,1.24,9.557,9.557,0,0,1-1.083,1.069q-.581.488-1.082.87c-.334.256-.613.475-.838.661s-.337.33-.337.435v.053h4.672Z" transform="translate(-966.21 -490.771)" fill="url(#linear-gradient)"/>
+    </g>
+  </g>
+</svg>

static/warndata/上隅角.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="27.621" height="27.621" viewBox="0 0 27.621 27.621">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_56264" data-name="路径 56264" d="M0,0H1.9V3.881A22.825,22.825,0,0,1,22.74,24.719h3.881v1.9H0ZM1.9,13.444V24.719H13.177A13.32,13.32,0,0,0,1.9,13.444Z" transform="translate(0.5 0.5)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

static/warndata/报警.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="38.521" height="38.556" viewBox="0 0 38.521 38.556">
+  <path id="路径_56276" data-name="路径 56276" d="M32.241,36.85a2.389,2.389,0,0,0-1.22-.655.6.6,0,0,1-.486-.584V21.771a10.844,10.844,0,1,0-21.688-.083V35.612a.6.6,0,0,1-.486.584,2.411,2.411,0,0,0-1.924,2.361H32.945A2.417,2.417,0,0,0,32.241,36.85ZM21.774,17.471,21.044,24h2.865l-6.3,9.138.73-6.525H15.475ZM19.692,7.832a1.2,1.2,0,0,1-1.2-1.2V1.2a1.2,1.2,0,1,1,2.41,0V6.627A1.2,1.2,0,0,1,19.692,7.832Zm-8.735,3.317a1.205,1.205,0,0,1-1.645-.441L6.6,6.013a1.2,1.2,0,0,1,2.086-1.2L11.4,9.5A1.206,1.206,0,0,1,10.957,11.149Zm17.471,0a1.205,1.205,0,0,0,1.645-.441l2.711-4.7a1.2,1.2,0,0,0-2.086-1.2L27.987,9.5A1.206,1.206,0,0,0,28.427,11.149Zm-20.389,5.6a1.2,1.2,0,0,1-1.476.851L1.325,16.2a1.2,1.2,0,1,1,.621-2.327l5.237,1.4A1.2,1.2,0,0,1,8.039,16.751Zm23.307,0a1.2,1.2,0,0,0,1.476.851l5.237-1.4a1.2,1.2,0,1,0-.625-2.327l-5.237,1.4A1.209,1.209,0,0,0,31.345,16.751Z" transform="translate(-0.43)" fill="#fff"/>
+</svg>

static/warndata/操作时间.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="28" viewBox="0 0 28 28">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_56238" data-name="路径 56238" d="M77.5,91A13.5,13.5,0,1,1,91,77.5,13.5,13.5,0,0,1,77.5,91Zm0-3.857A9.643,9.643,0,1,0,67.857,77.5,9.643,9.643,0,0,0,77.5,87.143Zm7.749-11.571v3.857H75.571V69.786h3.857v5.786Z" transform="translate(-63.5 -63.5)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

static/warndata/操作记录.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="23.917" height="27.359" viewBox="0 0 23.917 27.359">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_56239" data-name="路径 56239" d="M89.555,24.7H68.481a.83.83,0,0,0,0,1.66H89.555a.83.83,0,0,0,0-1.66Zm0-3.319H80.041a.83.83,0,0,0,0,1.66h9.514a.83.83,0,0,0,0-1.66ZM82.53,18.889a.83.83,0,0,0,.83.83h6.195a.83.83,0,0,0,0-1.66H83.36a.83.83,0,0,0-.83.83ZM68.462,22.613a.907.907,0,0,0,.521.193h.1L76.046,22a.656.656,0,0,0,.27-.1.425.425,0,0,0,.174-.135L87.529,8.255a2.239,2.239,0,0,0-.347-3.146L81.855.517a2.084,2.084,0,0,0-1.621-.5,2.181,2.181,0,0,0-1.505.811L67.709,14.45a.6.6,0,0,0,0,.193.617.617,0,0,0,0,.27h-.193l.656,6.986a.791.791,0,0,0,.289.714Zm1.467-7.16L75.1,19.6l-.618.868-4.747.56-.5-4.67Z" transform="translate(-66.967 0.502)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

static/warndata/操作设备.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="25.986" height="25.979" viewBox="0 0 25.986 25.979">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_55532" data-name="路径 55532" d="M183.993,186.336a4.793,4.793,0,0,1-6.879-3.762,4.147,4.147,0,0,1,.15-1.9.532.532,0,0,0-.168-.64q-4.721-4.7-9.426-9.421a.593.593,0,0,0-.687-.168,4.835,4.835,0,0,1-6.04-3.675,4.51,4.51,0,0,1,.332-2.977c.205-.033.268.137.365.233.927.917,1.842,1.847,2.773,2.761a1.629,1.629,0,1,0,2.3-2.283c-1.006-1.023-2.028-2.031-3.11-3.112a4.909,4.909,0,0,1,4.352.083,4.847,4.847,0,0,1,2.411,5.581.629.629,0,0,0,.2.728q4.68,4.663,9.343,9.344a.705.705,0,0,0,.787.187,4.686,4.686,0,0,1,4.842,1.459,4.554,4.554,0,0,1,.987,4.8c-.134.391-.221.547-.592.155-.909-.961-1.856-1.886-2.8-2.811a1.584,1.584,0,0,0-1.766-.426,1.531,1.531,0,0,0-1.033,1.308,1.742,1.742,0,0,0,.61,1.514C181.95,184.3,182.951,185.3,183.993,186.336Zm-23.127-1.983a1.939,1.939,0,0,1,.654-1.621q3.862-3.879,7.733-7.748c.182-.183.284-.223.489-.013q1.467,1.5,2.97,2.966c.193.189.2.294,0,.49-2.589,2.572-5.15,5.171-7.758,7.723a2.384,2.384,0,0,1-3.9-.633A2,2,0,0,1,160.866,184.353Zm16.4-12.217c-.089-.077-.177-.143-.255-.219-.4-.4-.788-.816-1.209-1.195-.254-.229-.2-.363.019-.576.959-.937,1.879-1.916,2.858-2.832a6.512,6.512,0,0,0,1.8-2.5,5.006,5.006,0,0,1,3.174-3.181c.493-.176.965-.658,1.419-.624s.742.7,1.161,1.014c.513.385.563.737.209,1.3a25.011,25.011,0,0,0-1.258,2.405,1.16,1.16,0,0,1-.624.612A14.725,14.725,0,0,0,179,170.4c-.458.526-.983.993-1.478,1.487C177.443,171.97,177.359,172.045,177.262,172.136Z" transform="translate(-160.832 -160.92)" fill="url(#linear-gradient)"/>
+</svg>

static/warndata/用户.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="27.253" height="26.132" viewBox="0 0 27.253 26.132">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#f9faff"/>
+      <stop offset="1" stop-color="#c4d2fd"/>
+    </linearGradient>
+  </defs>
+  <path id="路径_56236" data-name="路径 56236" d="M83.607,115.751a.911.911,0,0,1-.913-.906v-2.221a10.753,10.753,0,0,1,1.94-6.176,10.992,10.992,0,0,1,4.977-3.943l.332-.132-.282-.22a6.409,6.409,0,0,1-2.5-5.076,6.5,6.5,0,0,1,13,0,6.409,6.409,0,0,1-2.5,5.077l-.281.22.332.132a10.988,10.988,0,0,1,4.977,3.942,10.753,10.753,0,0,1,1.94,6.176v2.221a.911.911,0,0,1-.913.906Zm22.626-3.332c-.011-.608.67-6.595-4.325-9.273-.675-.462-.866-.523-.866-.9a.91.91,0,0,1,.622-.836l.006,0,.006,0c3.516-3.754-.673-8.194-1.319-8.477-.105-.17-.129-.208-.055-.09a5.373,5.373,0,0,1,5.291,5.348,5.313,5.313,0,0,1-1.4,3.587l-.18.2.238.122a8.624,8.624,0,0,1,4.7,7.7v1.718a.91.91,0,0,1-.913.906Z" transform="translate(-82.193 -90.119)" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1" fill="url(#linear-gradient)"/>
+</svg>

static/warndata/监测点.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="35.767" height="28.412" viewBox="0 0 35.767 28.412">
+  <defs>
+    <linearGradient id="linear-gradient" x1="0.5" x2="0.5" y2="1" gradientUnits="objectBoundingBox">
+      <stop offset="0" stop-color="#cce0ff"/>
+      <stop offset="1" stop-color="#8fbbff"/>
+    </linearGradient>
+  </defs>
+  <g id="组_15193" data-name="组 15193" transform="translate(-7.992 -16.372)">
+    <path id="路径_56274" data-name="路径 56274" d="M33.267,142.276H0v-2.591H33.267Zm0-2.592H23.19V118.956H0v-2.592H33.267Zm-12.6-2.591H5.489V121.547H20.672Zm10.076-15.547H25.709v15.547h5.038V121.547Z" transform="translate(9.992 -99.492)" fill="#2663ca" stroke="rgba(0,0,0,0)" stroke-miterlimit="10" stroke-width="1"/>
+    <path id="路径_56275" data-name="路径 56275" d="M33.267,142.276H0v-2.591H33.267Zm0-2.592H23.19V118.956H0v-2.592H33.267Zm-12.6-2.591H5.489V121.547H20.672Zm10.076-15.547H25.709v15.547h5.038V121.547Z" transform="translate(7.992 -97.492)" fill="url(#linear-gradient)"/>
+  </g>
+</svg>

static/warndata/风险.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16.915" height="15.558" viewBox="0 0 16.915 15.558">
+  <path id="路径_55536" data-name="路径 55536" d="M16.82,55.267,9.261,41.442a.917.917,0,0,0-1.615,0L.095,55.267a.869.869,0,0,0,.812,1.251h15.11a.867.867,0,0,0,.8-1.251Zm-9.039-8.21a.676.676,0,0,1,1.353,0v4.059a.676.676,0,0,1-1.353,0V47.056Zm.676,7.1a.846.846,0,1,1,.846-.846A.848.848,0,0,1,8.457,54.159Z" transform="translate(0 -40.96)" fill="#fff"/>
+</svg>