已修改25个文件
已添加52个文件
已删除4个文件
| | |
| | | VITE_OPEN = false |
| | | |
| | | # public path 配置线上环境路径(打包)、本地通过 http-server 访问时,请置空即可 |
| | | VITE_PUBLIC_PATH = /vue-next-admin-preview/ |
| | | VITE_PUBLIC_PATH = /vue-next-admin-preview/ |
| | |
| | | ENV = 'development' |
| | | |
| | | # 本地环境接口地址 |
| | | VITE_API_URL = 'http://192.168.0.35:8008' |
| | | #VITE_API_URL = 'http://192.168.0.35:8008' |
| | | VITE_API_URL = 'http://192.168.0.29:8008' |
| | | |
| | | # VITE_API_URL = 'http://192.168.0.8:8008' |
| | | #VITE_API_URL = 'http://192.168.0.69:8008' |
| | |
| | | "echarts": "^5.3.3", |
| | | "echarts-gl": "^2.0.9", |
| | | "echarts-wordcloud": "^2.0.0", |
| | | "element-plus": "^2.2.2", |
| | | "element-plus": "^2.2.9", |
| | | "js-cookie": "^3.0.1", |
| | | "json-bigint": "^1.0.0", |
| | | "jsplumb": "^2.15.6", |
| | |
| | | }, |
| | | "node_modules/@ctrl/tinycolor": { |
| | | "version": "3.4.1", |
| | | "resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz", |
| | | "resolved": "https://registry.npmmirror.com/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz", |
| | | "integrity": "sha512-ej5oVy6lykXsvieQtqZxCOaLT+xD4+QNarq78cIYISHmZXshCvROLudpQN3lfL8G0NL7plMSSK+zlyvCaIJ4Iw==", |
| | | "engines": { |
| | | "node": ">=10" |
| | |
| | | } |
| | | }, |
| | | "node_modules/@floating-ui/core": { |
| | | "version": "0.7.1", |
| | | "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-0.7.1.tgz", |
| | | "integrity": "sha512-grcqEmI8DTIolufpxhJagVeJmvloxBXE6xxSrVnSXz/Wz1uUIsC85ad+UNBqAoBOvzLxE42wvDj3YkmSGqWRxA==" |
| | | "version": "0.7.3", |
| | | "resolved": "https://registry.npmmirror.com/@floating-ui/core/-/core-0.7.3.tgz", |
| | | "integrity": "sha512-buc8BXHmG9l82+OQXOFU3Kr2XQx9ys01U/Q9HMIrZ300iLc8HLMgh7dcCqgYzAzf4BkoQvDcXf5Y+CuEZ5JBYg==" |
| | | }, |
| | | "node_modules/@floating-ui/dom": { |
| | | "version": "0.5.1", |
| | | "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-0.5.1.tgz", |
| | | "integrity": "sha512-dkPSy5JPiQEtljc3VpG9lauYctxfLlqj/8N9f+lmsR92gQaSVMAWuBbFBH2keY5DmdQn3p4Dv1dQd+e8osH+/g==", |
| | | "version": "0.5.4", |
| | | "resolved": "https://registry.npmmirror.com/@floating-ui/dom/-/dom-0.5.4.tgz", |
| | | "integrity": "sha512-419BMceRLq0RrmTSDxn8hf9R3VCJv2K9PUfugh5JyEFmdjzDo+e8U5EdR8nzKq8Yj1htzLm3b6eQEEam3/rrtg==", |
| | | "dependencies": { |
| | | "@floating-ui/core": "^0.7.1" |
| | | "@floating-ui/core": "^0.7.3" |
| | | } |
| | | }, |
| | | "node_modules/@humanwhocodes/config-array": { |
| | |
| | | "node_modules/@popperjs/core": { |
| | | "name": "@sxzz/popperjs-es", |
| | | "version": "2.11.7", |
| | | "resolved": "https://registry.npmjs.org/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz", |
| | | "integrity": "sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ==", |
| | | "funding": { |
| | | "type": "opencollective", |
| | | "url": "https://opencollective.com/popperjs" |
| | | } |
| | | "resolved": "https://registry.npmmirror.com/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz", |
| | | "integrity": "sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ==" |
| | | }, |
| | | "node_modules/@transloadit/prettier-bytes": { |
| | | "version": "0.0.7", |
| | |
| | | }, |
| | | "node_modules/@types/lodash": { |
| | | "version": "4.14.182", |
| | | "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.182.tgz", |
| | | "resolved": "https://registry.npmmirror.com/@types/lodash/-/lodash-4.14.182.tgz", |
| | | "integrity": "sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==" |
| | | }, |
| | | "node_modules/@types/lodash-es": { |
| | | "version": "4.17.6", |
| | | "resolved": "https://registry.npmjs.org/@types/lodash-es/-/lodash-es-4.17.6.tgz", |
| | | "resolved": "https://registry.npmmirror.com/@types/lodash-es/-/lodash-es-4.17.6.tgz", |
| | | "integrity": "sha512-R+zTeVUKDdfoRxpAryaQNRKk3105Rrgx2CFRClIgRGaqDTdjsm8h6IYA8ir584W3ePzkZfst5xIgDwYrlh9HLg==", |
| | | "dependencies": { |
| | | "@types/lodash": "*" |
| | |
| | | "resolved": "https://registry.npmjs.org/@types/sortablejs/-/sortablejs-1.13.0.tgz", |
| | | "integrity": "sha512-C3064MH72iEfeGCYEGCt7FCxXoAXaMPG0QPnstcxvPmbl54erpISu06d++FY37Smja64iWy5L8wOyHHBghWbJQ==", |
| | | "dev": true |
| | | }, |
| | | "node_modules/@types/web-bluetooth": { |
| | | "version": "0.0.14", |
| | | "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.14.tgz", |
| | | "integrity": "sha512-5d2RhCard1nQUC3aHcq/gHzWYO6K0WJmAbjO7mQJgCQKtZpgXxv1rOM6O/dBDhDYYVutk1sciOgNSe+5YyfM8A==" |
| | | }, |
| | | "node_modules/@typescript-eslint/eslint-plugin": { |
| | | "version": "5.27.0", |
| | |
| | | "integrity": "sha512-JtB41wXl7Au3+Nl3gD16Cfpj7k/6aCroZ6BbOiCMFCMvrOpkg/qQUXTso2XowaNqBbnkuGHurLAqkLBxNGc1hQ==" |
| | | }, |
| | | "node_modules/@vueuse/core": { |
| | | "version": "8.5.0", |
| | | "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-8.5.0.tgz", |
| | | "integrity": "sha512-VEJ6sGNsPlUp0o9BGda2YISvDZbhWJSOJu5zlp2TufRGVrLcYUKr31jyFEOj6RXzG3k/H4aCYeZyjpItfU8glw==", |
| | | "version": "8.9.2", |
| | | "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-8.9.2.tgz", |
| | | "integrity": "sha512-dE3/JgwqIHmmtmRBdZAnq87rZCSFbYVps2t3gWy9Jv/+Qp6sHSSKuPFtwguJVZ2OnaGnB/AMRmx4CuFRxFin3A==", |
| | | "dependencies": { |
| | | "@vueuse/metadata": "8.5.0", |
| | | "@vueuse/shared": "8.5.0", |
| | | "@types/web-bluetooth": "^0.0.14", |
| | | "@vueuse/metadata": "8.9.2", |
| | | "@vueuse/shared": "8.9.2", |
| | | "vue-demi": "*" |
| | | }, |
| | | "funding": { |
| | | "url": "https://github.com/sponsors/antfu" |
| | | }, |
| | | "peerDependencies": { |
| | | "@vue/composition-api": "^1.1.0", |
| | |
| | | } |
| | | }, |
| | | "node_modules/@vueuse/core/node_modules/@vueuse/shared": { |
| | | "version": "8.5.0", |
| | | "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-8.5.0.tgz", |
| | | "integrity": "sha512-qKG+SZb44VvGD4dU5cQ63z4JE2Yk39hQUecR0a9sEdJA01cx+XrxAvFKJfPooxwoiqalAVw/ktWK6xbyc/jS3g==", |
| | | "version": "8.9.2", |
| | | "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-8.9.2.tgz", |
| | | "integrity": "sha512-s4Nk82oheL5z1GywyGnqjob0MzbAt88olMZa0vgt/p3gcMsT8Ff7+SqmNgEFC6AAs6xiuhOAZpnew9Zs3d90yQ==", |
| | | "dependencies": { |
| | | "vue-demi": "*" |
| | | }, |
| | | "funding": { |
| | | "url": "https://github.com/sponsors/antfu" |
| | | }, |
| | | "peerDependencies": { |
| | | "@vue/composition-api": "^1.1.0", |
| | |
| | | } |
| | | }, |
| | | "node_modules/@vueuse/core/node_modules/vue-demi": { |
| | | "version": "0.12.5", |
| | | "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.12.5.tgz", |
| | | "integrity": "sha512-BREuTgTYlUr0zw0EZn3hnhC3I6gPWv+Kwh4MCih6QcAeaTlaIX0DwOVN0wHej7hSvDPecz4jygy/idsgKfW58Q==", |
| | | "version": "0.13.4", |
| | | "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.13.4.tgz", |
| | | "integrity": "sha512-KP4lq9uSz0KZbaqCllRhnxMV3mYRsRWJfdsAhZyt5bV5O1RTpoeDptBRV9NOa/JgOpfaA9ane88VF7OjWNK/DA==", |
| | | "hasInstallScript": true, |
| | | "bin": { |
| | | "vue-demi-fix": "bin/vue-demi-fix.js", |
| | |
| | | }, |
| | | "engines": { |
| | | "node": ">=12" |
| | | }, |
| | | "funding": { |
| | | "url": "https://github.com/sponsors/antfu" |
| | | }, |
| | | "peerDependencies": { |
| | | "@vue/composition-api": "^1.0.0-rc.1", |
| | |
| | | } |
| | | }, |
| | | "node_modules/@vueuse/metadata": { |
| | | "version": "8.5.0", |
| | | "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-8.5.0.tgz", |
| | | "integrity": "sha512-WxsD+Cd+bn+HcjpY6Dl9FJ8ywTRTT9pTwk3bCQpzEhXVYAyNczKDSahk50fCfIJKeWHhyI4B2+/ZEOxQAkUr0g==", |
| | | "funding": { |
| | | "url": "https://github.com/sponsors/antfu" |
| | | } |
| | | "version": "8.9.2", |
| | | "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-8.9.2.tgz", |
| | | "integrity": "sha512-g2s2BeyeEtJElmMFfFPnM+BTvnt0omniyvz8U18/zXDpQIMGozlNQgHoFeratyMfgVBhH/u2VKzmchChtDsgPQ==" |
| | | }, |
| | | "node_modules/@wangeditor/basic-modules": { |
| | | "version": "1.1.1", |
| | |
| | | } |
| | | }, |
| | | "node_modules/async-validator": { |
| | | "version": "4.1.1", |
| | | "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.1.1.tgz", |
| | | "integrity": "sha512-p4DO/JXwjs8klJyJL8Q2oM4ks5fUTze/h5k10oPPKMiLe1fj3G1QMzPHNmN1Py4ycOk7WlO2DcGXv1qiESJCZA==" |
| | | "version": "4.2.5", |
| | | "resolved": "https://registry.npmmirror.com/async-validator/-/async-validator-4.2.5.tgz", |
| | | "integrity": "sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==" |
| | | }, |
| | | "node_modules/asynckit": { |
| | | "version": "0.4.0", |
| | |
| | | } |
| | | }, |
| | | "node_modules/dayjs": { |
| | | "version": "1.11.2", |
| | | "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.2.tgz", |
| | | "integrity": "sha512-F4LXf1OeU9hrSYRPTTj/6FbO4HTjPKXvEIC1P2kcnFurViINCVk3ZV0xAS3XVx9MkMsXbbqlK6hjseaYbgKEHw==" |
| | | "version": "1.11.3", |
| | | "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.3.tgz", |
| | | "integrity": "sha512-xxwlswWOlGhzgQ4TKzASQkUhqERI3egRNqgV4ScR8wlANA/A9tZ7miXa44vTTKEq5l7vWoL5G57bG3zA+Kow0A==" |
| | | }, |
| | | "node_modules/debug": { |
| | | "version": "4.3.4", |
| | |
| | | "peer": true |
| | | }, |
| | | "node_modules/element-plus": { |
| | | "version": "2.2.2", |
| | | "resolved": "https://registry.npmjs.org/element-plus/-/element-plus-2.2.2.tgz", |
| | | "integrity": "sha512-yGcj2Ayb0jZO1WbI51tHJ4efhlfWKlBqqGtWbzhq+tcpfaKzJZN+IHRouuFasqn0ZV3tWCDu1jggDR1+9y7XfQ==", |
| | | "version": "2.2.9", |
| | | "resolved": "https://registry.npmmirror.com/element-plus/-/element-plus-2.2.9.tgz", |
| | | "integrity": "sha512-jYbL0JkCdv95rkT6trZJjCAizLPySa0qcd2cgq+57SKQnCZAcNDDq4GbTuFRnNavdoeCJnuM3HIficTIUpsMOQ==", |
| | | "dependencies": { |
| | | "@ctrl/tinycolor": "^3.4.1", |
| | | "@element-plus/icons-vue": "^1.1.4", |
| | | "@floating-ui/dom": "^0.5.0", |
| | | "@element-plus/icons-vue": "^2.0.6", |
| | | "@floating-ui/dom": "^0.5.4", |
| | | "@popperjs/core": "npm:@sxzz/popperjs-es@^2.11.7", |
| | | "@types/lodash": "^4.14.182", |
| | | "@types/lodash-es": "^4.17.6", |
| | | "@vueuse/core": "^8.5.0", |
| | | "async-validator": "^4.1.1", |
| | | "dayjs": "^1.11.2", |
| | | "@vueuse/core": "^8.7.5", |
| | | "async-validator": "^4.2.5", |
| | | "dayjs": "^1.11.3", |
| | | "escape-html": "^1.0.3", |
| | | "lodash": "^4.17.21", |
| | | "lodash-es": "^4.17.21", |
| | |
| | | "memoize-one": "^6.0.0", |
| | | "normalize-wheel-es": "^1.1.2" |
| | | }, |
| | | "peerDependencies": { |
| | | "vue": "^3.2.0" |
| | | } |
| | | }, |
| | | "node_modules/element-plus/node_modules/@element-plus/icons-vue": { |
| | | "version": "1.1.4", |
| | | "resolved": "https://registry.npmjs.org/@element-plus/icons-vue/-/icons-vue-1.1.4.tgz", |
| | | "integrity": "sha512-Iz/nHqdp1sFPmdzRwHkEQQA3lKvoObk8azgABZ81QUOpW9s/lUyQVUSh0tNtEPZXQlKwlSh7SPgoVxzrE0uuVQ==", |
| | | "peerDependencies": { |
| | | "vue": "^3.2.0" |
| | | } |
| | |
| | | }, |
| | | "node_modules/escape-html": { |
| | | "version": "1.0.3", |
| | | "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", |
| | | "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=" |
| | | "resolved": "https://registry.npmmirror.com/escape-html/-/escape-html-1.0.3.tgz", |
| | | "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==" |
| | | }, |
| | | "node_modules/escape-string-regexp": { |
| | | "version": "4.0.0", |
| | |
| | | }, |
| | | "node_modules/lodash-es": { |
| | | "version": "4.17.21", |
| | | "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz", |
| | | "resolved": "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.21.tgz", |
| | | "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==" |
| | | }, |
| | | "node_modules/lodash-unified": { |
| | | "version": "1.0.2", |
| | | "resolved": "https://registry.npmjs.org/lodash-unified/-/lodash-unified-1.0.2.tgz", |
| | | "resolved": "https://registry.npmmirror.com/lodash-unified/-/lodash-unified-1.0.2.tgz", |
| | | "integrity": "sha512-OGbEy+1P+UT26CYi4opY4gebD8cWRDxAT6MAObIVQMiqYdxZr1g3QHWCToVsm31x2NkLS4K3+MC2qInaRMa39g==", |
| | | "peerDependencies": { |
| | | "@types/lodash-es": "*", |
| | |
| | | }, |
| | | "node_modules/memoize-one": { |
| | | "version": "6.0.0", |
| | | "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz", |
| | | "resolved": "https://registry.npmmirror.com/memoize-one/-/memoize-one-6.0.0.tgz", |
| | | "integrity": "sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==" |
| | | }, |
| | | "node_modules/merge-stream": { |
| | |
| | | }, |
| | | "node_modules/normalize-wheel-es": { |
| | | "version": "1.1.2", |
| | | "resolved": "https://registry.npmjs.org/normalize-wheel-es/-/normalize-wheel-es-1.1.2.tgz", |
| | | "resolved": "https://registry.npmmirror.com/normalize-wheel-es/-/normalize-wheel-es-1.1.2.tgz", |
| | | "integrity": "sha512-scX83plWJXYH1J4+BhAuIHadROzxX0UBF3+HuZNY2Ks8BciE7tSTQ+5JhTsvzjaO0/EJdm4JBGrfObKxFf3Png==" |
| | | }, |
| | | "node_modules/nprogress": { |
| | |
| | | }, |
| | | "@ctrl/tinycolor": { |
| | | "version": "3.4.1", |
| | | "resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz", |
| | | "resolved": "https://registry.npmmirror.com/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz", |
| | | "integrity": "sha512-ej5oVy6lykXsvieQtqZxCOaLT+xD4+QNarq78cIYISHmZXshCvROLudpQN3lfL8G0NL7plMSSK+zlyvCaIJ4Iw==" |
| | | }, |
| | | "@element-plus/icons-vue": { |
| | |
| | | } |
| | | }, |
| | | "@floating-ui/core": { |
| | | "version": "0.7.1", |
| | | "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-0.7.1.tgz", |
| | | "integrity": "sha512-grcqEmI8DTIolufpxhJagVeJmvloxBXE6xxSrVnSXz/Wz1uUIsC85ad+UNBqAoBOvzLxE42wvDj3YkmSGqWRxA==" |
| | | "version": "0.7.3", |
| | | "resolved": "https://registry.npmmirror.com/@floating-ui/core/-/core-0.7.3.tgz", |
| | | "integrity": "sha512-buc8BXHmG9l82+OQXOFU3Kr2XQx9ys01U/Q9HMIrZ300iLc8HLMgh7dcCqgYzAzf4BkoQvDcXf5Y+CuEZ5JBYg==" |
| | | }, |
| | | "@floating-ui/dom": { |
| | | "version": "0.5.1", |
| | | "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-0.5.1.tgz", |
| | | "integrity": "sha512-dkPSy5JPiQEtljc3VpG9lauYctxfLlqj/8N9f+lmsR92gQaSVMAWuBbFBH2keY5DmdQn3p4Dv1dQd+e8osH+/g==", |
| | | "version": "0.5.4", |
| | | "resolved": "https://registry.npmmirror.com/@floating-ui/dom/-/dom-0.5.4.tgz", |
| | | "integrity": "sha512-419BMceRLq0RrmTSDxn8hf9R3VCJv2K9PUfugh5JyEFmdjzDo+e8U5EdR8nzKq8Yj1htzLm3b6eQEEam3/rrtg==", |
| | | "requires": { |
| | | "@floating-ui/core": "^0.7.1" |
| | | "@floating-ui/core": "^0.7.3" |
| | | } |
| | | }, |
| | | "@humanwhocodes/config-array": { |
| | |
| | | }, |
| | | "@popperjs/core": { |
| | | "version": "npm:@sxzz/popperjs-es@2.11.7", |
| | | "resolved": "https://registry.npmjs.org/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz", |
| | | "resolved": "https://registry.npmmirror.com/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz", |
| | | "integrity": "sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ==" |
| | | }, |
| | | "@transloadit/prettier-bytes": { |
| | |
| | | }, |
| | | "@types/lodash": { |
| | | "version": "4.14.182", |
| | | "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.182.tgz", |
| | | "resolved": "https://registry.npmmirror.com/@types/lodash/-/lodash-4.14.182.tgz", |
| | | "integrity": "sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==" |
| | | }, |
| | | "@types/lodash-es": { |
| | | "version": "4.17.6", |
| | | "resolved": "https://registry.npmjs.org/@types/lodash-es/-/lodash-es-4.17.6.tgz", |
| | | "resolved": "https://registry.npmmirror.com/@types/lodash-es/-/lodash-es-4.17.6.tgz", |
| | | "integrity": "sha512-R+zTeVUKDdfoRxpAryaQNRKk3105Rrgx2CFRClIgRGaqDTdjsm8h6IYA8ir584W3ePzkZfst5xIgDwYrlh9HLg==", |
| | | "requires": { |
| | | "@types/lodash": "*" |
| | |
| | | "resolved": "https://registry.npmjs.org/@types/sortablejs/-/sortablejs-1.13.0.tgz", |
| | | "integrity": "sha512-C3064MH72iEfeGCYEGCt7FCxXoAXaMPG0QPnstcxvPmbl54erpISu06d++FY37Smja64iWy5L8wOyHHBghWbJQ==", |
| | | "dev": true |
| | | }, |
| | | "@types/web-bluetooth": { |
| | | "version": "0.0.14", |
| | | "resolved": "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.14.tgz", |
| | | "integrity": "sha512-5d2RhCard1nQUC3aHcq/gHzWYO6K0WJmAbjO7mQJgCQKtZpgXxv1rOM6O/dBDhDYYVutk1sciOgNSe+5YyfM8A==" |
| | | }, |
| | | "@typescript-eslint/eslint-plugin": { |
| | | "version": "5.27.0", |
| | |
| | | "integrity": "sha512-JtB41wXl7Au3+Nl3gD16Cfpj7k/6aCroZ6BbOiCMFCMvrOpkg/qQUXTso2XowaNqBbnkuGHurLAqkLBxNGc1hQ==" |
| | | }, |
| | | "@vueuse/core": { |
| | | "version": "8.5.0", |
| | | "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-8.5.0.tgz", |
| | | "integrity": "sha512-VEJ6sGNsPlUp0o9BGda2YISvDZbhWJSOJu5zlp2TufRGVrLcYUKr31jyFEOj6RXzG3k/H4aCYeZyjpItfU8glw==", |
| | | "version": "8.9.2", |
| | | "resolved": "https://registry.npmmirror.com/@vueuse/core/-/core-8.9.2.tgz", |
| | | "integrity": "sha512-dE3/JgwqIHmmtmRBdZAnq87rZCSFbYVps2t3gWy9Jv/+Qp6sHSSKuPFtwguJVZ2OnaGnB/AMRmx4CuFRxFin3A==", |
| | | "requires": { |
| | | "@vueuse/metadata": "8.5.0", |
| | | "@vueuse/shared": "8.5.0", |
| | | "@types/web-bluetooth": "^0.0.14", |
| | | "@vueuse/metadata": "8.9.2", |
| | | "@vueuse/shared": "8.9.2", |
| | | "vue-demi": "*" |
| | | }, |
| | | "dependencies": { |
| | | "@vueuse/shared": { |
| | | "version": "8.5.0", |
| | | "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-8.5.0.tgz", |
| | | "integrity": "sha512-qKG+SZb44VvGD4dU5cQ63z4JE2Yk39hQUecR0a9sEdJA01cx+XrxAvFKJfPooxwoiqalAVw/ktWK6xbyc/jS3g==", |
| | | "version": "8.9.2", |
| | | "resolved": "https://registry.npmmirror.com/@vueuse/shared/-/shared-8.9.2.tgz", |
| | | "integrity": "sha512-s4Nk82oheL5z1GywyGnqjob0MzbAt88olMZa0vgt/p3gcMsT8Ff7+SqmNgEFC6AAs6xiuhOAZpnew9Zs3d90yQ==", |
| | | "requires": { |
| | | "vue-demi": "*" |
| | | } |
| | | }, |
| | | "vue-demi": { |
| | | "version": "0.12.5", |
| | | "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.12.5.tgz", |
| | | "integrity": "sha512-BREuTgTYlUr0zw0EZn3hnhC3I6gPWv+Kwh4MCih6QcAeaTlaIX0DwOVN0wHej7hSvDPecz4jygy/idsgKfW58Q==", |
| | | "version": "0.13.4", |
| | | "resolved": "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.13.4.tgz", |
| | | "integrity": "sha512-KP4lq9uSz0KZbaqCllRhnxMV3mYRsRWJfdsAhZyt5bV5O1RTpoeDptBRV9NOa/JgOpfaA9ane88VF7OjWNK/DA==", |
| | | "requires": {} |
| | | } |
| | | } |
| | | }, |
| | | "@vueuse/metadata": { |
| | | "version": "8.5.0", |
| | | "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-8.5.0.tgz", |
| | | "integrity": "sha512-WxsD+Cd+bn+HcjpY6Dl9FJ8ywTRTT9pTwk3bCQpzEhXVYAyNczKDSahk50fCfIJKeWHhyI4B2+/ZEOxQAkUr0g==" |
| | | "version": "8.9.2", |
| | | "resolved": "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-8.9.2.tgz", |
| | | "integrity": "sha512-g2s2BeyeEtJElmMFfFPnM+BTvnt0omniyvz8U18/zXDpQIMGozlNQgHoFeratyMfgVBhH/u2VKzmchChtDsgPQ==" |
| | | }, |
| | | "@wangeditor/basic-modules": { |
| | | "version": "1.1.1", |
| | |
| | | "dev": true |
| | | }, |
| | | "async-validator": { |
| | | "version": "4.1.1", |
| | | "resolved": "https://registry.npmjs.org/async-validator/-/async-validator-4.1.1.tgz", |
| | | "integrity": "sha512-p4DO/JXwjs8klJyJL8Q2oM4ks5fUTze/h5k10oPPKMiLe1fj3G1QMzPHNmN1Py4ycOk7WlO2DcGXv1qiESJCZA==" |
| | | "version": "4.2.5", |
| | | "resolved": "https://registry.npmmirror.com/async-validator/-/async-validator-4.2.5.tgz", |
| | | "integrity": "sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==" |
| | | }, |
| | | "asynckit": { |
| | | "version": "0.4.0", |
| | |
| | | } |
| | | }, |
| | | "dayjs": { |
| | | "version": "1.11.2", |
| | | "resolved": "https://registry.npmjs.org/dayjs/-/dayjs-1.11.2.tgz", |
| | | "integrity": "sha512-F4LXf1OeU9hrSYRPTTj/6FbO4HTjPKXvEIC1P2kcnFurViINCVk3ZV0xAS3XVx9MkMsXbbqlK6hjseaYbgKEHw==" |
| | | "version": "1.11.3", |
| | | "resolved": "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.3.tgz", |
| | | "integrity": "sha512-xxwlswWOlGhzgQ4TKzASQkUhqERI3egRNqgV4ScR8wlANA/A9tZ7miXa44vTTKEq5l7vWoL5G57bG3zA+Kow0A==" |
| | | }, |
| | | "debug": { |
| | | "version": "4.3.4", |
| | |
| | | "peer": true |
| | | }, |
| | | "element-plus": { |
| | | "version": "2.2.2", |
| | | "resolved": "https://registry.npmjs.org/element-plus/-/element-plus-2.2.2.tgz", |
| | | "integrity": "sha512-yGcj2Ayb0jZO1WbI51tHJ4efhlfWKlBqqGtWbzhq+tcpfaKzJZN+IHRouuFasqn0ZV3tWCDu1jggDR1+9y7XfQ==", |
| | | "version": "2.2.9", |
| | | "resolved": "https://registry.npmmirror.com/element-plus/-/element-plus-2.2.9.tgz", |
| | | "integrity": "sha512-jYbL0JkCdv95rkT6trZJjCAizLPySa0qcd2cgq+57SKQnCZAcNDDq4GbTuFRnNavdoeCJnuM3HIficTIUpsMOQ==", |
| | | "requires": { |
| | | "@ctrl/tinycolor": "^3.4.1", |
| | | "@element-plus/icons-vue": "^1.1.4", |
| | | "@floating-ui/dom": "^0.5.0", |
| | | "@element-plus/icons-vue": "^2.0.6", |
| | | "@floating-ui/dom": "^0.5.4", |
| | | "@popperjs/core": "npm:@sxzz/popperjs-es@^2.11.7", |
| | | "@types/lodash": "^4.14.182", |
| | | "@types/lodash-es": "^4.17.6", |
| | | "@vueuse/core": "^8.5.0", |
| | | "async-validator": "^4.1.1", |
| | | "dayjs": "^1.11.2", |
| | | "@vueuse/core": "^8.7.5", |
| | | "async-validator": "^4.2.5", |
| | | "dayjs": "^1.11.3", |
| | | "escape-html": "^1.0.3", |
| | | "lodash": "^4.17.21", |
| | | "lodash-es": "^4.17.21", |
| | | "lodash-unified": "^1.0.2", |
| | | "memoize-one": "^6.0.0", |
| | | "normalize-wheel-es": "^1.1.2" |
| | | }, |
| | | "dependencies": { |
| | | "@element-plus/icons-vue": { |
| | | "version": "1.1.4", |
| | | "resolved": "https://registry.npmjs.org/@element-plus/icons-vue/-/icons-vue-1.1.4.tgz", |
| | | "integrity": "sha512-Iz/nHqdp1sFPmdzRwHkEQQA3lKvoObk8azgABZ81QUOpW9s/lUyQVUSh0tNtEPZXQlKwlSh7SPgoVxzrE0uuVQ==", |
| | | "requires": {} |
| | | } |
| | | } |
| | | }, |
| | | "element-resize-detector": { |
| | |
| | | }, |
| | | "escape-html": { |
| | | "version": "1.0.3", |
| | | "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz", |
| | | "integrity": "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=" |
| | | "resolved": "https://registry.npmmirror.com/escape-html/-/escape-html-1.0.3.tgz", |
| | | "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==" |
| | | }, |
| | | "escape-string-regexp": { |
| | | "version": "4.0.0", |
| | |
| | | }, |
| | | "lodash-es": { |
| | | "version": "4.17.21", |
| | | "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz", |
| | | "resolved": "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.21.tgz", |
| | | "integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==" |
| | | }, |
| | | "lodash-unified": { |
| | | "version": "1.0.2", |
| | | "resolved": "https://registry.npmjs.org/lodash-unified/-/lodash-unified-1.0.2.tgz", |
| | | "resolved": "https://registry.npmmirror.com/lodash-unified/-/lodash-unified-1.0.2.tgz", |
| | | "integrity": "sha512-OGbEy+1P+UT26CYi4opY4gebD8cWRDxAT6MAObIVQMiqYdxZr1g3QHWCToVsm31x2NkLS4K3+MC2qInaRMa39g==", |
| | | "requires": {} |
| | | }, |
| | |
| | | }, |
| | | "memoize-one": { |
| | | "version": "6.0.0", |
| | | "resolved": "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz", |
| | | "resolved": "https://registry.npmmirror.com/memoize-one/-/memoize-one-6.0.0.tgz", |
| | | "integrity": "sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==" |
| | | }, |
| | | "merge-stream": { |
| | |
| | | }, |
| | | "normalize-wheel-es": { |
| | | "version": "1.1.2", |
| | | "resolved": "https://registry.npmjs.org/normalize-wheel-es/-/normalize-wheel-es-1.1.2.tgz", |
| | | "resolved": "https://registry.npmmirror.com/normalize-wheel-es/-/normalize-wheel-es-1.1.2.tgz", |
| | | "integrity": "sha512-scX83plWJXYH1J4+BhAuIHadROzxX0UBF3+HuZNY2Ks8BciE7tSTQ+5JhTsvzjaO0/EJdm4JBGrfObKxFf3Png==" |
| | | }, |
| | | "nprogress": { |
| | |
| | | "echarts": "^5.3.3", |
| | | "echarts-gl": "^2.0.9", |
| | | "echarts-wordcloud": "^2.0.0", |
| | | "element-plus": "^2.2.2", |
| | | "element-plus": "^2.2.9", |
| | | "js-cookie": "^3.0.1", |
| | | "json-bigint": "^1.0.0", |
| | | "jsplumb": "^2.15.6", |
| | |
| | | <template> |
| | | <el-config-provider :size="getGlobalComponentSize" :locale="i18nLocale"> |
| | | <router-view v-show="themeConfig.lockScreenTime > 1" /> |
| | | <LockScreen v-if="themeConfig.isLockScreen" /> |
| | | <Setings ref="setingsRef" v-show="themeConfig.lockScreenTime > 1" /> |
| | | <CloseFull v-if="!themeConfig.isLockScreen" /> |
| | | </el-config-provider> |
| | | <el-config-provider :size="getGlobalComponentSize" :locale="i18nLocale"> |
| | | <router-view v-show="themeConfig.lockScreenTime > 1" /> |
| | | <LockScreen v-if="themeConfig.isLockScreen" /> |
| | | <Setings ref="setingsRef" v-show="themeConfig.lockScreenTime > 1" /> |
| | | <CloseFull v-if="!themeConfig.isLockScreen" /> |
| | | </el-config-provider> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | |
| | | import CloseFull from '/@/layout/navBars/breadcrumb/closeFull.vue'; |
| | | import { initBackEndControlRoutes } from './router/backEnd'; |
| | | |
| | | export default ({ |
| | | name: 'app', |
| | | components: { LockScreen, Setings, CloseFull }, |
| | | setup() { |
| | | const { proxy } = <any>getCurrentInstance(); |
| | | const setingsRef = ref(); |
| | | const route = useRoute(); |
| | | const stores = useTagsViewRoutes(); |
| | | const storesThemeConfig = useThemeConfig(); |
| | | const { themeConfig } = storeToRefs(storesThemeConfig); |
| | | const state = reactive({ |
| | | i18nLocale: null, |
| | | }); |
| | | export default { |
| | | name: 'app', |
| | | components: { LockScreen, Setings, CloseFull }, |
| | | setup() { |
| | | const { proxy } = <any>getCurrentInstance(); |
| | | const setingsRef = ref(); |
| | | const route = useRoute(); |
| | | const stores = useTagsViewRoutes(); |
| | | const storesThemeConfig = useThemeConfig(); |
| | | const { themeConfig } = storeToRefs(storesThemeConfig); |
| | | const state = reactive({ |
| | | i18nLocale: null |
| | | }); |
| | | |
| | | // 获取全局组件大小 |
| | | const getGlobalComponentSize = computed(() => { |
| | | return other.globalComponentSize(); |
| | | }); |
| | | // 布局配置弹窗打开 |
| | | const openSetingsDrawer = () => { |
| | | setingsRef.value.openDrawer(); |
| | | }; |
| | | // 设置初始化,防止刷新时恢复默认 |
| | | onBeforeMount(() => { |
| | | // 设置批量第三方 icon 图标 |
| | | setIntroduction.cssCdn(); |
| | | // 设置批量第三方 js |
| | | setIntroduction.jsCdn(); |
| | | }); |
| | | // 页面加载时 |
| | | onMounted( () => { |
| | | nextTick(() => { |
| | | // 监听布局配置弹窗点击打开 |
| | | proxy.mittBus.on('openSetingsDrawer', () => { |
| | | openSetingsDrawer(); |
| | | }); |
| | | // 设置 i18n,App.vue 中的 el-config-provider |
| | | proxy.mittBus.on('getI18nConfig', (locale: string) => { |
| | | (state.i18nLocale as string | null) = locale; |
| | | }); |
| | | // 获取缓存中的布局配置 |
| | | if (Local.get('themeConfig')) { |
| | | storesThemeConfig.setThemeConfig(Local.get('themeConfig')); |
| | | document.documentElement.style.cssText = Local.get('themeConfigStyle'); |
| | | } |
| | | // 获取缓存中的全屏配置 |
| | | if (Session.get('isTagsViewCurrenFull')) { |
| | | stores.setCurrenFullscreen(Session.get('isTagsViewCurrenFull')); |
| | | } |
| | | }); |
| | | // if(!Session.get('token')) return |
| | | // initBackEndControlRoutes() |
| | | }); |
| | | // 页面销毁时,关闭监听布局配置/i18n监听 |
| | | onUnmounted(() => { |
| | | proxy.mittBus.off('openSetingsDrawer', () => {}); |
| | | proxy.mittBus.off('getI18nConfig', () => {}); |
| | | }); |
| | | // 监听路由的变化,设置网站标题 |
| | | watch( |
| | | () => route.path, |
| | | () => { |
| | | other.useTitle(); |
| | | }, |
| | | { |
| | | deep: true, |
| | | } |
| | | ); |
| | | return { |
| | | themeConfig, |
| | | setingsRef, |
| | | getGlobalComponentSize, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | }); |
| | | // 获取全局组件大小 |
| | | const getGlobalComponentSize = computed(() => { |
| | | return other.globalComponentSize(); |
| | | }); |
| | | // 布局配置弹窗打开 |
| | | const openSetingsDrawer = () => { |
| | | setingsRef.value.openDrawer(); |
| | | }; |
| | | // 设置初始化,防止刷新时恢复默认 |
| | | onBeforeMount(() => { |
| | | // 设置批量第三方 icon 图标 |
| | | setIntroduction.cssCdn(); |
| | | // 设置批量第三方 js |
| | | setIntroduction.jsCdn(); |
| | | }); |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | nextTick(() => { |
| | | // 监听布局配置弹窗点击打开 |
| | | proxy.mittBus.on('openSetingsDrawer', () => { |
| | | openSetingsDrawer(); |
| | | }); |
| | | // 设置 i18n,App.vue 中的 el-config-provider |
| | | proxy.mittBus.on('getI18nConfig', (locale: string) => { |
| | | (state.i18nLocale as string | null) = locale; |
| | | }); |
| | | // 获取缓存中的布局配置 |
| | | if (Local.get('themeConfig')) { |
| | | storesThemeConfig.setThemeConfig(Local.get('themeConfig')); |
| | | document.documentElement.style.cssText = Local.get('themeConfigStyle'); |
| | | } |
| | | // 获取缓存中的全屏配置 |
| | | if (Session.get('isTagsViewCurrenFull')) { |
| | | stores.setCurrenFullscreen(Session.get('isTagsViewCurrenFull')); |
| | | } |
| | | }); |
| | | // if(!Session.get('token')) return |
| | | // initBackEndControlRoutes() |
| | | }); |
| | | // 页面销毁时,关闭监听布局配置/i18n监听 |
| | | onUnmounted(() => { |
| | | proxy.mittBus.off('openSetingsDrawer', () => {}); |
| | | proxy.mittBus.off('getI18nConfig', () => {}); |
| | | }); |
| | | // 监听路由的变化,设置网站标题 |
| | | watch( |
| | | () => route.path, |
| | | () => { |
| | | other.useTitle(); |
| | | }, |
| | | { |
| | | deep: true |
| | | } |
| | | ); |
| | | return { |
| | | themeConfig, |
| | | setingsRef, |
| | | getGlobalComponentSize, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
对比新文件 |
| | |
| | | import request from '/@/utils/request'; |
| | | |
| | | export function RFIDApi() { |
| | | return { |
| | | // v1 |
| | | getRFIDList: (data: object) => { |
| | | return request({ |
| | | url: `/SafeCheckRfid/select/listRfidByPag`, |
| | | method: 'post', |
| | | data: data |
| | | }); |
| | | }, |
| | | // v1 |
| | | addRFID: (data: object) => { |
| | | return request({ |
| | | url: `/SafeCheckRfid/insert/saveRfid`, |
| | | method: 'post', |
| | | data: data |
| | | }); |
| | | }, |
| | | // v1 |
| | | modRFID: (data: object) => { |
| | | return request({ |
| | | url: `/SafeCheckRfid/update/updateRfidById`, |
| | | method: 'post', |
| | | data: data |
| | | }); |
| | | }, |
| | | // v1 |
| | | deleteRFID: (data: object) => { |
| | | return request({ |
| | | url: `/SafeCheckRfid/delete/deleteRfidById`, |
| | | method: 'post', |
| | | data: data |
| | | }); |
| | | }, |
| | | // v1 |
| | | getAllRFIDList: () => { |
| | | return request({ |
| | | url: `/prevent/device/select/listDevices`, |
| | | method: 'post' |
| | | }); |
| | | } |
| | | }; |
| | | } |
对比新文件 |
| | |
| | | import request from '/@/utils/request'; |
| | | |
| | | export function inspectTargetApi() { |
| | | return { |
| | | // v1 |
| | | getInspectTargetList: (data: object) => { |
| | | return request({ |
| | | url: `/safeCheckQuota/select/listQuotaByPage`, |
| | | method: 'post', |
| | | data: data |
| | | }); |
| | | }, |
| | | // v1 |
| | | addInspectTarget: (data: object) => { |
| | | return request({ |
| | | url: `/safeCheckQuota/insert/saveQuota`, |
| | | method: 'post', |
| | | data: data |
| | | }); |
| | | }, |
| | | // v1 |
| | | modInspectTarget: (data: object) => { |
| | | return request({ |
| | | url: `/safeCheckQuota/update/updateQuotaById`, |
| | | method: 'post', |
| | | data: data |
| | | }); |
| | | }, |
| | | // v1 |
| | | deleteInspectTarget: (data: object) => { |
| | | return request({ |
| | | url: `/safeCheckQuota/delete/deleteQuotaById`, |
| | | method: 'post', |
| | | data: data |
| | | }); |
| | | }, |
| | | // v1 |
| | | getAllInspectTargetList: () => { |
| | | return request({ |
| | | url: `/prevent/device/select/listDevices`, |
| | | method: 'post' |
| | | }); |
| | | } |
| | | }; |
| | | } |
| | |
| | | .input-box{ |
| | | width: 200px !important; |
| | | padding-right: 10px; |
| | | } |
| | | .basic-line{ |
| | | display: inline-block; |
| | | padding-left: 10px; |
| | | } |
| | | .page-position{ |
| | | float: right; |
| | | } |
| | |
| | | import { initFrontEndControlRoutes } from '/@/router/frontEnd'; |
| | | import { initBackEndControlRoutes } from '/@/router/backEnd'; |
| | | import { useUserInfo } from '/@/stores/userInfo'; |
| | | import { nextTick } from 'vue'; |
| | | |
| | | // 读取 `/src/stores/themeConfig.ts` 是否开启后端控制路由配置 |
| | | const storesThemeConfig = useThemeConfig(pinia); |
| | |
| | | import { RouteRecordRaw } from 'vue-router'; |
| | | |
| | | export const dynamicRoutes: Array<RouteRecordRaw> = [ |
| | | |
| | | { |
| | | path: '/', |
| | | name: '/', |
| | | component: () => import('/@/layout/index.vue'), |
| | | redirect: '/home', |
| | | meta: { |
| | | isKeepAlive: true, |
| | | }, |
| | | children: [ |
| | | { |
| | | path: '/home', |
| | | name: 'home', |
| | | component: () => import('/@/views/home/index.vue'), |
| | | meta: { |
| | | title: 'message.router.home', |
| | | isLink: '', |
| | | isHide: false, |
| | | isKeepAlive: true, |
| | | isAffix: true, |
| | | isIframe: false, |
| | | roles: ['admin', 'common'], |
| | | icon: 'iconfont icon-shouye', |
| | | button:'121231' |
| | | }, |
| | | }, |
| | | ], |
| | | }, |
| | | { |
| | | path: '/', |
| | | name: '/', |
| | | component: () => import('/@/layout/index.vue'), |
| | | redirect: '/home', |
| | | meta: { |
| | | isKeepAlive: false |
| | | }, |
| | | children: [ |
| | | { |
| | | path: '/home', |
| | | name: 'home', |
| | | component: () => import('/@/views/home/index.vue'), |
| | | meta: { |
| | | title: '首页', |
| | | isLink: '', |
| | | isHide: false, |
| | | isKeepAlive: true, |
| | | isAffix: true, |
| | | isIframe: false, |
| | | roles: ['admin', 'common'], |
| | | icon: 'iconfont icon-shouye' |
| | | } |
| | | } |
| | | ] |
| | | } |
| | | ]; |
| | | |
| | | |
| | | export const notFoundAndNoPower = [ |
| | | { |
| | | path: '/:path(.*)*', |
| | | name: 'notFound', |
| | | component: () => import('/@/views/error/404.vue'), |
| | | meta: { |
| | | title: 'message.staticRoutes.notFound', |
| | | isHide: true, |
| | | }, |
| | | }, |
| | | { |
| | | path: '/401', |
| | | name: 'noPower', |
| | | component: () => import('/@/views/error/401.vue'), |
| | | meta: { |
| | | title: 'message.staticRoutes.noPower', |
| | | isHide: true, |
| | | }, |
| | | }, |
| | | { |
| | | path: '/:path(.*)*', |
| | | name: 'notFound', |
| | | component: () => import('/@/views/error/404.vue'), |
| | | meta: { |
| | | title: 'message.staticRoutes.notFound', |
| | | isHide: true |
| | | } |
| | | }, |
| | | { |
| | | path: '/401', |
| | | name: 'noPower', |
| | | component: () => import('/@/views/error/401.vue'), |
| | | meta: { |
| | | title: 'message.staticRoutes.noPower', |
| | | isHide: true |
| | | } |
| | | } |
| | | ]; |
| | | |
| | | export const staticRoutes: Array<RouteRecordRaw> = [ |
| | | { |
| | | path: '/', |
| | | name: '/', |
| | | component: () => import('/@/layout/index.vue'), |
| | | meta: { |
| | | title: '布局界面', |
| | | }, |
| | | children: [ |
| | | // 请不要往这里 `children` 中添加内容,此内容为了防止 No match found for location with path "xxx" 问题 |
| | | ...notFoundAndNoPower, |
| | | ], |
| | | }, |
| | | { |
| | | path: '/login', |
| | | name: 'login', |
| | | component: () => import('/@/views/loginPage/loginPage.vue'), |
| | | meta: { |
| | | title: '登录', |
| | | }, |
| | | }, |
| | | { |
| | | path: '/homeMenu', |
| | | name: 'homeMenu', |
| | | component: () => import('/@/views/homeMenu/homeMenu.vue'), |
| | | meta: { |
| | | title: '登录', |
| | | }, |
| | | }, |
| | | { |
| | | path: '/', |
| | | name: '/', |
| | | component: () => import('/@/layout/index.vue'), |
| | | meta: { |
| | | title: '布局界面' |
| | | }, |
| | | children: [ |
| | | // 请不要往这里 `children` 中添加内容,此内容为了防止 No match found for location with path "xxx" 问题 |
| | | ...notFoundAndNoPower |
| | | ] |
| | | }, |
| | | { |
| | | path: '/login', |
| | | name: 'login', |
| | | component: () => import('/@/views/loginPage/loginPage.vue'), |
| | | meta: { |
| | | title: '登录' |
| | | } |
| | | }, |
| | | { |
| | | path: '/homeMenu', |
| | | name: 'homeMenu', |
| | | component: () => import('/@/views/homeMenu/homeMenu.vue'), |
| | | meta: { |
| | | title: '登录' |
| | | } |
| | | } |
| | | ]; |
| | |
| | | |
| | | // 用户信息 |
| | | export interface UserInfosState { |
| | | authBtnList: string[]; |
| | | photo: string; |
| | | roles: string[]; |
| | | time: number; |
| | | userName: string; |
| | | uid:string; |
| | | projectId:string; |
| | | authBtnList: string[]; |
| | | photo: string; |
| | | roles: string[]; |
| | | time: number; |
| | | userName: string; |
| | | uid: string; |
| | | projectId: string; |
| | | } |
| | | export interface UserInfosStates { |
| | | userInfos: UserInfosState; |
| | | userInfos: UserInfosState; |
| | | } |
| | | |
| | | // 路由缓存列表 |
| | | export interface KeepAliveNamesState { |
| | | keepAliveNames: string[]; |
| | | cachedViews: string[]; |
| | | keepAliveNames: string[]; |
| | | cachedViews: string[]; |
| | | } |
| | | |
| | | // 后端返回原始路由(未处理时) |
| | | export interface RequestOldRoutesState { |
| | | requestOldRoutes: string[]; |
| | | requestOldRoutes: string[]; |
| | | } |
| | | |
| | | // TagsView 路由列表 |
| | | export interface TagsViewRoutesState { |
| | | tagsViewRoutes: string[]; |
| | | isTagsViewCurrenFull: Boolean; |
| | | tagsViewRoutes: string[]; |
| | | isTagsViewCurrenFull: Boolean; |
| | | } |
| | | |
| | | // 路由列表 |
| | | export interface RoutesListState { |
| | | routesList: string[]; |
| | | isColumnsMenuHover: Boolean; |
| | | isColumnsNavHover: Boolean; |
| | | projectId:string, |
| | | routesList: string[]; |
| | | isColumnsMenuHover: Boolean; |
| | | isColumnsNavHover: Boolean; |
| | | projectId: string; |
| | | } |
| | | |
| | | export interface loginInfoState { |
| | | loginUser:{ |
| | | projectId:string, |
| | | token:string, |
| | | uid:string, |
| | | } |
| | | loginUser: { |
| | | projectId: string; |
| | | token: string; |
| | | uid: string; |
| | | }; |
| | | } |
| | | |
| | | // 布局配置 |
| | | export interface ThemeConfigState { |
| | | isDrawer: boolean; |
| | | primary: string; |
| | | topBar: string; |
| | | topBarColor: string; |
| | | isTopBarColorGradual: boolean; |
| | | menuBar: string; |
| | | menuBarColor: string; |
| | | isMenuBarColorGradual: boolean; |
| | | columnsMenuBar: string; |
| | | columnsMenuBarColor: string; |
| | | isColumnsMenuBarColorGradual: boolean; |
| | | isCollapse: boolean; |
| | | isUniqueOpened: boolean; |
| | | isFixedHeader: boolean; |
| | | isFixedHeaderChange: boolean; |
| | | isClassicSplitMenu: boolean; |
| | | isLockScreen: boolean; |
| | | lockScreenTime: number; |
| | | isShowLogo: boolean; |
| | | isShowLogoChange: boolean; |
| | | isBreadcrumb: boolean; |
| | | isTagsview: boolean; |
| | | isBreadcrumbIcon: boolean; |
| | | isTagsviewIcon: boolean; |
| | | isCacheTagsView: boolean; |
| | | isSortableTagsView: boolean; |
| | | isShareTagsView: boolean; |
| | | isFooter: boolean; |
| | | isGrayscale: boolean; |
| | | isInvert: boolean; |
| | | isIsDark: boolean; |
| | | isWartermark: boolean; |
| | | wartermarkText: string; |
| | | tagsStyle: string; |
| | | animation: string; |
| | | columnsAsideStyle: string; |
| | | columnsAsideLayout: string; |
| | | layout: string; |
| | | isRequestRoutes: boolean; |
| | | globalTitle: string; |
| | | globalViceTitle: string; |
| | | globalI18n: string; |
| | | globalComponentSize: string; |
| | | isDrawer: boolean; |
| | | primary: string; |
| | | topBar: string; |
| | | topBarColor: string; |
| | | isTopBarColorGradual: boolean; |
| | | menuBar: string; |
| | | menuBarColor: string; |
| | | isMenuBarColorGradual: boolean; |
| | | columnsMenuBar: string; |
| | | columnsMenuBarColor: string; |
| | | isColumnsMenuBarColorGradual: boolean; |
| | | isCollapse: boolean; |
| | | isUniqueOpened: boolean; |
| | | isFixedHeader: boolean; |
| | | isFixedHeaderChange: boolean; |
| | | isClassicSplitMenu: boolean; |
| | | isLockScreen: boolean; |
| | | lockScreenTime: number; |
| | | isShowLogo: boolean; |
| | | isShowLogoChange: boolean; |
| | | isBreadcrumb: boolean; |
| | | isTagsview: boolean; |
| | | isBreadcrumbIcon: boolean; |
| | | isTagsviewIcon: boolean; |
| | | isCacheTagsView: boolean; |
| | | isSortableTagsView: boolean; |
| | | isShareTagsView: boolean; |
| | | isFooter: boolean; |
| | | isGrayscale: boolean; |
| | | isInvert: boolean; |
| | | isIsDark: boolean; |
| | | isWartermark: boolean; |
| | | wartermarkText: string; |
| | | tagsStyle: string; |
| | | animation: string; |
| | | columnsAsideStyle: string; |
| | | columnsAsideLayout: string; |
| | | layout: string; |
| | | isRequestRoutes: boolean; |
| | | globalTitle: string; |
| | | globalViceTitle: string; |
| | | globalI18n: string; |
| | | globalComponentSize: string; |
| | | } |
| | | export interface ThemeConfigStates { |
| | | themeConfig: ThemeConfigState; |
| | | themeConfig: ThemeConfigState; |
| | | } |
对比新文件 |
| | |
| | | <template></template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>11223</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template></template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template></template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isShowInspectionTaskDialog" append-to-body :close-on-click-modal="false" width="50%"> |
| | | <el-divider></el-divider> |
| | | <div class="inspectionTask-form"> |
| | | <el-form |
| | | :model="inspectionTaskForm" |
| | | :rules="inspectionTaskFormRules" |
| | | ref="productionDeviceFormRef" |
| | | size="default" |
| | | label-width="120px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20"> |
| | | <el-form-item label="任务名称" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="inspectionTaskForm.produceDeviceName" |
| | | placeholder="请输入任务名称" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20"> |
| | | <el-form-item label="任务类型" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="inspectionTaskForm.produceDeviceName" |
| | | placeholder="请输入任务类型" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20"> |
| | | <el-form-item label="检查频次" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="inspectionTaskForm.produceDeviceName" |
| | | placeholder="请输入检查频次" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20"> |
| | | <el-form-item label="周期开始时间" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="inspectionTaskForm.produceDeviceName" |
| | | placeholder="请输入周期开始时间" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20"> |
| | | <el-form-item label="有效时间" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="inspectionTaskForm.produceDeviceName" |
| | | placeholder="请输入有效时间" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20"> |
| | | <el-form-item label="提前通知时间" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="inspectionTaskForm.produceDeviceName" |
| | | placeholder="请输入提前通知时间" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20"> |
| | | <el-form-item label="巡检部门" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="inspectionTaskForm.produceDeviceName" |
| | | placeholder="请输入巡检部门" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12" class="mb20"> |
| | | <el-form-item label="巡检班组" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="inspectionTaskForm.produceDeviceName" |
| | | placeholder="请输入巡检班组" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | </div> |
| | | |
| | | <div class="inspectionTask-point"> |
| | | <el-tabs class="active" v-model="activeName"> |
| | | <el-tab-pane label="检查项信息" name="inspectionPoint"> |
| | | <div class="filter-container"> |
| | | <el-button size="default" type="success" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增排查任务 |
| | | </el-button> |
| | | </div> |
| | | |
| | | <el-table :data="inspectionPointData" border fit highlight-current-row style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="depName" label="所属部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskLevel" label="风险等级" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="location" label="区域位置" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-tab-pane> |
| | | </el-tabs> |
| | | </div> |
| | | |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowInspectionTaskDialog = !isShowInspectionTaskDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitProductionDevice" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isShowInspectionTaskDialog: Boolean; |
| | | inspectionTaskForm: { |
| | | produceDeviceName: string; |
| | | depId: number | null; |
| | | riskLevel: number | null; |
| | | location: string; |
| | | }; |
| | | title: string; |
| | | activeName: string; |
| | | departmentList: []; |
| | | inspectionPointData: []; |
| | | levelList: Array<levelListState>; |
| | | inspectionTaskFormRules: {}; |
| | | } |
| | | interface levelListState {} |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'inspectionTaskDialog', |
| | | setup(props: any, context: any) { |
| | | const productionDeviceFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | activeName: 'inspectionPoint', |
| | | inspectionPointData: [], |
| | | departmentList: [], |
| | | isShowInspectionTaskDialog: false, |
| | | levelList: [ |
| | | { id: 1, name: '低风险' }, |
| | | { id: 2, name: '一般风险' }, |
| | | { id: 3, name: '较大风险' }, |
| | | { id: 4, name: '重大风险' } |
| | | ], |
| | | inspectionTaskForm: { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }, |
| | | inspectionTaskFormRules: { |
| | | produceDeviceName: [{ required: true, message: '请填写生产装置名称', trigger: 'blur' }], |
| | | depId: [{ required: true, message: '请选择部门', trigger: 'change' }], |
| | | riskLevel: [{ required: true, message: '请选择风险等级', trigger: 'change' }], |
| | | location: [{ required: true, message: '请填写区域位置', trigger: 'blur' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openProductionDeviceDialog = (type: string, value: object, department: []) => { |
| | | state.isShowInspectionTaskDialog = true; |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | productionDeviceFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增生产装置'; |
| | | state.inspectionTaskForm = { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }; |
| | | } else { |
| | | state.title = '修改生产装置'; |
| | | state.inspectionTaskForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitProductionDevice = async () => { |
| | | productionDeviceFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增生产装置') { |
| | | let res = await productionDeviceApi().addProductionDevice(state.inspectionTaskForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowInspectionTaskDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await productionDeviceApi().modProductionDevice(state.productionDeviceForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowInspectionTaskDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | productionDeviceFormRef, |
| | | submitProductionDevice, |
| | | openProductionDeviceDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | ::v-deep.el-divider--horizontal { |
| | | margin-top: 0px !important; |
| | | } |
| | | |
| | | ::v-deep.el-dialog__body { |
| | | padding-top: 10px !important; |
| | | } |
| | | .filter-container { |
| | | padding: 10px 0px; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>风险等级:</span> |
| | | <el-select v-model="productionDeviceData.params.riskLevel" clearable filterable class="input-box" placeholder="请选择风险等级"> |
| | | <el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>部门:</span> |
| | | <el-cascader |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | class="input-box" |
| | | v-model="productionDeviceData.params.depId" |
| | | > |
| | | </el-cascader> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增排查任务 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="productionDeviceData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="depName" label="所属部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskLevel" label="风险等级" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="location" label="区域位置" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="状态" show-overflow-tooltip> </el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="productionDeviceData.params.pageIndex" |
| | | background |
| | | v-model:page-size="productionDeviceData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="productionDeviceData.total" |
| | | class="page-position" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </el-card> |
| | | <inspectionTaskDialog ref="inspectionTaskDialogRef" @refreshProductionDevice="initProductionDeviceTableData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import inspectionTaskDialog from './components/inspectionTaskDialog.vue'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | productionDeviceData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskLevel: number | null; |
| | | status: number; |
| | | depId: number | null; |
| | | location: string | null; |
| | | produceDeviceName: string | null; |
| | | }; |
| | | }; |
| | | departmentList: Array<DepartmentState>; |
| | | levelList: Array<levelListState>; |
| | | } |
| | | interface levelListState {} |
| | | interface DepartmentState {} |
| | | |
| | | export default defineComponent({ |
| | | name: 'productionDevice', |
| | | components: { inspectionTaskDialog }, |
| | | setup() { |
| | | const inspectionTaskDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | productionDeviceData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskLevel: null, |
| | | status: 1, |
| | | depId: null, |
| | | location: null, |
| | | produceDeviceName: null |
| | | } |
| | | }, |
| | | departmentList: [], |
| | | levelList: [ |
| | | { id: 1, name: '低风险' }, |
| | | { id: 2, name: '一般风险' }, |
| | | { id: 3, name: '较大风险' }, |
| | | { id: 4, name: '重大风险' } |
| | | ] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initProductionDeviceTableData = async () => { |
| | | let res = await productionDeviceApi().getProductionDeviceList(state.productionDeviceData.params); |
| | | if (res.data.code === '200') { |
| | | state.productionDeviceData.data = res.data.data; |
| | | state.productionDeviceData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList(); |
| | | if (res.data.code === '200') { |
| | | state.departmentList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | inspectionTaskDialogRef.value.openProductionDeviceDialog(type, value, state.departmentList); |
| | | }; |
| | | // 删除角色 |
| | | const onDelProductionDevice = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条生产装置:“${row.produceDeviceName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await productionDeviceApi().deleteProductionDevice({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initProductionDeviceTableData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.productionDeviceData.params.pageSize = val; |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.productionDeviceData.params.pageIndex = val; |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initProductionDeviceTableData(); |
| | | getDepartmentData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelProductionDevice, |
| | | onHandleCurrentChange, |
| | | inspectionTaskDialog, |
| | | inspectionTaskDialogRef, |
| | | initProductionDeviceTableData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>222</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isRiskControlMeasureDialog" width="600px"> |
| | | <el-form |
| | | :model="riskControlMeasureForm" |
| | | :rules="riskControlMeasureFormRules" |
| | | ref="riskControlMeasureFormRef" |
| | | size="default" |
| | | label-width="160px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险事件名称" prop="riskEventId"> |
| | | <el-select class="input-length" v-model="riskControlMeasureForm.riskEventId" placeholder="请选择风险事件" clearable> |
| | | <el-option |
| | | v-for="item in allSafetyRiskEventData" |
| | | :key="item.id" |
| | | :label="item.riskEventName" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险措施编码" prop="controlMeasureCode"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="riskControlMeasureForm.controlMeasureCode" |
| | | placeholder="请输入风险措施编码" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控方式" prop="controlType"> |
| | | <el-select class="input-length" v-model="riskControlMeasureForm.controlType" placeholder="请选择管控方式" clearable> |
| | | <el-option v-for="item in controlTypeList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控内容" prop="checkContent"> |
| | | <el-input |
| | | class="input-length" |
| | | type="textarea" |
| | | :rows="3" |
| | | v-model.trim="riskControlMeasureForm.checkContent" |
| | | placeholder="请输入管控内容" |
| | | clearable |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类1" prop="classify1"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model.trim="riskControlMeasureForm.classify1" |
| | | @change="changeClassifyTwoList" |
| | | placeholder="请选择管控方式" |
| | | clearable |
| | | > |
| | | <el-option v-for="item in classifyOneList" :key="item.id" :label="item.riskMeasureName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类2" prop="classify2"> |
| | | <el-select class="input-length" v-model="riskControlMeasureForm.classify2" placeholder="请选择管控方式" clearable> |
| | | <el-option v-for="item in classifyTwoList" :key="item.id" :label="item.riskMeasureName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类3" prop="classify3"> |
| | | <el-input class="input-length" v-model.trim="riskControlMeasureForm.classify3" placeholder="请选择管控方式" clearable> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="措施说明" prop="measureDesc"> |
| | | <el-input |
| | | class="input-length" |
| | | type="textarea" |
| | | :rows="3" |
| | | v-model.trim="riskControlMeasureForm.measureDesc" |
| | | placeholder="请输入措施说明" |
| | | clearable |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isRiskControlMeasureDialog = !isRiskControlMeasureDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitRiskControlMeasureDialog" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isRiskControlMeasureDialog: Boolean; |
| | | riskControlMeasureForm: { |
| | | riskEventId: number | null; |
| | | controlMeasureCode: string | null; |
| | | controlType: number | null; |
| | | checkContent: string | null; |
| | | classify1: number | null; |
| | | classify2: number | null; |
| | | classify3: string | null; |
| | | measureDesc: string | null; |
| | | }; |
| | | title: string; |
| | | controlTypeList: Array<controlTypeListType>; |
| | | classifyOneList: []; |
| | | classifyTwoList: Array<classifyTwoType>; |
| | | classifyTwoListAll: []; |
| | | allSafetyRiskEventData: []; |
| | | riskControlMeasureFormRules: {}; |
| | | } |
| | | interface classifyTwoType { |
| | | id: number; |
| | | riskMeasureName: string; |
| | | } |
| | | interface controlTypeListType {} |
| | | |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { riskControlMeasureApi } from '/@/api/doublePreventSystem/riskControlMeasure'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'riskControlMeasureDialog', |
| | | setup(props: any, context: any) { |
| | | const riskControlMeasureFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | controlTypeList: [ |
| | | { id: 1, name: '自动化监控' }, |
| | | { id: 2, name: '隐患排查' } |
| | | ], |
| | | classifyOneList: [], |
| | | classifyTwoList: [], |
| | | classifyTwoListAll: [], |
| | | allSafetyRiskEventData: [], |
| | | isRiskControlMeasureDialog: false, |
| | | riskControlMeasureForm: { |
| | | riskEventId: null, |
| | | controlMeasureCode: null, |
| | | controlType: null, |
| | | checkContent: null, |
| | | classify1: null, |
| | | classify2: null, |
| | | classify3: null, |
| | | measureDesc: null |
| | | }, |
| | | riskControlMeasureFormRules: { |
| | | riskCode: [{ required: true, message: '请填写安全风险分析对象编码', trigger: 'blur' }], |
| | | riskUnitName: [{ required: true, message: '请填写安全风险分析单元名称', trigger: 'blur' }], |
| | | liableDepId: [{ required: true, message: '请选择责任部门', trigger: 'change' }], |
| | | liablePersonId: [{ required: true, message: '请选择责任人', trigger: 'change' }], |
| | | produceDeviceId: [{ required: true, message: '请选择生产装置', trigger: 'change' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openSafetyRiskEventDialog = (type: string, value: object, allSafetyRiskEventData: [], classifyOneList: [], classifyTwoList: []) => { |
| | | state.isRiskControlMeasureDialog = true; |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(allSafetyRiskEventData)); |
| | | state.classifyOneList = JSON.parse(JSON.stringify(classifyOneList)); |
| | | state.classifyTwoListAll = JSON.parse(JSON.stringify(classifyTwoList)); |
| | | state.classifyTwoList = []; |
| | | setTimeout(() => { |
| | | riskControlMeasureFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增风险管控措施'; |
| | | state.riskControlMeasureForm = { |
| | | riskEventId: null, |
| | | controlMeasureCode: null, |
| | | controlType: null, |
| | | checkContent: null, |
| | | classify1: null, |
| | | classify2: null, |
| | | classify3: null, |
| | | measureDesc: null |
| | | }; |
| | | } else { |
| | | state.title = '修改风险管控措施'; |
| | | state.riskControlMeasureForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | const changeClassifyTwoList = () => { |
| | | state.riskControlMeasureForm.classify2 = null; |
| | | state.classifyTwoList = []; |
| | | state.classifyTwoList = state.classifyTwoListAll.filter((item: any) => item.parentId === state.riskControlMeasureForm.classify1); |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitRiskControlMeasureDialog = async () => { |
| | | riskControlMeasureFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增风险管控措施') { |
| | | let res = await riskControlMeasureApi().addRiskControlMeasure(state.riskControlMeasureForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险管控措施新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isRiskControlMeasureDialog = false; |
| | | context.emit('refreshRiskControlMeasure'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await riskControlMeasureApi().modRiskControlMeasure(state.riskControlMeasureForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险管控措施修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isRiskControlMeasureDialog = false; |
| | | context.emit('refreshRiskControlMeasure'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | riskControlMeasureFormRef, |
| | | changeClassifyTwoList, |
| | | submitRiskControlMeasureDialog, |
| | | openSafetyRiskEventDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>管控方式:</span> |
| | | <el-select class="input-box" v-model="riskControlMeasureData.params.controlType" placeholder="管控方式" clearable> |
| | | <el-option v-for="item in controlTypeList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>安全风险事件:</span> |
| | | <el-select class="input-box" v-model="riskControlMeasureData.params.riskEventId" placeholder="安全风险事件" clearable> |
| | | <el-option v-for="item in allSafetyRiskEventData" :key="item.id" :label="item.riskEventName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增措施 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="riskControlMeasureData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="riskEventName" label="安全风险事件名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="controlMeasureCode" label="风控措施编码" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="controlType" label="管控方式" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="checkContent" label="管控内容" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="classify1" label="管控措施分类1" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="classify2" label="管控措施分类2" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="classify3" label="管控措施分类3" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="measureDesc" label="措施说明" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <span>{{ dateFormat('YYYY-mm-dd HH:MM:SS', '2022-07-07T08:00:00') }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelRiskControlMeasure(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="page-position" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="riskControlMeasureData.params.pageIndex" |
| | | background |
| | | v-model:page-size="riskControlMeasureData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="riskControlMeasureData.total" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </el-card> |
| | | <riskControlMeasureDialog ref="riskControlMeasureDialogRef" @refreshRiskControlMeasure="initRiskControlMeasureData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import riskControlMeasureDialog from './components/riskControlMeasureDialog.vue'; |
| | | import { riskControlMeasureApi } from '/@/api/doublePreventSystem/riskControlMeasure/index.ts'; |
| | | import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | riskControlMeasureData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | controlType: number | null; |
| | | riskEventId: number | null; |
| | | }; |
| | | }; |
| | | controlTypeList: Array<controlTypeType>; |
| | | classifyOneList: Array<classifyOneType>; |
| | | classifyTwoList: Array<classifyTwoType>; |
| | | allSafetyRiskEventData: Array<SafetyRiskEventDataState>; |
| | | } |
| | | interface controlTypeType {} |
| | | interface classifyOneType {} |
| | | interface classifyTwoType {} |
| | | interface SafetyRiskEventDataState {} |
| | | |
| | | // interface controlTypeListType { |
| | | // id: number; |
| | | // riskMeasureName: string; |
| | | // } |
| | | // |
| | | // class myType implements controlTypeListType { |
| | | // id: number; |
| | | // riskMeasureName: string; |
| | | // constructor(id: number, riskMeasureName: string) { |
| | | // this.id = id; |
| | | // this.riskMeasureName = riskMeasureName; |
| | | // } |
| | | // bark() { |
| | | // console.log('1111'); |
| | | // } |
| | | // } |
| | | // |
| | | // class type extends myType { |
| | | // bark() { |
| | | // console.log('222'); |
| | | // } |
| | | // } |
| | | // class typeTwo extends myType { |
| | | // bark() { |
| | | // super.bark(); |
| | | // } |
| | | // } |
| | | // |
| | | // var test = new type(123, '23123'); |
| | | // var test2 = new typeTwo(222, '333'); |
| | | |
| | | export default { |
| | | name: 'riskControlMeasure', |
| | | components: { riskControlMeasureDialog }, |
| | | setup() { |
| | | const riskControlMeasureDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | riskControlMeasureData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | controlType: null, |
| | | riskEventId: null |
| | | } |
| | | }, |
| | | controlTypeList: [ |
| | | { id: 1, name: '自动化监控' }, |
| | | { id: 2, name: '隐患排查' } |
| | | ], |
| | | classifyOneList: [], |
| | | classifyTwoList: [], |
| | | allSafetyRiskEventData: [] |
| | | }); |
| | | |
| | | // 初始化表格数据 |
| | | const initRiskControlMeasureData = async () => { |
| | | // console.log(test.bark()); |
| | | // console.log(test2.bark()); |
| | | let res = await riskControlMeasureApi().getRiskControlMeasureList(state.riskControlMeasureData.params); |
| | | if (res.data.code === '200') { |
| | | state.riskControlMeasureData.data = res.data.data; |
| | | state.riskControlMeasureData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const dateFormat = (fmt: any, date: any) => { |
| | | date = new Date(date); |
| | | fmt = |
| | | date.getFullYear() + |
| | | '-' + |
| | | (date.getMonth() + 1) + |
| | | '-' + |
| | | date.getDate() + |
| | | ' ' + |
| | | date.getHours().toString() + |
| | | ':' + |
| | | (date.getMinutes().toString() === '0' ? '00' : date.getMinutes().toString()) + |
| | | ':' + |
| | | (date.getSeconds().toString() === '0' ? '00' : date.getMinutes().toString()); |
| | | return fmt; |
| | | }; |
| | | |
| | | //获取安全风险事件 |
| | | const getAllSafetyRiskEvent = async () => { |
| | | let res = await safetyRiskEventApi().getAllSafetyRiskEventList(); |
| | | if (res.data.code === '200') { |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(res.data.data)); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //获取管控措施分类 |
| | | const getClassify = async () => { |
| | | let res = await riskControlMeasureApi().getClassifyData(); |
| | | if (res.data.code === '200') { |
| | | state.classifyOneList = res.data.data.filter((item: any) => item.parentId === null); |
| | | state.classifyTwoList = res.data.data.filter((item: any) => item.parentId !== null); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | riskControlMeasureDialogRef.value.openSafetyRiskEventDialog( |
| | | type, |
| | | value, |
| | | state.allSafetyRiskEventData, |
| | | state.classifyOneList, |
| | | state.classifyTwoList |
| | | ); |
| | | }; |
| | | |
| | | // 删除角色 |
| | | const onDelRiskControlMeasure = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条风险管控措施:“${row.produceDeviceName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await riskControlMeasureApi().deleteRiskControlMeasure({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initRiskControlMeasureData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initRiskControlMeasureData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.riskControlMeasureData.params.pageSize = val; |
| | | initRiskControlMeasureData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.riskControlMeasureData.params.pageIndex = val; |
| | | initRiskControlMeasureData(); |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initRiskControlMeasureData(); |
| | | getAllSafetyRiskEvent(); |
| | | getClassify(); |
| | | }); |
| | | |
| | | return { |
| | | dateFormat, |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelRiskControlMeasure, |
| | | onHandleCurrentChange, |
| | | riskControlMeasureDialog, |
| | | riskControlMeasureDialogRef, |
| | | initRiskControlMeasureData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isShowProductionDeviceDialog" width="600px"> |
| | | <el-form |
| | | :model="productionDeviceForm" |
| | | :rules="productionDeviceFormRules" |
| | | ref="productionDeviceFormRef" |
| | | size="default" |
| | | label-width="120px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="生产装置名称" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="productionDeviceForm.produceDeviceName" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="所属部门" prop="depId"> |
| | | <el-cascader |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | style="width: 85%" |
| | | v-model="productionDeviceForm.depId" |
| | | > |
| | | </el-cascader> |
| | | <!-- <el-select class="input-length" v-model="productionDeviceForm.depName" placeholder="请选择所属部门" clearable filterable></el-select>--> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险等级" prop="riskLevel"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="productionDeviceForm.riskLevel" |
| | | placeholder="请选择风险等级" |
| | | clearable |
| | | filterable |
| | | > |
| | | <el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="区域位置" prop="location"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="productionDeviceForm.location" |
| | | type="textarea" |
| | | placeholder="请输入区域位置" |
| | | maxlength="150" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowProductionDeviceDialog = !isShowProductionDeviceDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitProductionDevice" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isShowProductionDeviceDialog: Boolean; |
| | | productionDeviceForm: { |
| | | produceDeviceName: string; |
| | | depId: number | null; |
| | | riskLevel: number | null; |
| | | location: string; |
| | | }; |
| | | title: string; |
| | | departmentList: []; |
| | | levelList: Array<levelListState>; |
| | | productionDeviceFormRules: {}; |
| | | } |
| | | interface levelListState {} |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'productionDeviceDialog', |
| | | setup(props: any, context: any) { |
| | | const productionDeviceFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | departmentList: [], |
| | | isShowProductionDeviceDialog: false, |
| | | levelList: [ |
| | | { id: 1, name: '低风险' }, |
| | | { id: 2, name: '一般风险' }, |
| | | { id: 3, name: '较大风险' }, |
| | | { id: 4, name: '重大风险' } |
| | | ], |
| | | productionDeviceForm: { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }, |
| | | productionDeviceFormRules: { |
| | | produceDeviceName: [{ required: true, message: '请填写生产装置名称', trigger: 'blur' }], |
| | | depId: [{ required: true, message: '请选择部门', trigger: 'change' }], |
| | | riskLevel: [{ required: true, message: '请选择风险等级', trigger: 'change' }], |
| | | location: [{ required: true, message: '请填写区域位置', trigger: 'blur' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openProductionDeviceDialog = (type: string, value: object, department: []) => { |
| | | state.isShowProductionDeviceDialog = true; |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | productionDeviceFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增生产装置'; |
| | | state.productionDeviceForm = { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }; |
| | | } else { |
| | | state.title = '修改生产装置'; |
| | | state.productionDeviceForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitProductionDevice = async () => { |
| | | productionDeviceFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增生产装置') { |
| | | let res = await productionDeviceApi().addProductionDevice(state.productionDeviceForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowProductionDeviceDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await productionDeviceApi().modProductionDevice(state.productionDeviceForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowProductionDeviceDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | productionDeviceFormRef, |
| | | submitProductionDevice, |
| | | openProductionDeviceDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>风险等级:</span> |
| | | <el-select v-model="productionDeviceData.params.riskLevel" clearable filterable class="input-box" placeholder="请选择风险等级"> |
| | | <el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>部门:</span> |
| | | <el-cascader |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | class="input-box" |
| | | v-model="productionDeviceData.params.depId" |
| | | > |
| | | </el-cascader> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增装置 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="productionDeviceData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="depName" label="所属部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskLevel" label="风险等级" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="location" label="区域位置" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="状态" show-overflow-tooltip> </el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="productionDeviceData.params.pageIndex" |
| | | background |
| | | v-model:page-size="productionDeviceData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="productionDeviceData.total" |
| | | class="page-position" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </el-card> |
| | | <productionDeviceDialog ref="productionDeviceDialogRef" @refreshProductionDevice="initProductionDeviceTableData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import productionDeviceDialog from './components/productionDeviceDialog.vue'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | productionDeviceData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskLevel: number | null; |
| | | status: number; |
| | | depId: number | null; |
| | | location: string | null; |
| | | produceDeviceName: string | null; |
| | | }; |
| | | }; |
| | | departmentList: Array<DepartmentState>; |
| | | levelList: Array<levelListState>; |
| | | } |
| | | interface levelListState {} |
| | | interface DepartmentState {} |
| | | |
| | | export default defineComponent({ |
| | | name: 'productionDevice', |
| | | components: { productionDeviceDialog }, |
| | | setup() { |
| | | const productionDeviceDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | productionDeviceData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskLevel: null, |
| | | status: 1, |
| | | depId: null, |
| | | location: null, |
| | | produceDeviceName: null |
| | | } |
| | | }, |
| | | departmentList: [], |
| | | levelList: [ |
| | | { id: 1, name: '低风险' }, |
| | | { id: 2, name: '一般风险' }, |
| | | { id: 3, name: '较大风险' }, |
| | | { id: 4, name: '重大风险' } |
| | | ] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initProductionDeviceTableData = async () => { |
| | | let res = await productionDeviceApi().getProductionDeviceList(state.productionDeviceData.params); |
| | | if (res.data.code === '200') { |
| | | state.productionDeviceData.data = res.data.data; |
| | | state.productionDeviceData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList(); |
| | | if (res.data.code === '200') { |
| | | state.departmentList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | productionDeviceDialogRef.value.openProductionDeviceDialog(type, value, state.departmentList); |
| | | }; |
| | | // 删除角色 |
| | | const onDelProductionDevice = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条生产装置:“${row.produceDeviceName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await productionDeviceApi().deleteProductionDevice({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initProductionDeviceTableData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.productionDeviceData.params.pageSize = val; |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.productionDeviceData.params.pageIndex = val; |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initProductionDeviceTableData(); |
| | | getDepartmentData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelProductionDevice, |
| | | onHandleCurrentChange, |
| | | productionDeviceDialog, |
| | | productionDeviceDialogRef, |
| | | initProductionDeviceTableData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isSafetyRiskEventDialog" width="600px"> |
| | | <el-form |
| | | :model="safetyRiskEventForm" |
| | | :rules="safetyRiskEventFormRules" |
| | | ref="safetyRiskAnalyseUnitFormRef" |
| | | size="default" |
| | | label-width="180px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险分析单元名称" prop="riskUnitId"> |
| | | <el-select class="input-length" v-model="safetyRiskEventForm.riskUnitId" placeholder="请输入安全风险分析单元名称"> |
| | | <el-option |
| | | v-for="item in allSafetyRiskEventData" |
| | | :key="item.id" |
| | | :label="item.riskUnitName" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险事件名称" prop="riskEventName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="safetyRiskEventForm.riskEventName" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isSafetyRiskEventDialog = !isSafetyRiskEventDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitSafetyRiskEventDialog" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isSafetyRiskEventDialog: Boolean; |
| | | safetyRiskEventForm: { |
| | | riskEventName: string | null; |
| | | riskUnitId: number | null; |
| | | }; |
| | | title: string; |
| | | departmentList: []; |
| | | allSafetyRiskEventData: []; |
| | | safetyRiskEventFormRules: {}; |
| | | } |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'productionDeviceDialog', |
| | | setup(props: any, context: any) { |
| | | const safetyRiskAnalyseUnitFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | departmentList: [], |
| | | allSafetyRiskEventData: [], |
| | | isSafetyRiskEventDialog: false, |
| | | safetyRiskEventForm: { |
| | | riskEventName: null, |
| | | riskUnitId: null |
| | | }, |
| | | safetyRiskEventFormRules: { |
| | | riskEventName: [{ required: true, message: '请填写安全风险分析对象编码', trigger: 'blur' }], |
| | | riskUnitId: [{ required: true, message: '请填写安全风险分析单元名称', trigger: 'blur' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openSafetyRiskEventDialog = (type: string, value: object, department: [], allSafetyRiskEventData: []) => { |
| | | state.isSafetyRiskEventDialog = true; |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(allSafetyRiskEventData)); |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | safetyRiskAnalyseUnitFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增风险事件'; |
| | | state.safetyRiskEventForm = { |
| | | riskEventName: null, |
| | | riskUnitId: null |
| | | }; |
| | | } else { |
| | | state.title = '修改风险事件'; |
| | | state.safetyRiskEventForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitSafetyRiskEventDialog = async () => { |
| | | safetyRiskAnalyseUnitFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增风险事件') { |
| | | let res = await safetyRiskEventApi().addSafetyRiskEvent(state.safetyRiskEventForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险事件新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskEventDialog = false; |
| | | context.emit('refreshSafetyRiskEvent'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await safetyRiskEventApi().modSafetyRiskEvent(state.safetyRiskEventForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险事件修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskEventDialog = false; |
| | | context.emit('refreshSafetyRiskEvent'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | safetyRiskAnalyseUnitFormRef, |
| | | submitSafetyRiskEventDialog, |
| | | openSafetyRiskEventDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>安全风险单元名称:</span> |
| | | <el-select v-model="safetyRiskEventData.params.riskUnitId" class="input-box" placeholder="安全风险单元名称"> |
| | | <el-option v-for="item in allSafetyRiskEventData" :key="item.id" :label="item.riskUnitName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>安全风险事件名称:</span> |
| | | <el-input v-model="safetyRiskEventData.params.riskEventName" class="input-box" placeholder="安全风险事件名称"> </el-input> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon><ele-Search /> </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增事件 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="safetyRiskEventData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="riskUnitName" label="安全风险分析单元名称" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskEventName" label="安全风险事件名称" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelSafetyRiskEvent(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="page-position" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="safetyRiskEventData.params.pageIndex" |
| | | background |
| | | v-model:page-size="safetyRiskEventData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="safetyRiskEventData.total" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </el-card> |
| | | <safetyRiskEventDialog ref="safetyRiskEventDialogRef" @refreshSafetyRiskEvent="initSafetyRiskEventData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import safetyRiskEventDialog from './components/safetyRiskEventDialog.vue'; |
| | | import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | safetyRiskEventData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskEventName: string | null; |
| | | }; |
| | | }; |
| | | allSafetyRiskEventData: Array<safetyRiskEventState>; |
| | | } |
| | | interface safetyRiskEventState {} |
| | | |
| | | export default { |
| | | name: 'productionDevice', |
| | | components: { safetyRiskEventDialog }, |
| | | setup() { |
| | | const safetyRiskEventDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | safetyRiskEventData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskEventName: null |
| | | } |
| | | }, |
| | | allSafetyRiskEventData: [] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initSafetyRiskEventData = async () => { |
| | | let res = await safetyRiskEventApi().getSafetyRiskEventList(state.safetyRiskEventData.params); |
| | | if (res.data.code === '200') { |
| | | state.safetyRiskEventData.data = res.data.data; |
| | | state.safetyRiskEventData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 获取安全风险分析单元数据 |
| | | const getAllSafetyRiskEventData = async () => { |
| | | let res = await safetyRiskAnalyseUnitApi().getAllSafetyRiskAnalyseUnitList(); |
| | | if (res.data.code === '200') { |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(res.data.data)); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开安全风险事件 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | safetyRiskEventDialogRef.value.openSafetyRiskEventDialog(type, value, state.allSafetyRiskEventData); |
| | | }; |
| | | |
| | | // 删除角色 |
| | | const onDelSafetyRiskEvent = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条安全风险事件:“${row.riskEventName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await safetyRiskEventApi().deleteSafetyRiskEvent({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initSafetyRiskEventData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initSafetyRiskEventData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.safetyRiskEventData.params.pageSize = val; |
| | | initSafetyRiskEventData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.safetyRiskEventData.params.pageIndex = val; |
| | | initSafetyRiskEventData(); |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | getAllSafetyRiskEventData(); |
| | | initSafetyRiskEventData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelSafetyRiskEvent, |
| | | onHandleCurrentChange, |
| | | safetyRiskEventDialog, |
| | | safetyRiskEventDialogRef, |
| | | initSafetyRiskEventData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>11223</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isSafetyRiskAnalyseUnitDialog" width="600px"> |
| | | <el-form |
| | | :model="safetyRiskAnalyseUnitForm" |
| | | :rules="safetyRiskAnalyseUnitFormRules" |
| | | ref="safetyRiskAnalyseUnitFormRef" |
| | | size="default" |
| | | label-width="180px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险分析对象编码" prop="riskCode"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="safetyRiskAnalyseUnitForm.riskCode" |
| | | placeholder="请输入安全风险分析对象编码" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险分析单元名称" prop="riskUnitName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="safetyRiskAnalyseUnitForm.riskUnitName" |
| | | placeholder="请输入安全风险分析单元名称" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="生产装置名称" prop="produceDeviceId"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="safetyRiskAnalyseUnitForm.produceDeviceId" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="item in allProduceDeviceData" |
| | | :key="item.id" |
| | | :label="item.produceDeviceName" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="责任部门" prop="liableDepId"> |
| | | <el-cascader |
| | | @change="achieveUserList" |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | style="width: 85%" |
| | | v-model="safetyRiskAnalyseUnitForm.liableDepId" |
| | | > |
| | | </el-cascader> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="责任人" prop="liablePersonId"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="safetyRiskAnalyseUnitForm.liablePersonId" |
| | | placeholder="请选择责任人" |
| | | clearable |
| | | filterable |
| | | > |
| | | <el-option v-for="item in userList" :key="item.uid" :label="item.realName" :value="item.uid"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isSafetyRiskAnalyseUnitDialog = !isSafetyRiskAnalyseUnitDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitSafetyRiskAnalyseUnitDialog" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isSafetyRiskAnalyseUnitDialog: Boolean; |
| | | safetyRiskAnalyseUnitForm: { |
| | | riskCode: string | null; |
| | | riskUnitName: string | null; |
| | | liablePersonId: number | null; |
| | | liableDepId: number | null; |
| | | produceDeviceId: number | null; |
| | | }; |
| | | title: string; |
| | | userList: []; |
| | | departmentList: []; |
| | | allProduceDeviceData: []; |
| | | safetyRiskAnalyseUnitFormRules: {}; |
| | | } |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit'; |
| | | import { ElMessage } from 'element-plus'; |
| | | import { userApi } from '/@/api/user'; |
| | | export default { |
| | | name: 'productionDeviceDialog', |
| | | setup(props: any, context: any) { |
| | | const safetyRiskAnalyseUnitFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | userList: [], |
| | | departmentList: [], |
| | | allProduceDeviceData: [], |
| | | isSafetyRiskAnalyseUnitDialog: false, |
| | | safetyRiskAnalyseUnitForm: { |
| | | riskCode: null, |
| | | riskUnitName: null, |
| | | liablePersonId: null, |
| | | liableDepId: null, |
| | | produceDeviceId: null |
| | | }, |
| | | safetyRiskAnalyseUnitFormRules: { |
| | | riskCode: [{ required: true, message: '请填写安全风险分析对象编码', trigger: 'blur' }], |
| | | riskUnitName: [{ required: true, message: '请填写安全风险分析单元名称', trigger: 'blur' }], |
| | | liableDepId: [{ required: true, message: '请选择责任部门', trigger: 'change' }], |
| | | liablePersonId: [{ required: true, message: '请选择责任人', trigger: 'change' }], |
| | | produceDeviceId: [{ required: true, message: '请选择生产装置', trigger: 'change' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openSafetyRiskAnalyseUnitDialog = (type: string, value: object, department: [], allProduceDeviceData: []) => { |
| | | // console.log(jsonBig.stringify(123124124124214123131)) |
| | | state.isSafetyRiskAnalyseUnitDialog = true; |
| | | state.allProduceDeviceData = JSON.parse(JSON.stringify(allProduceDeviceData)); |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | safetyRiskAnalyseUnitFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增风险分析单元'; |
| | | state.safetyRiskAnalyseUnitForm = { |
| | | riskCode: null, |
| | | riskUnitName: null, |
| | | liablePersonId: null, |
| | | liableDepId: null, |
| | | produceDeviceId: null |
| | | }; |
| | | } else { |
| | | state.title = '修改风险分析单元'; |
| | | state.safetyRiskAnalyseUnitForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitSafetyRiskAnalyseUnitDialog = async () => { |
| | | safetyRiskAnalyseUnitFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增风险分析单元') { |
| | | let res = await safetyRiskAnalyseUnitApi().addSafetyRiskAnalyseUnit(state.safetyRiskAnalyseUnitForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险分析单元新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskAnalyseUnitDialog = false; |
| | | context.emit('refreshSafetyRiskAnalyseUnit'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await safetyRiskAnalyseUnitApi().modSafetyRiskAnalyseUnit(state.safetyRiskAnalyseUnitForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险分析单元修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskAnalyseUnitDialog = false; |
| | | context.emit('refreshSafetyRiskAnalyseUnit'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | const achieveUserList = () => { |
| | | state.safetyRiskAnalyseUnitForm.liablePersonId = null; |
| | | state.userList = []; |
| | | getUserData(); |
| | | }; |
| | | |
| | | //获取用户列表 |
| | | const getUserData = async () => { |
| | | let res = await userApi().getUserLByDepartment(state.safetyRiskAnalyseUnitForm.liableDepId); |
| | | if (res.data.code === '200') { |
| | | state.userList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | achieveUserList, |
| | | safetyRiskAnalyseUnitFormRef, |
| | | submitSafetyRiskAnalyseUnitDialog, |
| | | openSafetyRiskAnalyseUnitDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>责任部门:</span> |
| | | <el-cascader |
| | | @change="achieveUserList" |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="责任部门" |
| | | clearable |
| | | filterable |
| | | class="input-box" |
| | | v-model="safetyRiskAnalyseUnitData.params.liableDepId" |
| | | > |
| | | </el-cascader> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>责任人:</span> |
| | | <el-select v-model="safetyRiskAnalyseUnitData.params.liablePersonId" clearable filterable class="input-box" placeholder="责任人"> |
| | | <el-option v-for="item in userList" :key="item.uid" :label="item.realName" :value="item.uid"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>单元名称:</span> |
| | | <el-input v-model="safetyRiskAnalyseUnitData.params.riskUnitName" clearable filterable class="input-box" placeholder="单元名称"> |
| | | </el-input> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增单元 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="safetyRiskAnalyseUnitData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskUnitName" label="安全风险分析单元名称" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskCode" label="安全风险分析对象编码" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="liableDep" label="责任部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="liablePerson" label="责任人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="page-position" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="safetyRiskAnalyseUnitData.params.pageIndex" |
| | | background |
| | | v-model:page-size="safetyRiskAnalyseUnitData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="safetyRiskAnalyseUnitData.total" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </el-card> |
| | | <safetyRiskAnalyseUnitDialog ref="safetyRiskAnalyseUnitDialogRef" @refreshSafetyRiskAnalyseUnit="initSafetyRiskAnalyseUnitData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import safetyRiskAnalyseUnitDialog from './components/safetyRiskAnalyseUnitDialog.vue'; |
| | | import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | import { userApi } from '/@/api/user'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | safetyRiskAnalyseUnitData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskUnitName: string | null; |
| | | liableDepId: number | null; |
| | | liablePersonId: number | null; |
| | | }; |
| | | }; |
| | | userList: Array<UserState>; |
| | | departmentList: Array<DepartmentState>; |
| | | allProduceDeviceData: Array<produceDeviceState>; |
| | | } |
| | | interface produceDeviceState {} |
| | | interface DepartmentState {} |
| | | interface UserState {} |
| | | |
| | | export default { |
| | | name: 'productionDevice', |
| | | components: { safetyRiskAnalyseUnitDialog }, |
| | | setup() { |
| | | const safetyRiskAnalyseUnitDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | safetyRiskAnalyseUnitData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskUnitName: null, |
| | | liableDepId: null, |
| | | liablePersonId: null |
| | | } |
| | | }, |
| | | userList: [], |
| | | departmentList: [], |
| | | allProduceDeviceData: [] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initSafetyRiskAnalyseUnitData = async () => { |
| | | let res = await safetyRiskAnalyseUnitApi().getSafetyRiskAnalyseUnitList(state.safetyRiskAnalyseUnitData.params); |
| | | if (res.data.code === '200') { |
| | | state.safetyRiskAnalyseUnitData.data = res.data.data; |
| | | state.safetyRiskAnalyseUnitData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const achieveUserList = () => { |
| | | state.safetyRiskAnalyseUnitData.params.liablePersonId = null; |
| | | state.userList = []; |
| | | getUserData(); |
| | | }; |
| | | |
| | | //获取生产装置列表 |
| | | const getAllProduceDeviceData = async () => { |
| | | let res = await productionDeviceApi().getAllProductionDeviceList(); |
| | | if (res.data.code === '200') { |
| | | state.allProduceDeviceData = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //获取部门列表 |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList(); |
| | | if (res.data.code === '200') { |
| | | state.departmentList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //获取用户列表 |
| | | const getUserData = async () => { |
| | | let res = await userApi().getUserLByDepartment(state.safetyRiskAnalyseUnitData.params.liableDepId); |
| | | if (res.data.code === '200') { |
| | | state.userList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | safetyRiskAnalyseUnitDialogRef.value.openSafetyRiskAnalyseUnitDialog(type, value, state.departmentList, state.allProduceDeviceData); |
| | | }; |
| | | |
| | | // 删除角色 |
| | | const onDelProductionDevice = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条安全风险分析单元:“${row.riskUnitName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await safetyRiskAnalyseUnitApi().deleteSafetyRiskAnalyseUnit({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initSafetyRiskAnalyseUnitData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initSafetyRiskAnalyseUnitData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.safetyRiskAnalyseUnitData.params.pageSize = val; |
| | | initSafetyRiskAnalyseUnitData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.safetyRiskAnalyseUnitData.params.pageIndex = val; |
| | | initSafetyRiskAnalyseUnitData(); |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initSafetyRiskAnalyseUnitData(); |
| | | getAllProduceDeviceData(); |
| | | getDepartmentData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | achieveUserList, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelProductionDevice, |
| | | onHandleCurrentChange, |
| | | safetyRiskAnalyseUnitDialog, |
| | | safetyRiskAnalyseUnitDialogRef, |
| | | initSafetyRiskAnalyseUnitData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>111</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>222</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isRiskControlMeasureDialog" width="600px"> |
| | | <el-form |
| | | :model="riskControlMeasureForm" |
| | | :rules="riskControlMeasureFormRules" |
| | | ref="riskControlMeasureFormRef" |
| | | size="default" |
| | | label-width="160px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险事件名称" prop="riskEventId"> |
| | | <el-select class="input-length" v-model="riskControlMeasureForm.riskEventId" placeholder="请选择风险事件" clearable> |
| | | <el-option |
| | | v-for="item in allSafetyRiskEventData" |
| | | :key="item.id" |
| | | :label="item.riskEventName" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险措施编码" prop="controlMeasureCode"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="riskControlMeasureForm.controlMeasureCode" |
| | | placeholder="请输入风险措施编码" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控方式" prop="controlType"> |
| | | <el-select class="input-length" v-model="riskControlMeasureForm.controlType" placeholder="请选择管控方式" clearable> |
| | | <el-option v-for="item in controlTypeList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控内容" prop="checkContent"> |
| | | <el-input |
| | | class="input-length" |
| | | type="textarea" |
| | | :rows="3" |
| | | v-model.trim="riskControlMeasureForm.checkContent" |
| | | placeholder="请输入管控内容" |
| | | clearable |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类1" prop="classify1"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model.trim="riskControlMeasureForm.classify1" |
| | | @change="changeClassifyTwoList" |
| | | placeholder="请选择管控方式" |
| | | clearable |
| | | > |
| | | <el-option v-for="item in classifyOneList" :key="item.id" :label="item.riskMeasureName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类2" prop="classify2"> |
| | | <el-select class="input-length" v-model="riskControlMeasureForm.classify2" placeholder="请选择管控方式" clearable> |
| | | <el-option v-for="item in classifyTwoList" :key="item.id" :label="item.riskMeasureName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类3" prop="classify3"> |
| | | <el-input class="input-length" v-model.trim="riskControlMeasureForm.classify3" placeholder="请选择管控方式" clearable> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="措施说明" prop="measureDesc"> |
| | | <el-input |
| | | class="input-length" |
| | | type="textarea" |
| | | :rows="3" |
| | | v-model.trim="riskControlMeasureForm.measureDesc" |
| | | placeholder="请输入措施说明" |
| | | clearable |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isRiskControlMeasureDialog = !isRiskControlMeasureDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitRiskControlMeasureDialog" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isRiskControlMeasureDialog: Boolean; |
| | | riskControlMeasureForm: { |
| | | riskEventId: number | null; |
| | | controlMeasureCode: string | null; |
| | | controlType: number | null; |
| | | checkContent: string | null; |
| | | classify1: number | null; |
| | | classify2: number | null; |
| | | classify3: string | null; |
| | | measureDesc: string | null; |
| | | }; |
| | | title: string; |
| | | controlTypeList: Array<controlTypeListType>; |
| | | classifyOneList: []; |
| | | classifyTwoList: Array<classifyTwoType>; |
| | | classifyTwoListAll: []; |
| | | allSafetyRiskEventData: []; |
| | | riskControlMeasureFormRules: {}; |
| | | } |
| | | interface classifyTwoType { |
| | | id: number; |
| | | riskMeasureName: string; |
| | | } |
| | | interface controlTypeListType {} |
| | | |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { riskControlMeasureApi } from '/@/api/doublePreventSystem/riskControlMeasure'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'riskControlMeasureDialog', |
| | | setup(props: any, context: any) { |
| | | const riskControlMeasureFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | controlTypeList: [ |
| | | { id: 1, name: '自动化监控' }, |
| | | { id: 2, name: '隐患排查' } |
| | | ], |
| | | classifyOneList: [], |
| | | classifyTwoList: [], |
| | | classifyTwoListAll: [], |
| | | allSafetyRiskEventData: [], |
| | | isRiskControlMeasureDialog: false, |
| | | riskControlMeasureForm: { |
| | | riskEventId: null, |
| | | controlMeasureCode: null, |
| | | controlType: null, |
| | | checkContent: null, |
| | | classify1: null, |
| | | classify2: null, |
| | | classify3: null, |
| | | measureDesc: null |
| | | }, |
| | | riskControlMeasureFormRules: { |
| | | riskCode: [{ required: true, message: '请填写安全风险分析对象编码', trigger: 'blur' }], |
| | | riskUnitName: [{ required: true, message: '请填写安全风险分析单元名称', trigger: 'blur' }], |
| | | liableDepId: [{ required: true, message: '请选择责任部门', trigger: 'change' }], |
| | | liablePersonId: [{ required: true, message: '请选择责任人', trigger: 'change' }], |
| | | produceDeviceId: [{ required: true, message: '请选择生产装置', trigger: 'change' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openSafetyRiskEventDialog = (type: string, value: object, allSafetyRiskEventData: [], classifyOneList: [], classifyTwoList: []) => { |
| | | state.isRiskControlMeasureDialog = true; |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(allSafetyRiskEventData)); |
| | | state.classifyOneList = JSON.parse(JSON.stringify(classifyOneList)); |
| | | state.classifyTwoListAll = JSON.parse(JSON.stringify(classifyTwoList)); |
| | | state.classifyTwoList = []; |
| | | setTimeout(() => { |
| | | riskControlMeasureFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增风险管控措施'; |
| | | state.riskControlMeasureForm = { |
| | | riskEventId: null, |
| | | controlMeasureCode: null, |
| | | controlType: null, |
| | | checkContent: null, |
| | | classify1: null, |
| | | classify2: null, |
| | | classify3: null, |
| | | measureDesc: null |
| | | }; |
| | | } else { |
| | | state.title = '修改风险管控措施'; |
| | | state.riskControlMeasureForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | const changeClassifyTwoList = () => { |
| | | state.riskControlMeasureForm.classify2 = null; |
| | | state.classifyTwoList = []; |
| | | state.classifyTwoList = state.classifyTwoListAll.filter((item: any) => item.parentId === state.riskControlMeasureForm.classify1); |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitRiskControlMeasureDialog = async () => { |
| | | riskControlMeasureFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增风险管控措施') { |
| | | let res = await riskControlMeasureApi().addRiskControlMeasure(state.riskControlMeasureForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险管控措施新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isRiskControlMeasureDialog = false; |
| | | context.emit('refreshRiskControlMeasure'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await riskControlMeasureApi().modRiskControlMeasure(state.riskControlMeasureForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险管控措施修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isRiskControlMeasureDialog = false; |
| | | context.emit('refreshRiskControlMeasure'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | riskControlMeasureFormRef, |
| | | changeClassifyTwoList, |
| | | submitRiskControlMeasureDialog, |
| | | openSafetyRiskEventDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>管控方式:</span> |
| | | <el-select class="input-box" v-model="riskControlMeasureData.params.controlType" placeholder="管控方式" clearable> |
| | | <el-option v-for="item in controlTypeList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>安全风险事件:</span> |
| | | <el-select class="input-box" v-model="riskControlMeasureData.params.riskEventId" placeholder="安全风险事件" clearable> |
| | | <el-option v-for="item in allSafetyRiskEventData" :key="item.id" :label="item.riskEventName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增措施 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="riskControlMeasureData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="riskEventName" label="安全风险事件名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="controlMeasureCode" label="风控措施编码" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="controlType" label="管控方式" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="checkContent" label="管控内容" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="classify1" label="管控措施分类1" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="classify2" label="管控措施分类2" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="classify3" label="管控措施分类3" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="measureDesc" label="措施说明" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <span>{{ dateFormat('YYYY-mm-dd HH:MM:SS', '2022-07-07T08:00:00') }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelRiskControlMeasure(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="riskControlMeasureData.params.pageIndex" |
| | | background |
| | | v-model:page-size="riskControlMeasureData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="riskControlMeasureData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <riskControlMeasureDialog ref="riskControlMeasureDialogRef" @refreshRiskControlMeasure="initRiskControlMeasureData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import riskControlMeasureDialog from './components/riskControlMeasureDialog.vue'; |
| | | import { riskControlMeasureApi } from '/@/api/doublePreventSystem/riskControlMeasure/index.ts'; |
| | | import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | riskControlMeasureData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | controlType: number | null; |
| | | riskEventId: number | null; |
| | | }; |
| | | }; |
| | | controlTypeList: Array<controlTypeType>; |
| | | classifyOneList: Array<classifyOneType>; |
| | | classifyTwoList: Array<classifyTwoType>; |
| | | allSafetyRiskEventData: Array<SafetyRiskEventDataState>; |
| | | } |
| | | interface controlTypeType {} |
| | | interface classifyOneType {} |
| | | interface classifyTwoType {} |
| | | interface SafetyRiskEventDataState {} |
| | | |
| | | export default { |
| | | name: 'riskControlMeasure', |
| | | components: { riskControlMeasureDialog }, |
| | | setup() { |
| | | const riskControlMeasureDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | riskControlMeasureData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | controlType: null, |
| | | riskEventId: null |
| | | } |
| | | }, |
| | | controlTypeList: [ |
| | | { id: 1, name: '自动化监控' }, |
| | | { id: 2, name: '隐患排查' } |
| | | ], |
| | | classifyOneList: [], |
| | | classifyTwoList: [], |
| | | allSafetyRiskEventData: [] |
| | | }); |
| | | |
| | | // 初始化表格数据 |
| | | const initRiskControlMeasureData = async () => { |
| | | let res = await riskControlMeasureApi().getRiskControlMeasureList(state.riskControlMeasureData.params); |
| | | if (res.data.code === '200') { |
| | | state.riskControlMeasureData.data = res.data.data; |
| | | state.riskControlMeasureData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const dateFormat = (fmt: any, date: any) => { |
| | | date = new Date(date); |
| | | fmt = |
| | | date.getFullYear() + |
| | | '-' + |
| | | (date.getMonth() + 1) + |
| | | '-' + |
| | | date.getDate() + |
| | | ' ' + |
| | | date.getHours().toString() + |
| | | ':' + |
| | | (date.getMinutes().toString() === '0' ? '00' : date.getMinutes().toString()) + |
| | | ':' + |
| | | (date.getSeconds().toString() === '0' ? '00' : date.getMinutes().toString()); |
| | | return fmt; |
| | | }; |
| | | |
| | | //获取安全风险事件 |
| | | const getAllSafetyRiskEvent = async () => { |
| | | let res = await safetyRiskEventApi().getAllSafetyRiskEventList(); |
| | | if (res.data.code === '200') { |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(res.data.data)); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //获取管控措施分类 |
| | | const getClassify = async () => { |
| | | let res = await riskControlMeasureApi().getClassifyData(); |
| | | if (res.data.code === '200') { |
| | | state.classifyOneList = res.data.data.filter((item: any) => item.parentId === null); |
| | | state.classifyTwoList = res.data.data.filter((item: any) => item.parentId !== null); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | riskControlMeasureDialogRef.value.openSafetyRiskEventDialog( |
| | | type, |
| | | value, |
| | | state.allSafetyRiskEventData, |
| | | state.classifyOneList, |
| | | state.classifyTwoList |
| | | ); |
| | | }; |
| | | |
| | | // 删除角色 |
| | | const onDelRiskControlMeasure = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条风险管控措施:“${row.produceDeviceName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await riskControlMeasureApi().deleteRiskControlMeasure({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initRiskControlMeasureData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initRiskControlMeasureData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.riskControlMeasureData.params.pageSize = val; |
| | | initRiskControlMeasureData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.riskControlMeasureData.params.pageIndex = val; |
| | | initRiskControlMeasureData(); |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initRiskControlMeasureData(); |
| | | getAllSafetyRiskEvent(); |
| | | getClassify(); |
| | | }); |
| | | |
| | | return { |
| | | dateFormat, |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelRiskControlMeasure, |
| | | onHandleCurrentChange, |
| | | riskControlMeasureDialog, |
| | | riskControlMeasureDialogRef, |
| | | initRiskControlMeasureData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isShowProductionDeviceDialog" width="600px"> |
| | | <el-form |
| | | :model="productionDeviceForm" |
| | | :rules="productionDeviceFormRules" |
| | | ref="productionDeviceFormRef" |
| | | size="default" |
| | | label-width="120px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="生产装置名称" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="productionDeviceForm.produceDeviceName" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="所属部门" prop="depId"> |
| | | <el-cascader |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | style="width: 85%" |
| | | v-model="productionDeviceForm.depId" |
| | | > |
| | | </el-cascader> |
| | | <!-- <el-select class="input-length" v-model="productionDeviceForm.depName" placeholder="请选择所属部门" clearable filterable></el-select>--> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险等级" prop="riskLevel"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="productionDeviceForm.riskLevel" |
| | | placeholder="请选择风险等级" |
| | | clearable |
| | | filterable |
| | | > |
| | | <el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="区域位置" prop="location"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="productionDeviceForm.location" |
| | | type="textarea" |
| | | placeholder="请输入区域位置" |
| | | maxlength="150" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowProductionDeviceDialog = !isShowProductionDeviceDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitProductionDevice" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isShowProductionDeviceDialog: Boolean; |
| | | productionDeviceForm: { |
| | | produceDeviceName: string; |
| | | depId: number | null; |
| | | riskLevel: number | null; |
| | | location: string; |
| | | }; |
| | | title: string; |
| | | departmentList: []; |
| | | levelList: Array<levelListState>; |
| | | productionDeviceFormRules: {}; |
| | | } |
| | | interface levelListState {} |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'productionDeviceDialog', |
| | | setup(props: any, context: any) { |
| | | const productionDeviceFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | departmentList: [], |
| | | isShowProductionDeviceDialog: false, |
| | | levelList: [ |
| | | { id: 1, name: '低风险' }, |
| | | { id: 2, name: '一般风险' }, |
| | | { id: 3, name: '较大风险' }, |
| | | { id: 4, name: '重大风险' } |
| | | ], |
| | | productionDeviceForm: { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }, |
| | | productionDeviceFormRules: { |
| | | produceDeviceName: [{ required: true, message: '请填写生产装置名称', trigger: 'blur' }], |
| | | depId: [{ required: true, message: '请选择部门', trigger: 'change' }], |
| | | riskLevel: [{ required: true, message: '请选择风险等级', trigger: 'change' }], |
| | | location: [{ required: true, message: '请填写区域位置', trigger: 'blur' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openProductionDeviceDialog = (type: string, value: object, department: []) => { |
| | | state.isShowProductionDeviceDialog = true; |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | productionDeviceFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增生产装置'; |
| | | state.productionDeviceForm = { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }; |
| | | } else { |
| | | state.title = '修改生产装置'; |
| | | state.productionDeviceForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitProductionDevice = async () => { |
| | | productionDeviceFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增生产装置') { |
| | | let res = await productionDeviceApi().addProductionDevice(state.productionDeviceForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowProductionDeviceDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await productionDeviceApi().modProductionDevice(state.productionDeviceForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowProductionDeviceDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | productionDeviceFormRef, |
| | | submitProductionDevice, |
| | | openProductionDeviceDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>风险等级:</span> |
| | | <el-select v-model="productionDeviceData.params.riskLevel" clearable filterable class="input-box" placeholder="请选择风险等级"> |
| | | <el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>部门:</span> |
| | | <el-cascader |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'id', label: 'name' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | class="input-box" |
| | | v-model="productionDeviceData.params.depId" |
| | | > |
| | | </el-cascader> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增装置 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="productionDeviceData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="depName" label="所属部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskLevel" label="风险等级" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="location" label="区域位置" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="状态" show-overflow-tooltip> </el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="productionDeviceData.params.pageIndex" |
| | | background |
| | | v-model:page-size="productionDeviceData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="productionDeviceData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <productionDeviceDialog ref="productionDeviceDialogRef" @refreshProductionDevice="initProductionDeviceTableData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import productionDeviceDialog from './components/productionDeviceDialog.vue'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | productionDeviceData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskLevel: number | null; |
| | | status: number; |
| | | depId: number | null; |
| | | location: string | null; |
| | | produceDeviceName: string | null; |
| | | }; |
| | | }; |
| | | departmentList: Array<DepartmentState>; |
| | | levelList: Array<levelListState>; |
| | | } |
| | | interface levelListState {} |
| | | interface DepartmentState {} |
| | | |
| | | export default defineComponent({ |
| | | name: 'productionDevice', |
| | | components: { productionDeviceDialog }, |
| | | setup() { |
| | | const productionDeviceDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | productionDeviceData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskLevel: null, |
| | | status: 1, |
| | | depId: null, |
| | | location: null, |
| | | produceDeviceName: null |
| | | } |
| | | }, |
| | | departmentList: [], |
| | | levelList: [ |
| | | { id: 1, name: '低风险' }, |
| | | { id: 2, name: '一般风险' }, |
| | | { id: 3, name: '较大风险' }, |
| | | { id: 4, name: '重大风险' } |
| | | ] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initProductionDeviceTableData = async () => { |
| | | let res = await productionDeviceApi().getProductionDeviceList(state.productionDeviceData.params); |
| | | if (res.data.code === '200') { |
| | | state.productionDeviceData.data = res.data.data; |
| | | state.productionDeviceData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList(); |
| | | if (res.data.code === '200') { |
| | | state.departmentList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | productionDeviceDialogRef.value.openProductionDeviceDialog(type, value, state.departmentList); |
| | | }; |
| | | // 删除角色 |
| | | const onDelProductionDevice = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条生产装置:“${row.produceDeviceName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await productionDeviceApi().deleteProductionDevice({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initProductionDeviceTableData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | const handleSearch = () => { |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.productionDeviceData.params.pageSize = val; |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.productionDeviceData.params.pageIndex = val; |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initProductionDeviceTableData(); |
| | | getDepartmentData(); |
| | | }); |
| | | return { |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelProductionDevice, |
| | | onHandleCurrentChange, |
| | | productionDeviceDialog, |
| | | productionDeviceDialogRef, |
| | | initProductionDeviceTableData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isSafetyRiskEventDialog" width="600px"> |
| | | <el-form |
| | | :model="safetyRiskEventForm" |
| | | :rules="safetyRiskEventFormRules" |
| | | ref="safetyRiskAnalyseUnitFormRef" |
| | | size="default" |
| | | label-width="180px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险分析单元名称" prop="riskUnitId"> |
| | | <el-select class="input-length" v-model="safetyRiskEventForm.riskUnitId" placeholder="请输入安全风险分析单元名称"> |
| | | <el-option |
| | | v-for="item in allSafetyRiskEventData" |
| | | :key="item.id" |
| | | :label="item.riskUnitName" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险事件名称" prop="riskEventName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="safetyRiskEventForm.riskEventName" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isSafetyRiskEventDialog = !isSafetyRiskEventDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitSafetyRiskEventDialog" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isSafetyRiskEventDialog: Boolean; |
| | | safetyRiskEventForm: { |
| | | riskEventName: string | null; |
| | | riskUnitId: number | null; |
| | | }; |
| | | title: string; |
| | | departmentList: []; |
| | | allSafetyRiskEventData: []; |
| | | safetyRiskEventFormRules: {}; |
| | | } |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'productionDeviceDialog', |
| | | setup(props: any, context: any) { |
| | | const safetyRiskAnalyseUnitFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | departmentList: [], |
| | | allSafetyRiskEventData: [], |
| | | isSafetyRiskEventDialog: false, |
| | | safetyRiskEventForm: { |
| | | riskEventName: null, |
| | | riskUnitId: null |
| | | }, |
| | | safetyRiskEventFormRules: { |
| | | riskEventName: [{ required: true, message: '请填写安全风险分析对象编码', trigger: 'blur' }], |
| | | riskUnitId: [{ required: true, message: '请填写安全风险分析单元名称', trigger: 'blur' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openSafetyRiskEventDialog = (type: string, value: object, department: [], allSafetyRiskEventData: []) => { |
| | | state.isSafetyRiskEventDialog = true; |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(allSafetyRiskEventData)); |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | safetyRiskAnalyseUnitFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增风险事件'; |
| | | state.safetyRiskEventForm = { |
| | | riskEventName: null, |
| | | riskUnitId: null |
| | | }; |
| | | } else { |
| | | state.title = '修改风险事件'; |
| | | state.safetyRiskEventForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitSafetyRiskEventDialog = async () => { |
| | | safetyRiskAnalyseUnitFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增风险事件') { |
| | | let res = await safetyRiskEventApi().addSafetyRiskEvent(state.safetyRiskEventForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险事件新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskEventDialog = false; |
| | | context.emit('refreshSafetyRiskEvent'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await safetyRiskEventApi().modSafetyRiskEvent(state.safetyRiskEventForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险事件修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskEventDialog = false; |
| | | context.emit('refreshSafetyRiskEvent'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | safetyRiskAnalyseUnitFormRef, |
| | | submitSafetyRiskEventDialog, |
| | | openSafetyRiskEventDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>安全风险单元名称:</span> |
| | | <el-select v-model="safetyRiskEventData.params.riskUnitId" class="input-box" placeholder="安全风险单元名称"> |
| | | <el-option v-for="item in allSafetyRiskEventData" :key="item.id" :label="item.riskUnitName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>安全风险事件名称:</span> |
| | | <el-input v-model="safetyRiskEventData.params.riskEventName" class="input-box" placeholder="安全风险事件名称"> </el-input> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon><ele-Search /> </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增事件 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="safetyRiskEventData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="riskUnitName" label="安全风险分析单元名称" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskEventName" label="安全风险事件名称" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelSafetyRiskEvent(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="safetyRiskEventData.params.pageIndex" |
| | | background |
| | | v-model:page-size="safetyRiskEventData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="safetyRiskEventData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <safetyRiskEventDialog ref="safetyRiskEventDialogRef" @refreshSafetyRiskEvent="initSafetyRiskEventData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import safetyRiskEventDialog from './components/safetyRiskEventDialog.vue'; |
| | | import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | safetyRiskEventData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskEventName: string | null; |
| | | }; |
| | | }; |
| | | allSafetyRiskEventData: Array<safetyRiskEventState>; |
| | | } |
| | | interface safetyRiskEventState {} |
| | | |
| | | export default { |
| | | name: 'productionDevice', |
| | | components: { safetyRiskEventDialog }, |
| | | setup() { |
| | | const safetyRiskEventDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | safetyRiskEventData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskEventName: null |
| | | } |
| | | }, |
| | | allSafetyRiskEventData: [] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initSafetyRiskEventData = async () => { |
| | | let res = await safetyRiskEventApi().getSafetyRiskEventList(state.safetyRiskEventData.params); |
| | | if (res.data.code === '200') { |
| | | state.safetyRiskEventData.data = res.data.data; |
| | | state.safetyRiskEventData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 获取安全风险分析单元数据 |
| | | const getAllSafetyRiskEventData = async () => { |
| | | let res = await safetyRiskAnalyseUnitApi().getAllSafetyRiskAnalyseUnitList(); |
| | | if (res.data.code === '200') { |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(res.data.data)); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开安全风险事件 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | safetyRiskEventDialogRef.value.openSafetyRiskEventDialog(type, value, state.allSafetyRiskEventData); |
| | | }; |
| | | |
| | | // 删除角色 |
| | | const onDelSafetyRiskEvent = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条安全风险事件:“${row.riskEventName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await safetyRiskEventApi().deleteSafetyRiskEvent({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initSafetyRiskEventData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initSafetyRiskEventData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.safetyRiskEventData.params.pageSize = val; |
| | | initSafetyRiskEventData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.safetyRiskEventData.params.pageIndex = val; |
| | | initSafetyRiskEventData(); |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | getAllSafetyRiskEventData(); |
| | | initSafetyRiskEventData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelSafetyRiskEvent, |
| | | onHandleCurrentChange, |
| | | safetyRiskEventDialog, |
| | | safetyRiskEventDialogRef, |
| | | initSafetyRiskEventData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isSafetyRiskAnalyseUnitDialog" width="600px"> |
| | | <el-form |
| | | :model="safetyRiskAnalyseUnitForm" |
| | | :rules="safetyRiskAnalyseUnitFormRules" |
| | | ref="safetyRiskAnalyseUnitFormRef" |
| | | size="default" |
| | | label-width="180px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险分析对象编码" prop="riskCode"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="safetyRiskAnalyseUnitForm.riskCode" |
| | | placeholder="请输入安全风险分析对象编码" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险分析单元名称" prop="riskUnitName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="safetyRiskAnalyseUnitForm.riskUnitName" |
| | | placeholder="请输入安全风险分析单元名称" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="生产装置名称" prop="produceDeviceId"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="safetyRiskAnalyseUnitForm.produceDeviceId" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="item in allProduceDeviceData" |
| | | :key="item.id" |
| | | :label="item.produceDeviceName" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="责任部门" prop="liableDepId"> |
| | | <el-cascader |
| | | @change="achieveUserList" |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | style="width: 85%" |
| | | v-model="safetyRiskAnalyseUnitForm.liableDepId" |
| | | > |
| | | </el-cascader> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="责任人" prop="liablePersonId"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="safetyRiskAnalyseUnitForm.liablePersonId" |
| | | placeholder="请选择责任人" |
| | | clearable |
| | | filterable |
| | | > |
| | | <el-option v-for="item in userList" :key="item.uid" :label="item.realName" :value="item.uid"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isSafetyRiskAnalyseUnitDialog = !isSafetyRiskAnalyseUnitDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitSafetyRiskAnalyseUnitDialog" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isSafetyRiskAnalyseUnitDialog: Boolean; |
| | | safetyRiskAnalyseUnitForm: { |
| | | riskCode: string | null; |
| | | riskUnitName: string | null; |
| | | liablePersonId: number | null; |
| | | liableDepId: number | null; |
| | | produceDeviceId: number | null; |
| | | }; |
| | | title: string; |
| | | userList: []; |
| | | departmentList: []; |
| | | allProduceDeviceData: []; |
| | | safetyRiskAnalyseUnitFormRules: {}; |
| | | } |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit'; |
| | | import { ElMessage } from 'element-plus'; |
| | | import { userApi } from '/@/api/user'; |
| | | export default { |
| | | name: 'productionDeviceDialog', |
| | | setup(props: any, context: any) { |
| | | const safetyRiskAnalyseUnitFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | userList: [], |
| | | departmentList: [], |
| | | allProduceDeviceData: [], |
| | | isSafetyRiskAnalyseUnitDialog: false, |
| | | safetyRiskAnalyseUnitForm: { |
| | | riskCode: null, |
| | | riskUnitName: null, |
| | | liablePersonId: null, |
| | | liableDepId: null, |
| | | produceDeviceId: null |
| | | }, |
| | | safetyRiskAnalyseUnitFormRules: { |
| | | riskCode: [{ required: true, message: '请填写安全风险分析对象编码', trigger: 'blur' }], |
| | | riskUnitName: [{ required: true, message: '请填写安全风险分析单元名称', trigger: 'blur' }], |
| | | liableDepId: [{ required: true, message: '请选择责任部门', trigger: 'change' }], |
| | | liablePersonId: [{ required: true, message: '请选择责任人', trigger: 'change' }], |
| | | produceDeviceId: [{ required: true, message: '请选择生产装置', trigger: 'change' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openSafetyRiskAnalyseUnitDialog = (type: string, value: object, department: [], allProduceDeviceData: []) => { |
| | | // console.log(jsonBig.stringify(123124124124214123131)) |
| | | state.isSafetyRiskAnalyseUnitDialog = true; |
| | | state.allProduceDeviceData = JSON.parse(JSON.stringify(allProduceDeviceData)); |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | safetyRiskAnalyseUnitFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增风险分析单元'; |
| | | state.safetyRiskAnalyseUnitForm = { |
| | | riskCode: null, |
| | | riskUnitName: null, |
| | | liablePersonId: null, |
| | | liableDepId: null, |
| | | produceDeviceId: null |
| | | }; |
| | | } else { |
| | | state.title = '修改风险分析单元'; |
| | | state.safetyRiskAnalyseUnitForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitSafetyRiskAnalyseUnitDialog = async () => { |
| | | safetyRiskAnalyseUnitFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增风险分析单元') { |
| | | let res = await safetyRiskAnalyseUnitApi().addSafetyRiskAnalyseUnit(state.safetyRiskAnalyseUnitForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险分析单元新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskAnalyseUnitDialog = false; |
| | | context.emit('refreshSafetyRiskAnalyseUnit'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await safetyRiskAnalyseUnitApi().modSafetyRiskAnalyseUnit(state.safetyRiskAnalyseUnitForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险分析单元修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskAnalyseUnitDialog = false; |
| | | context.emit('refreshSafetyRiskAnalyseUnit'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | const achieveUserList = () => { |
| | | state.safetyRiskAnalyseUnitForm.liablePersonId = null; |
| | | state.userList = []; |
| | | getUserData(); |
| | | }; |
| | | |
| | | //获取用户列表 |
| | | const getUserData = async () => { |
| | | let res = await userApi().getUserLByDepartment(state.safetyRiskAnalyseUnitForm.liableDepId); |
| | | if (res.data.code === '200') { |
| | | state.userList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | achieveUserList, |
| | | safetyRiskAnalyseUnitFormRef, |
| | | submitSafetyRiskAnalyseUnitDialog, |
| | | openSafetyRiskAnalyseUnitDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>责任部门:</span> |
| | | <el-cascader |
| | | @change="achieveUserList" |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'id', label: 'name' }" |
| | | placeholder="责任部门" |
| | | clearable |
| | | filterable |
| | | class="input-box" |
| | | v-model="safetyRiskAnalyseUnitData.params.liableDepId" |
| | | > |
| | | </el-cascader> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>责任人:</span> |
| | | <el-select v-model="safetyRiskAnalyseUnitData.params.liablePersonId" clearable filterable class="input-box" placeholder="责任人"> |
| | | <el-option v-for="item in userList" :key="item.uid" :label="item.realName" :value="item.uid"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>单元名称:</span> |
| | | <el-input v-model="safetyRiskAnalyseUnitData.params.riskUnitName" clearable filterable class="input-box" placeholder="单元名称"> |
| | | </el-input> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增单元 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="safetyRiskAnalyseUnitData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskUnitName" label="安全风险分析单元名称" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskCode" label="安全风险分析对象编码" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="liableDep" label="责任部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="liablePerson" label="责任人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="safetyRiskAnalyseUnitData.params.pageIndex" |
| | | background |
| | | v-model:page-size="safetyRiskAnalyseUnitData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="safetyRiskAnalyseUnitData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <safetyRiskAnalyseUnitDialog ref="safetyRiskAnalyseUnitDialogRef" @refreshSafetyRiskAnalyseUnit="initSafetyRiskAnalyseUnitData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import safetyRiskAnalyseUnitDialog from './components/safetyRiskAnalyseUnitDialog.vue'; |
| | | import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | import { userApi } from '/@/api/user'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | safetyRiskAnalyseUnitData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskUnitName: string | null; |
| | | liableDepId: number | null; |
| | | liablePersonId: number | null; |
| | | }; |
| | | }; |
| | | userList: Array<UserState>; |
| | | departmentList: Array<DepartmentState>; |
| | | allProduceDeviceData: Array<produceDeviceState>; |
| | | } |
| | | interface produceDeviceState {} |
| | | interface DepartmentState {} |
| | | interface UserState {} |
| | | |
| | | export default { |
| | | name: 'productionDevice', |
| | | components: { safetyRiskAnalyseUnitDialog }, |
| | | setup() { |
| | | const safetyRiskAnalyseUnitDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | safetyRiskAnalyseUnitData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskUnitName: null, |
| | | liableDepId: null, |
| | | liablePersonId: null |
| | | } |
| | | }, |
| | | userList: [], |
| | | departmentList: [], |
| | | allProduceDeviceData: [] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initSafetyRiskAnalyseUnitData = async () => { |
| | | let res = await safetyRiskAnalyseUnitApi().getSafetyRiskAnalyseUnitList(state.safetyRiskAnalyseUnitData.params); |
| | | if (res.data.code === '200') { |
| | | state.safetyRiskAnalyseUnitData.data = res.data.data; |
| | | state.safetyRiskAnalyseUnitData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const achieveUserList = () => { |
| | | state.safetyRiskAnalyseUnitData.params.liablePersonId = null; |
| | | state.userList = []; |
| | | getUserData(); |
| | | }; |
| | | |
| | | //获取生产装置列表 |
| | | const getAllProduceDeviceData = async () => { |
| | | let res = await productionDeviceApi().getAllProductionDeviceList(); |
| | | if (res.data.code === '200') { |
| | | state.allProduceDeviceData = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //获取部门列表 |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList(); |
| | | if (res.data.code === '200') { |
| | | state.departmentList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //获取用户列表 |
| | | const getUserData = async () => { |
| | | let res = await userApi().getUserLByDepartment(state.safetyRiskAnalyseUnitData.params.liableDepId); |
| | | if (res.data.code === '200') { |
| | | state.userList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | safetyRiskAnalyseUnitDialogRef.value.openSafetyRiskAnalyseUnitDialog(type, value, state.departmentList, state.allProduceDeviceData); |
| | | }; |
| | | |
| | | // 删除角色 |
| | | const onDelProductionDevice = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条安全风险分析单元:“${row.riskUnitName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await safetyRiskAnalyseUnitApi().deleteSafetyRiskAnalyseUnit({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initSafetyRiskAnalyseUnitData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initSafetyRiskAnalyseUnitData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.safetyRiskAnalyseUnitData.params.pageSize = val; |
| | | initSafetyRiskAnalyseUnitData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.safetyRiskAnalyseUnitData.params.pageIndex = val; |
| | | initSafetyRiskAnalyseUnitData(); |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initSafetyRiskAnalyseUnitData(); |
| | | getAllProduceDeviceData(); |
| | | getDepartmentData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | achieveUserList, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelProductionDevice, |
| | | onHandleCurrentChange, |
| | | safetyRiskAnalyseUnitDialog, |
| | | safetyRiskAnalyseUnitDialogRef, |
| | | initSafetyRiskAnalyseUnitData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
| | |
| | | <el-form-item label="生产装置名称" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model="productionDeviceForm.produceDeviceName" |
| | | v-model.trim="productionDeviceForm.produceDeviceName" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | ></el-input> |
| | |
| | | <el-form-item label="区域位置" prop="location"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model="productionDeviceForm.location" |
| | | v-model.trim="productionDeviceForm.location" |
| | | type="textarea" |
| | | placeholder="请输入区域位置" |
| | | maxlength="150" |
| | |
| | | <el-form-item label="风险措施编码" prop="controlMeasureCode"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model="riskControlMeasureForm.controlMeasureCode" |
| | | v-model.trim="riskControlMeasureForm.controlMeasureCode" |
| | | placeholder="请输入风险措施编码" |
| | | ></el-input> |
| | | </el-form-item> |
| | |
| | | class="input-length" |
| | | type="textarea" |
| | | :rows="3" |
| | | v-model="riskControlMeasureForm.checkContent" |
| | | v-model.trim="riskControlMeasureForm.checkContent" |
| | | placeholder="请输入管控内容" |
| | | clearable |
| | | > |
| | |
| | | <el-form-item label="管控措施分类1" prop="classify1"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="riskControlMeasureForm.classify1" |
| | | v-model.trim="riskControlMeasureForm.classify1" |
| | | @change="changeClassifyTwoList" |
| | | placeholder="请选择管控方式" |
| | | clearable |
| | |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类3" prop="classify3"> |
| | | <el-input class="input-length" v-model="riskControlMeasureForm.classify3" placeholder="请选择管控方式" clearable> |
| | | <el-input class="input-length" v-model.trim="riskControlMeasureForm.classify3" placeholder="请选择管控方式" clearable> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | class="input-length" |
| | | type="textarea" |
| | | :rows="3" |
| | | v-model="riskControlMeasureForm.measureDesc" |
| | | v-model.trim="riskControlMeasureForm.measureDesc" |
| | | placeholder="请输入措施说明" |
| | | clearable |
| | | > |
| | |
| | | <el-form-item label="安全风险分析对象编码" prop="riskCode"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model="safetyRiskAnalyseUnitForm.riskCode" |
| | | v-model.trim="safetyRiskAnalyseUnitForm.riskCode" |
| | | placeholder="请输入安全风险分析对象编码" |
| | | ></el-input> |
| | | </el-form-item> |
| | |
| | | <el-form-item label="安全风险分析单元名称" prop="riskUnitName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model="safetyRiskAnalyseUnitForm.riskUnitName" |
| | | v-model.trim="safetyRiskAnalyseUnitForm.riskUnitName" |
| | | placeholder="请输入安全风险分析单元名称" |
| | | ></el-input> |
| | | </el-form-item> |
| | |
| | | <el-form-item label="安全风险事件名称" prop="riskEventName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model="safetyRiskEventForm.riskEventName" |
| | | v-model.trim="safetyRiskEventForm.riskEventName" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | ></el-input> |
| | |
| | | <el-input v-model="safetyRiskEventData.params.riskEventName" class="input-box" placeholder="安全风险事件名称"> </el-input> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | <el-icon><ele-Search /> </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
对比新文件 |
| | |
| | | <template></template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>222</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>111</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>333</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>444</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isRiskControlMeasureDialog" width="600px"> |
| | | <el-form |
| | | :model="riskControlMeasureForm" |
| | | :rules="riskControlMeasureFormRules" |
| | | ref="riskControlMeasureFormRef" |
| | | size="default" |
| | | label-width="160px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险事件名称" prop="riskEventId"> |
| | | <el-select class="input-length" v-model="riskControlMeasureForm.riskEventId" placeholder="请选择风险事件" clearable> |
| | | <el-option |
| | | v-for="item in allSafetyRiskEventData" |
| | | :key="item.id" |
| | | :label="item.riskEventName" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险措施编码" prop="controlMeasureCode"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="riskControlMeasureForm.controlMeasureCode" |
| | | placeholder="请输入风险措施编码" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控方式" prop="controlType"> |
| | | <el-select class="input-length" v-model="riskControlMeasureForm.controlType" placeholder="请选择管控方式" clearable> |
| | | <el-option v-for="item in controlTypeList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控内容" prop="checkContent"> |
| | | <el-input |
| | | class="input-length" |
| | | type="textarea" |
| | | :rows="3" |
| | | v-model.trim="riskControlMeasureForm.checkContent" |
| | | placeholder="请输入管控内容" |
| | | clearable |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类1" prop="classify1"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model.trim="riskControlMeasureForm.classify1" |
| | | @change="changeClassifyTwoList" |
| | | placeholder="请选择管控方式" |
| | | clearable |
| | | > |
| | | <el-option v-for="item in classifyOneList" :key="item.id" :label="item.riskMeasureName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类2" prop="classify2"> |
| | | <el-select class="input-length" v-model="riskControlMeasureForm.classify2" placeholder="请选择管控方式" clearable> |
| | | <el-option v-for="item in classifyTwoList" :key="item.id" :label="item.riskMeasureName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="管控措施分类3" prop="classify3"> |
| | | <el-input class="input-length" v-model.trim="riskControlMeasureForm.classify3" placeholder="请选择管控方式" clearable> |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="措施说明" prop="measureDesc"> |
| | | <el-input |
| | | class="input-length" |
| | | type="textarea" |
| | | :rows="3" |
| | | v-model.trim="riskControlMeasureForm.measureDesc" |
| | | placeholder="请输入措施说明" |
| | | clearable |
| | | > |
| | | </el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isRiskControlMeasureDialog = !isRiskControlMeasureDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitRiskControlMeasureDialog" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isRiskControlMeasureDialog: Boolean; |
| | | riskControlMeasureForm: { |
| | | riskEventId: number | null; |
| | | controlMeasureCode: string | null; |
| | | controlType: number | null; |
| | | checkContent: string | null; |
| | | classify1: number | null; |
| | | classify2: number | null; |
| | | classify3: string | null; |
| | | measureDesc: string | null; |
| | | }; |
| | | title: string; |
| | | controlTypeList: Array<controlTypeListType>; |
| | | classifyOneList: []; |
| | | classifyTwoList: Array<classifyTwoType>; |
| | | classifyTwoListAll: []; |
| | | allSafetyRiskEventData: []; |
| | | riskControlMeasureFormRules: {}; |
| | | } |
| | | interface classifyTwoType { |
| | | id: number; |
| | | riskMeasureName: string; |
| | | } |
| | | interface controlTypeListType {} |
| | | |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { riskControlMeasureApi } from '/@/api/doublePreventSystem/riskControlMeasure'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'riskControlMeasureDialog', |
| | | setup(props: any, context: any) { |
| | | const riskControlMeasureFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | controlTypeList: [ |
| | | { id: 1, name: '自动化监控' }, |
| | | { id: 2, name: '隐患排查' } |
| | | ], |
| | | classifyOneList: [], |
| | | classifyTwoList: [], |
| | | classifyTwoListAll: [], |
| | | allSafetyRiskEventData: [], |
| | | isRiskControlMeasureDialog: false, |
| | | riskControlMeasureForm: { |
| | | riskEventId: null, |
| | | controlMeasureCode: null, |
| | | controlType: null, |
| | | checkContent: null, |
| | | classify1: null, |
| | | classify2: null, |
| | | classify3: null, |
| | | measureDesc: null |
| | | }, |
| | | riskControlMeasureFormRules: { |
| | | riskCode: [{ required: true, message: '请填写安全风险分析对象编码', trigger: 'blur' }], |
| | | riskUnitName: [{ required: true, message: '请填写安全风险分析单元名称', trigger: 'blur' }], |
| | | liableDepId: [{ required: true, message: '请选择责任部门', trigger: 'change' }], |
| | | liablePersonId: [{ required: true, message: '请选择责任人', trigger: 'change' }], |
| | | produceDeviceId: [{ required: true, message: '请选择生产装置', trigger: 'change' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openSafetyRiskEventDialog = (type: string, value: object, allSafetyRiskEventData: [], classifyOneList: [], classifyTwoList: []) => { |
| | | state.isRiskControlMeasureDialog = true; |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(allSafetyRiskEventData)); |
| | | state.classifyOneList = JSON.parse(JSON.stringify(classifyOneList)); |
| | | state.classifyTwoListAll = JSON.parse(JSON.stringify(classifyTwoList)); |
| | | state.classifyTwoList = []; |
| | | setTimeout(() => { |
| | | riskControlMeasureFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增风险管控措施'; |
| | | state.riskControlMeasureForm = { |
| | | riskEventId: null, |
| | | controlMeasureCode: null, |
| | | controlType: null, |
| | | checkContent: null, |
| | | classify1: null, |
| | | classify2: null, |
| | | classify3: null, |
| | | measureDesc: null |
| | | }; |
| | | } else { |
| | | state.title = '修改风险管控措施'; |
| | | state.riskControlMeasureForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | const changeClassifyTwoList = () => { |
| | | state.riskControlMeasureForm.classify2 = null; |
| | | state.classifyTwoList = []; |
| | | state.classifyTwoList = state.classifyTwoListAll.filter((item: any) => item.parentId === state.riskControlMeasureForm.classify1); |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitRiskControlMeasureDialog = async () => { |
| | | riskControlMeasureFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增风险管控措施') { |
| | | let res = await riskControlMeasureApi().addRiskControlMeasure(state.riskControlMeasureForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险管控措施新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isRiskControlMeasureDialog = false; |
| | | context.emit('refreshRiskControlMeasure'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await riskControlMeasureApi().modRiskControlMeasure(state.riskControlMeasureForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险管控措施修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isRiskControlMeasureDialog = false; |
| | | context.emit('refreshRiskControlMeasure'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | riskControlMeasureFormRef, |
| | | changeClassifyTwoList, |
| | | submitRiskControlMeasureDialog, |
| | | openSafetyRiskEventDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | 111 |
| | | <!-- <el-card shadow="hover">--> |
| | | <!-- <div class="system-user-search mb15">--> |
| | | <!-- <div class="basic-line">--> |
| | | <!-- <span>管控方式:</span>--> |
| | | <!-- <el-select class="input-box" v-model="riskControlMeasureData.params.controlType" placeholder="管控方式" clearable>--> |
| | | <!-- <el-option v-for="item in controlTypeList" :key="item.id" :label="item.name" :value="item.id"></el-option>--> |
| | | <!-- </el-select>--> |
| | | <!-- </div>--> |
| | | <!-- <div class="basic-line">--> |
| | | <!-- <span>安全风险事件:</span>--> |
| | | <!-- <el-select class="input-box" v-model="riskControlMeasureData.params.riskEventId" placeholder="安全风险事件" clearable>--> |
| | | <!-- <el-option v-for="item in allSafetyRiskEventData" :key="item.id" :label="item.riskEventName" :value="item.id"></el-option>--> |
| | | <!-- </el-select>--> |
| | | <!-- </div>--> |
| | | <!-- <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch">--> |
| | | <!-- <el-icon>--> |
| | | <!-- <ele-Search />--> |
| | | <!-- </el-icon>--> |
| | | <!-- 查询--> |
| | | <!-- </el-button>--> |
| | | <!-- <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')">--> |
| | | <!-- <el-icon>--> |
| | | <!-- <ele-FolderAdd />--> |
| | | <!-- </el-icon>--> |
| | | <!-- 新增措施--> |
| | | <!-- </el-button>--> |
| | | <!-- </div>--> |
| | | <!-- <el-table :data="riskControlMeasureData.data" style="width: 100%">--> |
| | | <!-- <el-table-column type="index" label="序号" width="60" />--> |
| | | <!-- <el-table-column prop="riskEventName" label="安全风险事件名称" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="controlMeasureCode" label="风控措施编码" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="controlType" label="管控方式" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="checkContent" label="管控内容" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="classify1" label="管控措施分类1" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="classify2" label="管控措施分类2" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="classify3" label="管控措施分类3" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="measureDesc" label="措施说明" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip>--> |
| | | <!-- <template #default="scope">--> |
| | | <!-- <span>{{ dateFormat('YYYY-mm-dd HH:MM:SS', '2022-07-07T08:00:00') }}</span>--> |
| | | <!-- </template>--> |
| | | <!-- </el-table-column>--> |
| | | <!-- <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column>--> |
| | | <!-- <el-table-column label="操作" width="150">--> |
| | | <!-- <template #default="scope">--> |
| | | <!-- <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button>--> |
| | | <!-- <el-button size="small" text type="danger" @click="onDelRiskControlMeasure(scope.row)">删除</el-button>--> |
| | | <!-- </template>--> |
| | | <!-- </el-table-column>--> |
| | | <!-- </el-table>--> |
| | | <!-- <el-pagination--> |
| | | <!-- @size-change="onHandleSizeChange"--> |
| | | <!-- @current-change="onHandleCurrentChange"--> |
| | | <!-- class="mt15"--> |
| | | <!-- :pager-count="5"--> |
| | | <!-- :page-sizes="[10, 20, 30]"--> |
| | | <!-- v-model:current-page="riskControlMeasureData.params.pageIndex"--> |
| | | <!-- background--> |
| | | <!-- v-model:page-size="riskControlMeasureData.params.pageSize"--> |
| | | <!-- layout="total, sizes, prev, pager, next, jumper"--> |
| | | <!-- :total="riskControlMeasureData.total"--> |
| | | <!-- >--> |
| | | <!-- </el-pagination>--> |
| | | <!-- </el-card>--> |
| | | <!-- <riskControlMeasureDialog ref="riskControlMeasureDialogRef" @refreshRiskControlMeasure="initRiskControlMeasureData" />--> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import riskControlMeasureDialog from './components/riskControlMeasureDialog.vue'; |
| | | import { riskControlMeasureApi } from '/@/api/doublePreventSystem/riskControlMeasure/index.ts'; |
| | | import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | riskControlMeasureData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | controlType: number | null; |
| | | riskEventId: number | null; |
| | | }; |
| | | }; |
| | | controlTypeList: Array<controlTypeType>; |
| | | classifyOneList: Array<classifyOneType>; |
| | | classifyTwoList: Array<classifyTwoType>; |
| | | allSafetyRiskEventData: Array<SafetyRiskEventDataState>; |
| | | } |
| | | interface controlTypeType {} |
| | | interface classifyOneType {} |
| | | interface classifyTwoType {} |
| | | interface SafetyRiskEventDataState {} |
| | | |
| | | export default { |
| | | name: 'riskControlMeasure', |
| | | components: { riskControlMeasureDialog }, |
| | | setup() { |
| | | const riskControlMeasureDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | riskControlMeasureData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | controlType: null, |
| | | riskEventId: null |
| | | } |
| | | }, |
| | | controlTypeList: [ |
| | | { id: 1, name: '自动化监控' }, |
| | | { id: 2, name: '隐患排查' } |
| | | ], |
| | | classifyOneList: [], |
| | | classifyTwoList: [], |
| | | allSafetyRiskEventData: [] |
| | | }); |
| | | |
| | | // 初始化表格数据 |
| | | const initRiskControlMeasureData = async () => { |
| | | let res = await riskControlMeasureApi().getRiskControlMeasureList(state.riskControlMeasureData.params); |
| | | if (res.data.code === '200') { |
| | | state.riskControlMeasureData.data = res.data.data; |
| | | state.riskControlMeasureData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const dateFormat = (fmt: any, date: any) => { |
| | | date = new Date(date); |
| | | fmt = |
| | | date.getFullYear() + |
| | | '-' + |
| | | (date.getMonth() + 1) + |
| | | '-' + |
| | | date.getDate() + |
| | | ' ' + |
| | | date.getHours().toString() + |
| | | ':' + |
| | | (date.getMinutes().toString() === '0' ? '00' : date.getMinutes().toString()) + |
| | | ':' + |
| | | (date.getSeconds().toString() === '0' ? '00' : date.getMinutes().toString()); |
| | | return fmt; |
| | | }; |
| | | |
| | | //获取安全风险事件 |
| | | const getAllSafetyRiskEvent = async () => { |
| | | let res = await safetyRiskEventApi().getAllSafetyRiskEventList(); |
| | | if (res.data.code === '200') { |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(res.data.data)); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //获取管控措施分类 |
| | | const getClassify = async () => { |
| | | let res = await riskControlMeasureApi().getClassifyData(); |
| | | if (res.data.code === '200') { |
| | | state.classifyOneList = res.data.data.filter((item: any) => item.parentId === null); |
| | | state.classifyTwoList = res.data.data.filter((item: any) => item.parentId !== null); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | riskControlMeasureDialogRef.value.openSafetyRiskEventDialog( |
| | | type, |
| | | value, |
| | | state.allSafetyRiskEventData, |
| | | state.classifyOneList, |
| | | state.classifyTwoList |
| | | ); |
| | | }; |
| | | |
| | | // 删除角色 |
| | | const onDelRiskControlMeasure = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条风险管控措施:“${row.produceDeviceName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await riskControlMeasureApi().deleteRiskControlMeasure({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initRiskControlMeasureData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initRiskControlMeasureData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.riskControlMeasureData.params.pageSize = val; |
| | | initRiskControlMeasureData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.riskControlMeasureData.params.pageIndex = val; |
| | | initRiskControlMeasureData(); |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initRiskControlMeasureData(); |
| | | getAllSafetyRiskEvent(); |
| | | getClassify(); |
| | | }); |
| | | |
| | | return { |
| | | dateFormat, |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelRiskControlMeasure, |
| | | onHandleCurrentChange, |
| | | riskControlMeasureDialog, |
| | | riskControlMeasureDialogRef, |
| | | initRiskControlMeasureData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isSafetyRiskEventDialog" width="600px"> |
| | | <el-form |
| | | :model="safetyRiskEventForm" |
| | | :rules="safetyRiskEventFormRules" |
| | | ref="safetyRiskAnalyseUnitFormRef" |
| | | size="default" |
| | | label-width="180px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险分析单元名称" prop="riskUnitId"> |
| | | <el-select class="input-length" v-model="safetyRiskEventForm.riskUnitId" placeholder="请输入安全风险分析单元名称"> |
| | | <el-option |
| | | v-for="item in allSafetyRiskEventData" |
| | | :key="item.id" |
| | | :label="item.riskUnitName" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险事件名称" prop="riskEventName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="safetyRiskEventForm.riskEventName" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isSafetyRiskEventDialog = !isSafetyRiskEventDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitSafetyRiskEventDialog" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isSafetyRiskEventDialog: Boolean; |
| | | safetyRiskEventForm: { |
| | | riskEventName: string | null; |
| | | riskUnitId: number | null; |
| | | }; |
| | | title: string; |
| | | departmentList: []; |
| | | allSafetyRiskEventData: []; |
| | | safetyRiskEventFormRules: {}; |
| | | } |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'productionDeviceDialog', |
| | | setup(props: any, context: any) { |
| | | const safetyRiskAnalyseUnitFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | departmentList: [], |
| | | allSafetyRiskEventData: [], |
| | | isSafetyRiskEventDialog: false, |
| | | safetyRiskEventForm: { |
| | | riskEventName: null, |
| | | riskUnitId: null |
| | | }, |
| | | safetyRiskEventFormRules: { |
| | | riskEventName: [{ required: true, message: '请填写安全风险分析对象编码', trigger: 'blur' }], |
| | | riskUnitId: [{ required: true, message: '请填写安全风险分析单元名称', trigger: 'blur' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openSafetyRiskEventDialog = (type: string, value: object, department: [], allSafetyRiskEventData: []) => { |
| | | state.isSafetyRiskEventDialog = true; |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(allSafetyRiskEventData)); |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | safetyRiskAnalyseUnitFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增风险事件'; |
| | | state.safetyRiskEventForm = { |
| | | riskEventName: null, |
| | | riskUnitId: null |
| | | }; |
| | | } else { |
| | | state.title = '修改风险事件'; |
| | | state.safetyRiskEventForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitSafetyRiskEventDialog = async () => { |
| | | safetyRiskAnalyseUnitFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增风险事件') { |
| | | let res = await safetyRiskEventApi().addSafetyRiskEvent(state.safetyRiskEventForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险事件新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskEventDialog = false; |
| | | context.emit('refreshSafetyRiskEvent'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await safetyRiskEventApi().modSafetyRiskEvent(state.safetyRiskEventForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险事件修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskEventDialog = false; |
| | | context.emit('refreshSafetyRiskEvent'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | safetyRiskAnalyseUnitFormRef, |
| | | submitSafetyRiskEventDialog, |
| | | openSafetyRiskEventDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>安全风险单元名称:</span> |
| | | <el-select v-model="safetyRiskEventData.params.riskUnitId" class="input-box" placeholder="安全风险单元名称"> |
| | | <el-option v-for="item in allSafetyRiskEventData" :key="item.id" :label="item.riskUnitName" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>安全风险事件名称:</span> |
| | | <el-input v-model="safetyRiskEventData.params.riskEventName" class="input-box" placeholder="安全风险事件名称"> </el-input> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon><ele-Search /> </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增事件 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="safetyRiskEventData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="riskUnitName" label="安全风险分析单元名称" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskEventName" label="安全风险事件名称" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelSafetyRiskEvent(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="safetyRiskEventData.params.pageIndex" |
| | | background |
| | | v-model:page-size="safetyRiskEventData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="safetyRiskEventData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <safetyRiskEventDialog ref="safetyRiskEventDialogRef" @refreshSafetyRiskEvent="initSafetyRiskEventData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import safetyRiskEventDialog from './components/safetyRiskEventDialog.vue'; |
| | | import { safetyRiskEventApi } from '/@/api/doublePreventSystem/safetyRiskEvent/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | safetyRiskEventData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskEventName: string | null; |
| | | }; |
| | | }; |
| | | allSafetyRiskEventData: Array<safetyRiskEventState>; |
| | | } |
| | | interface safetyRiskEventState {} |
| | | |
| | | export default { |
| | | name: 'productionDevice', |
| | | components: { safetyRiskEventDialog }, |
| | | setup() { |
| | | const safetyRiskEventDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | safetyRiskEventData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskEventName: null |
| | | } |
| | | }, |
| | | allSafetyRiskEventData: [] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initSafetyRiskEventData = async () => { |
| | | let res = await safetyRiskEventApi().getSafetyRiskEventList(state.safetyRiskEventData.params); |
| | | if (res.data.code === '200') { |
| | | state.safetyRiskEventData.data = res.data.data; |
| | | state.safetyRiskEventData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 获取安全风险分析单元数据 |
| | | const getAllSafetyRiskEventData = async () => { |
| | | let res = await safetyRiskAnalyseUnitApi().getAllSafetyRiskAnalyseUnitList(); |
| | | if (res.data.code === '200') { |
| | | state.allSafetyRiskEventData = JSON.parse(JSON.stringify(res.data.data)); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开安全风险事件 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | safetyRiskEventDialogRef.value.openSafetyRiskEventDialog(type, value, state.allSafetyRiskEventData); |
| | | }; |
| | | |
| | | // 删除角色 |
| | | const onDelSafetyRiskEvent = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条安全风险事件:“${row.riskEventName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await safetyRiskEventApi().deleteSafetyRiskEvent({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initSafetyRiskEventData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initSafetyRiskEventData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.safetyRiskEventData.params.pageSize = val; |
| | | initSafetyRiskEventData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.safetyRiskEventData.params.pageIndex = val; |
| | | initSafetyRiskEventData(); |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | getAllSafetyRiskEventData(); |
| | | initSafetyRiskEventData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelSafetyRiskEvent, |
| | | onHandleCurrentChange, |
| | | safetyRiskEventDialog, |
| | | safetyRiskEventDialogRef, |
| | | initSafetyRiskEventData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isShowProductionDeviceDialog" width="600px"> |
| | | <el-form |
| | | :model="productionDeviceForm" |
| | | :rules="productionDeviceFormRules" |
| | | ref="productionDeviceFormRef" |
| | | size="default" |
| | | label-width="120px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="生产装置名称" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="productionDeviceForm.produceDeviceName" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="所属部门" prop="depId"> |
| | | <el-cascader |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | style="width: 85%" |
| | | v-model="productionDeviceForm.depId" |
| | | > |
| | | </el-cascader> |
| | | <!-- <el-select class="input-length" v-model="productionDeviceForm.depName" placeholder="请选择所属部门" clearable filterable></el-select>--> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险等级" prop="riskLevel"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="productionDeviceForm.riskLevel" |
| | | placeholder="请选择风险等级" |
| | | clearable |
| | | filterable |
| | | > |
| | | <el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="区域位置" prop="location"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="productionDeviceForm.location" |
| | | type="textarea" |
| | | placeholder="请输入区域位置" |
| | | maxlength="150" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowProductionDeviceDialog = !isShowProductionDeviceDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitProductionDevice" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isShowProductionDeviceDialog: Boolean; |
| | | productionDeviceForm: { |
| | | produceDeviceName: string; |
| | | depId: number | null; |
| | | riskLevel: number | null; |
| | | location: string; |
| | | }; |
| | | title: string; |
| | | departmentList: []; |
| | | levelList: Array<levelListState>; |
| | | productionDeviceFormRules: {}; |
| | | } |
| | | interface levelListState {} |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'productionDeviceDialog', |
| | | setup(props: any, context: any) { |
| | | const productionDeviceFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | departmentList: [], |
| | | isShowProductionDeviceDialog: false, |
| | | levelList: [ |
| | | { id: 1, name: '低风险' }, |
| | | { id: 2, name: '一般风险' }, |
| | | { id: 3, name: '较大风险' }, |
| | | { id: 4, name: '重大风险' } |
| | | ], |
| | | productionDeviceForm: { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }, |
| | | productionDeviceFormRules: { |
| | | produceDeviceName: [{ required: true, message: '请填写生产装置名称', trigger: 'blur' }], |
| | | depId: [{ required: true, message: '请选择部门', trigger: 'change' }], |
| | | riskLevel: [{ required: true, message: '请选择风险等级', trigger: 'change' }], |
| | | location: [{ required: true, message: '请填写区域位置', trigger: 'blur' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openProductionDeviceDialog = (type: string, value: object, department: []) => { |
| | | state.isShowProductionDeviceDialog = true; |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | productionDeviceFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增生产装置'; |
| | | state.productionDeviceForm = { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }; |
| | | } else { |
| | | state.title = '修改生产装置'; |
| | | state.productionDeviceForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitProductionDevice = async () => { |
| | | productionDeviceFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增生产装置') { |
| | | let res = await productionDeviceApi().addProductionDevice(state.productionDeviceForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowProductionDeviceDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await productionDeviceApi().modProductionDevice(state.productionDeviceForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowProductionDeviceDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | productionDeviceFormRef, |
| | | submitProductionDevice, |
| | | openProductionDeviceDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>风险等级:</span> |
| | | <el-select v-model="productionDeviceData.params.riskLevel" clearable filterable class="input-box" placeholder="请选择风险等级"> |
| | | <el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>部门:</span> |
| | | <el-cascader |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'id', label: 'name' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | class="input-box" |
| | | v-model="productionDeviceData.params.depId" |
| | | > |
| | | </el-cascader> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增装置 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="productionDeviceData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="depName" label="所属部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskLevel" label="风险等级" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="location" label="区域位置" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="状态" show-overflow-tooltip> </el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="productionDeviceData.params.pageIndex" |
| | | background |
| | | v-model:page-size="productionDeviceData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="productionDeviceData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <productionDeviceDialog ref="productionDeviceDialogRef" @refreshProductionDevice="initProductionDeviceTableData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import productionDeviceDialog from './components/productionDeviceDialog.vue'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | productionDeviceData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskLevel: number | null; |
| | | status: number; |
| | | depId: number | null; |
| | | location: string | null; |
| | | produceDeviceName: string | null; |
| | | }; |
| | | }; |
| | | departmentList: Array<DepartmentState>; |
| | | levelList: Array<levelListState>; |
| | | } |
| | | interface levelListState {} |
| | | interface DepartmentState {} |
| | | |
| | | export default defineComponent({ |
| | | name: 'productionDevice', |
| | | components: { productionDeviceDialog }, |
| | | setup() { |
| | | const productionDeviceDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | productionDeviceData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskLevel: null, |
| | | status: 1, |
| | | depId: null, |
| | | location: null, |
| | | produceDeviceName: null |
| | | } |
| | | }, |
| | | departmentList: [], |
| | | levelList: [ |
| | | { id: 1, name: '低风险' }, |
| | | { id: 2, name: '一般风险' }, |
| | | { id: 3, name: '较大风险' }, |
| | | { id: 4, name: '重大风险' } |
| | | ] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initProductionDeviceTableData = async () => { |
| | | let res = await productionDeviceApi().getProductionDeviceList(state.productionDeviceData.params); |
| | | if (res.data.code === '200') { |
| | | state.productionDeviceData.data = res.data.data; |
| | | state.productionDeviceData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList(); |
| | | if (res.data.code === '200') { |
| | | state.departmentList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | productionDeviceDialogRef.value.openProductionDeviceDialog(type, value, state.departmentList); |
| | | }; |
| | | // 删除角色 |
| | | const onDelProductionDevice = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条生产装置:“${row.produceDeviceName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await productionDeviceApi().deleteProductionDevice({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initProductionDeviceTableData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | const handleSearch = () => { |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.productionDeviceData.params.pageSize = val; |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.productionDeviceData.params.pageIndex = val; |
| | | initProductionDeviceTableData(); |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initProductionDeviceTableData(); |
| | | getDepartmentData(); |
| | | }); |
| | | return { |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelProductionDevice, |
| | | onHandleCurrentChange, |
| | | productionDeviceDialog, |
| | | productionDeviceDialogRef, |
| | | initProductionDeviceTableData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isSafetyRiskAnalyseUnitDialog" width="600px"> |
| | | <el-form |
| | | :model="safetyRiskAnalyseUnitForm" |
| | | :rules="safetyRiskAnalyseUnitFormRules" |
| | | ref="safetyRiskAnalyseUnitFormRef" |
| | | size="default" |
| | | label-width="180px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险分析对象编码" prop="riskCode"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="safetyRiskAnalyseUnitForm.riskCode" |
| | | placeholder="请输入安全风险分析对象编码" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="安全风险分析单元名称" prop="riskUnitName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="safetyRiskAnalyseUnitForm.riskUnitName" |
| | | placeholder="请输入安全风险分析单元名称" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="生产装置名称" prop="produceDeviceId"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="safetyRiskAnalyseUnitForm.produceDeviceId" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | > |
| | | <el-option |
| | | v-for="item in allProduceDeviceData" |
| | | :key="item.id" |
| | | :label="item.produceDeviceName" |
| | | :value="item.id" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="责任部门" prop="liableDepId"> |
| | | <el-cascader |
| | | @change="achieveUserList" |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | style="width: 85%" |
| | | v-model="safetyRiskAnalyseUnitForm.liableDepId" |
| | | > |
| | | </el-cascader> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="责任人" prop="liablePersonId"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="safetyRiskAnalyseUnitForm.liablePersonId" |
| | | placeholder="请选择责任人" |
| | | clearable |
| | | filterable |
| | | > |
| | | <el-option v-for="item in userList" :key="item.uid" :label="item.realName" :value="item.uid"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isSafetyRiskAnalyseUnitDialog = !isSafetyRiskAnalyseUnitDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitSafetyRiskAnalyseUnitDialog" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isSafetyRiskAnalyseUnitDialog: Boolean; |
| | | safetyRiskAnalyseUnitForm: { |
| | | riskCode: string | null; |
| | | riskUnitName: string | null; |
| | | liablePersonId: number | null; |
| | | liableDepId: number | null; |
| | | produceDeviceId: number | null; |
| | | }; |
| | | title: string; |
| | | userList: []; |
| | | departmentList: []; |
| | | allProduceDeviceData: []; |
| | | safetyRiskAnalyseUnitFormRules: {}; |
| | | } |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit'; |
| | | import { ElMessage } from 'element-plus'; |
| | | import { userApi } from '/@/api/user'; |
| | | export default { |
| | | name: 'productionDeviceDialog', |
| | | setup(props: any, context: any) { |
| | | const safetyRiskAnalyseUnitFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | userList: [], |
| | | departmentList: [], |
| | | allProduceDeviceData: [], |
| | | isSafetyRiskAnalyseUnitDialog: false, |
| | | safetyRiskAnalyseUnitForm: { |
| | | riskCode: null, |
| | | riskUnitName: null, |
| | | liablePersonId: null, |
| | | liableDepId: null, |
| | | produceDeviceId: null |
| | | }, |
| | | safetyRiskAnalyseUnitFormRules: { |
| | | riskCode: [{ required: true, message: '请填写安全风险分析对象编码', trigger: 'blur' }], |
| | | riskUnitName: [{ required: true, message: '请填写安全风险分析单元名称', trigger: 'blur' }], |
| | | liableDepId: [{ required: true, message: '请选择责任部门', trigger: 'change' }], |
| | | liablePersonId: [{ required: true, message: '请选择责任人', trigger: 'change' }], |
| | | produceDeviceId: [{ required: true, message: '请选择生产装置', trigger: 'change' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openSafetyRiskAnalyseUnitDialog = (type: string, value: object, department: [], allProduceDeviceData: []) => { |
| | | // console.log(jsonBig.stringify(123124124124214123131)) |
| | | state.isSafetyRiskAnalyseUnitDialog = true; |
| | | state.allProduceDeviceData = JSON.parse(JSON.stringify(allProduceDeviceData)); |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | safetyRiskAnalyseUnitFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增风险分析单元'; |
| | | state.safetyRiskAnalyseUnitForm = { |
| | | riskCode: null, |
| | | riskUnitName: null, |
| | | liablePersonId: null, |
| | | liableDepId: null, |
| | | produceDeviceId: null |
| | | }; |
| | | } else { |
| | | state.title = '修改风险分析单元'; |
| | | state.safetyRiskAnalyseUnitForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitSafetyRiskAnalyseUnitDialog = async () => { |
| | | safetyRiskAnalyseUnitFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增风险分析单元') { |
| | | let res = await safetyRiskAnalyseUnitApi().addSafetyRiskAnalyseUnit(state.safetyRiskAnalyseUnitForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险分析单元新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskAnalyseUnitDialog = false; |
| | | context.emit('refreshSafetyRiskAnalyseUnit'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await safetyRiskAnalyseUnitApi().modSafetyRiskAnalyseUnit(state.safetyRiskAnalyseUnitForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '风险分析单元修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isSafetyRiskAnalyseUnitDialog = false; |
| | | context.emit('refreshSafetyRiskAnalyseUnit'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | const achieveUserList = () => { |
| | | state.safetyRiskAnalyseUnitForm.liablePersonId = null; |
| | | state.userList = []; |
| | | getUserData(); |
| | | }; |
| | | |
| | | //获取用户列表 |
| | | const getUserData = async () => { |
| | | let res = await userApi().getUserLByDepartment(state.safetyRiskAnalyseUnitForm.liableDepId); |
| | | if (res.data.code === '200') { |
| | | state.userList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | achieveUserList, |
| | | safetyRiskAnalyseUnitFormRef, |
| | | submitSafetyRiskAnalyseUnitDialog, |
| | | openSafetyRiskAnalyseUnitDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"> |
| | | <span>责任部门:</span> |
| | | <el-cascader |
| | | @change="achieveUserList" |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'id', label: 'name' }" |
| | | placeholder="责任部门" |
| | | clearable |
| | | filterable |
| | | class="input-box" |
| | | v-model="safetyRiskAnalyseUnitData.params.liableDepId" |
| | | > |
| | | </el-cascader> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>责任人:</span> |
| | | <el-select v-model="safetyRiskAnalyseUnitData.params.liablePersonId" clearable filterable class="input-box" placeholder="责任人"> |
| | | <el-option v-for="item in userList" :key="item.uid" :label="item.realName" :value="item.uid"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="basic-line"> |
| | | <span>单元名称:</span> |
| | | <el-input v-model="safetyRiskAnalyseUnitData.params.riskUnitName" clearable filterable class="input-box" placeholder="单元名称"> |
| | | </el-input> |
| | | </div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增单元 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="safetyRiskAnalyseUnitData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="produceDeviceName" label="生产装置名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskUnitName" label="安全风险分析单元名称" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="riskCode" label="安全风险分析对象编码" width="180" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="liableDep" label="责任部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="liablePerson" label="责任人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createByUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="safetyRiskAnalyseUnitData.params.pageIndex" |
| | | background |
| | | v-model:page-size="safetyRiskAnalyseUnitData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="safetyRiskAnalyseUnitData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <safetyRiskAnalyseUnitDialog ref="safetyRiskAnalyseUnitDialogRef" @refreshSafetyRiskAnalyseUnit="initSafetyRiskAnalyseUnitData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import safetyRiskAnalyseUnitDialog from './components/safetyRiskAnalyseUnitDialog.vue'; |
| | | import { safetyRiskAnalyseUnitApi } from '/@/api/doublePreventSystem/safetyRiskAnalyseUnit/index.ts'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | import { userApi } from '/@/api/user'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | roleName: string; |
| | | roleSign: string; |
| | | describe: string; |
| | | sort: number; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | safetyRiskAnalyseUnitData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | riskUnitName: string | null; |
| | | liableDepId: number | null; |
| | | liablePersonId: number | null; |
| | | }; |
| | | }; |
| | | userList: Array<UserState>; |
| | | departmentList: Array<DepartmentState>; |
| | | allProduceDeviceData: Array<produceDeviceState>; |
| | | } |
| | | interface produceDeviceState {} |
| | | interface DepartmentState {} |
| | | interface UserState {} |
| | | |
| | | export default { |
| | | name: 'productionDevice', |
| | | components: { safetyRiskAnalyseUnitDialog }, |
| | | setup() { |
| | | const safetyRiskAnalyseUnitDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | safetyRiskAnalyseUnitData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | riskUnitName: null, |
| | | liableDepId: null, |
| | | liablePersonId: null |
| | | } |
| | | }, |
| | | userList: [], |
| | | departmentList: [], |
| | | allProduceDeviceData: [] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initSafetyRiskAnalyseUnitData = async () => { |
| | | let res = await safetyRiskAnalyseUnitApi().getSafetyRiskAnalyseUnitList(state.safetyRiskAnalyseUnitData.params); |
| | | if (res.data.code === '200') { |
| | | state.safetyRiskAnalyseUnitData.data = res.data.data; |
| | | state.safetyRiskAnalyseUnitData.total = res.data.count; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const achieveUserList = () => { |
| | | state.safetyRiskAnalyseUnitData.params.liablePersonId = null; |
| | | state.userList = []; |
| | | getUserData(); |
| | | }; |
| | | |
| | | //获取生产装置列表 |
| | | const getAllProduceDeviceData = async () => { |
| | | let res = await productionDeviceApi().getAllProductionDeviceList(); |
| | | if (res.data.code === '200') { |
| | | state.allProduceDeviceData = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //获取部门列表 |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList(); |
| | | if (res.data.code === '200') { |
| | | state.departmentList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | //获取用户列表 |
| | | const getUserData = async () => { |
| | | let res = await userApi().getUserLByDepartment(state.safetyRiskAnalyseUnitData.params.liableDepId); |
| | | if (res.data.code === '200') { |
| | | state.userList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | safetyRiskAnalyseUnitDialogRef.value.openSafetyRiskAnalyseUnitDialog(type, value, state.departmentList, state.allProduceDeviceData); |
| | | }; |
| | | |
| | | // 删除角色 |
| | | const onDelProductionDevice = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条安全风险分析单元:“${row.riskUnitName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await safetyRiskAnalyseUnitApi().deleteSafetyRiskAnalyseUnit({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initSafetyRiskAnalyseUnitData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initSafetyRiskAnalyseUnitData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.safetyRiskAnalyseUnitData.params.pageSize = val; |
| | | initSafetyRiskAnalyseUnitData(); |
| | | }; |
| | | |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.safetyRiskAnalyseUnitData.params.pageIndex = val; |
| | | initSafetyRiskAnalyseUnitData(); |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initSafetyRiskAnalyseUnitData(); |
| | | getAllProduceDeviceData(); |
| | | getDepartmentData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | achieveUserList, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelProductionDevice, |
| | | onHandleCurrentChange, |
| | | safetyRiskAnalyseUnitDialog, |
| | | safetyRiskAnalyseUnitDialogRef, |
| | | initSafetyRiskAnalyseUnitData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
| | |
| | | <div class="gridCont"> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="6" |
| | | ><div class="grid-content" v-throttle @click="renderMenu('2')"> |
| | | ><div class="grid-content" v-throttle @click="render('2')"> |
| | | <div class="itemTit">双重预防系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon4.png" /><img class="bgImg" src="../../assets/menu/card4.png" /></div |
| | | ></el-col> |
| | | <el-col :span="6" |
| | | ><div class="grid-content" v-throttle @click="renderMenu('3')"> |
| | | ><div class="grid-content" v-throttle @click="render('3')"> |
| | | <div class="itemTit">特殊作业系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon7.png" /><img class="bgImg" src="../../assets/menu/card7.png" /></div |
| | | ></el-col> |
| | | <el-col :span="6" |
| | | ><div class="grid-content" v-throttle @click="renderMenu('4')"> |
| | | ><div class="grid-content" v-throttle @click="render('4')"> |
| | | <div class="itemTit">智能巡检系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon8.png" /><img class="bgImg" src="../../assets/menu/card8.png" /></div |
| | | ></el-col> |
| | | <el-col :span="6"> |
| | | <div class="grid-content" v-throttle @click="renderMenu('5')"> |
| | | <div class="grid-content" v-throttle @click="render('5')"> |
| | | <div class="itemTit">安全风险综合 <br />预警预报平台</div> |
| | | <img class="iconImg" src="../../assets/menu/icon1.png" /> |
| | | <img class="bgImg" src="../../assets/menu/card1.png" /> |
| | |
| | | </el-row> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="6" |
| | | ><div class="grid-content grid-content-2" v-throttle @click="renderMenu('6')"> |
| | | ><div class="grid-content grid-content-2" v-throttle @click="render('6')"> |
| | | <div class="itemTit">应急管理系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon5.png" /><img class="bgImg" src="../../assets/menu/card5.png" /></div |
| | | ></el-col> |
| | | <el-col :span="6" |
| | | ><div class="grid-content grid-content-2" v-throttle @click="renderMenu('7')"> |
| | | ><div class="grid-content grid-content-2" v-throttle @click="render('7')"> |
| | | <div class="itemTit">目标责任管理系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon2.png" /><img class="bgImg" src="../../assets/menu/card2.png" /></div |
| | | ></el-col> |
| | | <el-col :span="6" |
| | | ><div class="grid-content grid-content-2" v-throttle @click="renderMenu('8')"> |
| | | ><div class="grid-content grid-content-2" v-throttle @click="render('8')"> |
| | | <div class="itemTit">事故管理系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon6.png" /><img class="bgImg" src="../../assets/menu/card6.png" /></div |
| | | ></el-col> |
| | | <el-col :span="6" |
| | | ><div class="grid-content grid-content-2" v-throttle @click="renderMenu('9')"> |
| | | ><div class="grid-content grid-content-2" v-throttle @click="render('9')"> |
| | | <div class="itemTit">设备综合管控系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon9.png" /><img class="bgImg" src="../../assets/menu/card9.png" /></div |
| | | ></el-col> |
| | | </el-row> |
| | | <el-row :gutter="20"> |
| | | <el-col :span="6" |
| | | ><div class="grid-content grid-content-3" v-throttle @click="renderMenu('10')"> |
| | | ><div class="grid-content grid-content-3" v-throttle @click="render('10')"> |
| | | <div class="itemTit">安全知识图谱系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon3.png" /><img class="bgImg" src="../../assets/menu/card3.png" /></div |
| | | ></el-col> |
| | | <el-col :span="9" |
| | | ><div class="grid-content grid-content-3" v-throttle @click="renderMenu('11')"> |
| | | ><div class="grid-content grid-content-3" v-throttle @click="render('11')"> |
| | | <div class="itemTit">危险化学品全生命周期安全<br />管理系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon10.png" /><img class="bgImg" src="../../assets/menu/card10.png" /></div |
| | | ></el-col> |
| | | <el-col :span="9" |
| | | ><div class="grid-content grid-content-3" v-throttle @click="renderMenu('1')"> |
| | | ><div class="grid-content grid-content-3" @click="render('1')"> |
| | | <div class="itemTit">基础数据权限管理系统</div> |
| | | <img class="iconImg" src="../../assets/menu/icon11.png" /><img class="bgImg" src="../../assets/menu/card11.png" /></div |
| | | ></el-col> |
| | |
| | | interface LoginState { |
| | | tabsActiveName: string; |
| | | isScan: boolean; |
| | | count: number; |
| | | projectId: string; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | |
| | | components: {}, |
| | | setup() { |
| | | const { t } = useI18n(); |
| | | const route = useRoute(); |
| | | const router = useRouter(); |
| | | const userInfo = useUserInfo(); |
| | | const { userInfos } = storeToRefs(userInfo); |
| | |
| | | const { themeConfig } = storeToRefs(storesThemeConfig); |
| | | const state = reactive<LoginState>({ |
| | | tabsActiveName: 'account', |
| | | isScan: false |
| | | isScan: false, |
| | | count: 0, |
| | | projectId: '1' |
| | | }); |
| | | // 获取布局配置信息 |
| | | const getThemeConfig = computed(() => { |
| | |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | const renderMenu = async (value: string) => { |
| | | Session.set('projectId', value); |
| | | userInfos.value.projectId = value; |
| | | //选择菜单 |
| | | const render = (value: string) => { |
| | | state.projectId = value; |
| | | renderMenu(); |
| | | }; |
| | | |
| | | const throttle = (renderMenu: any, delay: number) => { |
| | | let flag = true; |
| | | let count = 0; |
| | | return function () { |
| | | if (!flag) return; |
| | | flag = false; |
| | | if (count === 0) { |
| | | renderMenu.apply(); |
| | | count++; |
| | | flag = true; |
| | | } else { |
| | | setTimeout(() => { |
| | | renderMenu.apply(); |
| | | flag = true; |
| | | }, delay); |
| | | } |
| | | }; |
| | | }; |
| | | |
| | | //调用菜单方法 |
| | | const renderMenu = throttle(() => { |
| | | renderFun(); |
| | | }, 2000); |
| | | |
| | | //调后台菜单接口 |
| | | const renderFun = async () => { |
| | | Session.set('projectId', state.projectId); |
| | | userInfos.value.projectId = state.projectId; |
| | | await initBackEndControlRoutes().then(() => { |
| | | let linkToMenu = [...routesList.value]; |
| | | if (linkToMenu && linkToMenu.length > 1) { |
| | | router.push(linkToFirstMenu(JSON.parse(JSON.stringify(linkToMenu))[1])); |
| | | } else { |
| | | ElMessage({ type: 'warning', message: '你没有该项目的权限' }); |
| | | ElMessage({ type: 'warning', message: '你没有该子系统的权限' }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | const linkToFirstMenu: any = (value: any) => { |
| | | let returnMenu = value; |
| | | if (returnMenu.children?.length > 0) { |
| | |
| | | // loginApp() |
| | | }); |
| | | return { |
| | | render, |
| | | logoMini, |
| | | onLoginOut, |
| | | loginIconTwo, |
| | | getThemeConfig, |
| | | renderMenu, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
对比新文件 |
| | |
| | | <template></template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'RFIDDialog' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"></div> |
| | | <div class="basic-line"></div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增巡检指标 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="RFIDData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="quota" label="指标名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="quotaUnit" label="指标单位" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="quotaType" label="指标类型" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="RFIDData.params.pageIndex" |
| | | background |
| | | v-model:page-size="RFIDData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="RFIDData.total" |
| | | class="page-position" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </el-card> |
| | | <RFIDDialog ref="RFIDDialogRef" @refreshProductionDevice="initRFIDTableData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import RFIDDialog from './components/RFIDDialog.vue'; |
| | | import { RFIDApi } from '/@/api/intellectInspectSystem/RFID'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | quota: string; |
| | | quotaUnit: string; |
| | | quotaType: string; |
| | | createUserName: string; |
| | | gmtCreate: string; |
| | | lastEditUserName: string; |
| | | gmtModitify: string; |
| | | } |
| | | interface TableDataState { |
| | | RFIDData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | rfid: number | null; |
| | | rfidName: string | null; |
| | | }; |
| | | }; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | | name: 'RFID', |
| | | components: { RFIDDialog }, |
| | | setup() { |
| | | const RFIDDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | RFIDData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | rfid: null, |
| | | rfidName: null |
| | | } |
| | | } |
| | | }); |
| | | // 初始化表格数据 |
| | | const initRFIDTableData = async () => { |
| | | let res = await RFIDApi().getRFIDList(state.RFIDData.params); |
| | | if (res.data.code === '200') { |
| | | state.RFIDData.data = res.data.data.records; |
| | | state.RFIDData.total = res.data.data.total; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | RFIDDialogRef.value.openProductionDeviceDialog(type, value); |
| | | }; |
| | | // 删除角色 |
| | | const onDelProductionDevice = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条生产装置:“${row.produceDeviceName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await RFIDApi().deleteRFID({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initRFIDTableData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initRFIDTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.RFIDData.params.pageSize = val; |
| | | initRFIDTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.RFIDData.params.pageIndex = val; |
| | | initRFIDTableData(); |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initRFIDTableData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelProductionDevice, |
| | | onHandleCurrentChange, |
| | | RFIDDialog, |
| | | RFIDDialogRef, |
| | | initRFIDTableData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>111</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template></template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>222</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-add-menu-container"> |
| | | <el-dialog :title="title" v-model="isShowProductionDeviceDialog" width="600px"> |
| | | <el-form |
| | | :model="productionDeviceForm" |
| | | :rules="productionDeviceFormRules" |
| | | ref="productionDeviceFormRef" |
| | | size="default" |
| | | label-width="120px" |
| | | > |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="生产装置名称" prop="produceDeviceName"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="productionDeviceForm.produceDeviceName" |
| | | placeholder="请输入生产装置名称" |
| | | clearable |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="所属部门" prop="depId"> |
| | | <el-cascader |
| | | :options="departmentList" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | filterable |
| | | style="width: 85%" |
| | | v-model="productionDeviceForm.depId" |
| | | > |
| | | </el-cascader> |
| | | <!-- <el-select class="input-length" v-model="productionDeviceForm.depName" placeholder="请选择所属部门" clearable filterable></el-select>--> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="风险等级" prop="riskLevel"> |
| | | <el-select |
| | | class="input-length" |
| | | v-model="productionDeviceForm.riskLevel" |
| | | placeholder="请选择风险等级" |
| | | clearable |
| | | filterable |
| | | > |
| | | <el-option v-for="item in levelList" :key="item.id" :label="item.name" :value="item.id"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="区域位置" prop="location"> |
| | | <el-input |
| | | class="input-length" |
| | | v-model.trim="productionDeviceForm.location" |
| | | type="textarea" |
| | | placeholder="请输入区域位置" |
| | | maxlength="150" |
| | | ></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowProductionDeviceDialog = !isShowProductionDeviceDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="submitProductionDevice" v-throttle size="default">确 实</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | interface stateType { |
| | | isShowProductionDeviceDialog: Boolean; |
| | | productionDeviceForm: { |
| | | produceDeviceName: string; |
| | | depId: number | null; |
| | | riskLevel: number | null; |
| | | location: string; |
| | | }; |
| | | title: string; |
| | | departmentList: []; |
| | | levelList: Array<levelListState>; |
| | | productionDeviceFormRules: {}; |
| | | } |
| | | interface levelListState {} |
| | | import { reactive, toRefs, ref } from 'vue'; |
| | | import { productionDeviceApi } from '/@/api/doublePreventSystem/productionDevice'; |
| | | import { ElMessage } from 'element-plus'; |
| | | export default { |
| | | name: 'inspectTargetDialog', |
| | | setup(props: any, context: any) { |
| | | const productionDeviceFormRef = ref(); |
| | | const state = reactive<stateType>({ |
| | | title: '', |
| | | departmentList: [], |
| | | isShowProductionDeviceDialog: false, |
| | | levelList: [ |
| | | { id: 1, name: '低风险' }, |
| | | { id: 2, name: '一般风险' }, |
| | | { id: 3, name: '较大风险' }, |
| | | { id: 4, name: '重大风险' } |
| | | ], |
| | | productionDeviceForm: { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }, |
| | | productionDeviceFormRules: { |
| | | produceDeviceName: [{ required: true, message: '请填写生产装置名称', trigger: 'blur' }], |
| | | depId: [{ required: true, message: '请选择部门', trigger: 'change' }], |
| | | riskLevel: [{ required: true, message: '请选择风险等级', trigger: 'change' }], |
| | | location: [{ required: true, message: '请填写区域位置', trigger: 'blur' }] |
| | | } |
| | | }); |
| | | |
| | | //打开模态框 |
| | | const openProductionDeviceDialog = (type: string, value: object, department: []) => { |
| | | state.isShowProductionDeviceDialog = true; |
| | | state.departmentList = department; |
| | | setTimeout(() => { |
| | | productionDeviceFormRef.value.clearValidate(); |
| | | }); |
| | | if (type === '新增') { |
| | | state.title = '新增生产装置'; |
| | | state.productionDeviceForm = { |
| | | produceDeviceName: '', |
| | | depId: null, |
| | | riskLevel: null, |
| | | location: '' |
| | | }; |
| | | } else { |
| | | state.title = '修改生产装置'; |
| | | state.productionDeviceForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | //新增修改提交 |
| | | const submitProductionDevice = async () => { |
| | | productionDeviceFormRef.value.validate(async (valid: Boolean) => { |
| | | if (valid) { |
| | | if (state.title === '新增生产装置') { |
| | | let res = await productionDeviceApi().addProductionDevice(state.productionDeviceForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowProductionDeviceDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await productionDeviceApi().modProductionDevice(state.productionDeviceForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '生产装置修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowProductionDeviceDialog = false; |
| | | context.emit('refreshProductionDevice'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: '请完善基本信息' |
| | | }); |
| | | } |
| | | }); |
| | | }; |
| | | |
| | | return { |
| | | ...toRefs(state), |
| | | productionDeviceFormRef, |
| | | submitProductionDevice, |
| | | openProductionDeviceDialog |
| | | }; |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .input-length { |
| | | width: 85%; |
| | | } |
| | | </style> |
对比新文件 |
| | |
| | | <template> |
| | | <div class="system-role-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <div class="basic-line"></div> |
| | | <div class="basic-line"></div> |
| | | <el-button size="default" type="primary" class="ml10" v-throttle @click="handleSearch"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenDialogRef('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增巡检指标 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="inspectTargetData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="quota" label="指标名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="quotaUnit" label="指标单位" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="quotaType" label="指标类型" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createUserName" label="创建人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="lastEditUserName" label="最后修改人" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="gmtModitify" label="最后修改时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="150"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenDialogRef('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="danger" @click="onDelProductionDevice(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="inspectTargetData.params.pageIndex" |
| | | background |
| | | v-model:page-size="inspectTargetData.params.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="inspectTargetData.total" |
| | | class="page-position" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </el-card> |
| | | <inspectTargetDialog ref="inspectTargetDialogRef" @refreshProductionDevice="initProductionDeviceTableData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import inspectTargetDialog from './components/inspectTargetDialog.vue'; |
| | | import { inspectTargetApi } from '/@/api/intellectInspectSystem/inspectTargetManage'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableData { |
| | | quota: string; |
| | | quotaUnit: string; |
| | | quotaType: string; |
| | | createUserName: string; |
| | | gmtCreate: string; |
| | | lastEditUserName: string; |
| | | gmtModitify: string; |
| | | } |
| | | interface TableDataState { |
| | | inspectTargetData: { |
| | | data: Array<TableData>; |
| | | total: number; |
| | | loading: boolean; |
| | | params: { |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | }; |
| | | }; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | | name: 'productionDevice', |
| | | components: { inspectTargetDialog }, |
| | | setup() { |
| | | const inspectTargetDialogRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | inspectTargetData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | params: { |
| | | pageIndex: 1, |
| | | pageSize: 10 |
| | | } |
| | | } |
| | | }); |
| | | // 初始化表格数据 |
| | | const initInspectTargetTableData = async () => { |
| | | let res = await inspectTargetApi().getInspectTargetList(state.inspectTargetData.params); |
| | | if (res.data.code === '200') { |
| | | state.inspectTargetData.data = res.data.data.records; |
| | | state.inspectTargetData.total = res.data.data.total; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开生产装置弹窗 |
| | | const onOpenDialogRef = (type: string, value: any) => { |
| | | inspectTargetDialogRef.value.openProductionDeviceDialog(type, value); |
| | | }; |
| | | // 删除角色 |
| | | const onDelProductionDevice = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除该条生产装置:“${row.produceDeviceName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await inspectTargetApi().deleteInspectTarget({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await initInspectTargetTableData(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | |
| | | const handleSearch = () => { |
| | | initInspectTargetTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.inspectTargetData.params.pageSize = val; |
| | | initInspectTargetTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.inspectTargetData.params.pageIndex = val; |
| | | initInspectTargetTableData(); |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initInspectTargetTableData(); |
| | | }); |
| | | |
| | | return { |
| | | handleSearch, |
| | | onOpenDialogRef, |
| | | onHandleSizeChange, |
| | | onDelProductionDevice, |
| | | onHandleCurrentChange, |
| | | inspectTargetDialog, |
| | | inspectTargetDialogRef, |
| | | initInspectTargetTableData, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template></template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
对比新文件 |
| | |
| | | <template> |
| | | <div>1234</div> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: 'index' |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped></style> |
| | |
| | | <template> |
| | | <el-form size="large" class="login-content-form"> |
| | | <el-form-item class="login-animation1"> |
| | | <el-input type="text" :placeholder="$t('message.account.accountPlaceholder1')" v-model="ruleForm.username" clearable autocomplete="off" size="large"> |
| | | <template #prefix> |
| | | <el-icon class="el-input__icon" style="margin-right: 20px"><img src="../../../assets/loginPage/login_icon_user.png" style="width: 24px;height: 24px"></el-icon> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item class="login-animation2"> |
| | | <el-input |
| | | :type="isShowPassword ? 'text' : 'password'" |
| | | :placeholder="$t('message.account.accountPlaceholder2')" |
| | | v-model="ruleForm.password" |
| | | autocomplete="off" |
| | | size="large" |
| | | <el-form size="large" class="login-content-form"> |
| | | <el-form-item class="login-animation1"> |
| | | <el-input |
| | | type="text" |
| | | :placeholder="$t('message.account.accountPlaceholder1')" |
| | | v-model="ruleForm.username" |
| | | clearable |
| | | autocomplete="off" |
| | | size="large" |
| | | > |
| | | <template #prefix> |
| | | <el-icon class="el-input__icon" style="margin-right: 20px" |
| | | ><img src="../../../assets/loginPage/login_icon_user.png" style="width: 24px; height: 24px" |
| | | /></el-icon> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item class="login-animation2"> |
| | | <el-input |
| | | :type="isShowPassword ? 'text' : 'password'" |
| | | :placeholder="$t('message.account.accountPlaceholder2')" |
| | | v-model="ruleForm.password" |
| | | autocomplete="off" |
| | | size="large" |
| | | @keyup.enter.native="onSignIn" |
| | | > |
| | | <template #prefix> |
| | | <el-icon class="el-input__icon" style="margin-right: 20px"><img src="../../../assets/loginPage/login_icon_password.png" style="width: 24px;height: 24px"></el-icon> |
| | | </template> |
| | | <template #suffix> |
| | | <i |
| | | class="iconfont el-input__icon login-content-password" |
| | | :class="isShowPassword ? 'icon-yincangmima' : 'icon-xianshimima'" |
| | | @click="isShowPassword = !isShowPassword" |
| | | > |
| | | </i> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item class="login-animation4 codeDeal"> |
| | | <el-checkbox v-model="saveCode" label="记住密码" size="large" /> |
| | | <span class="forgetCode">忘记密码?</span> |
| | | </el-form-item> |
| | | <el-form-item class="login-animation4"> |
| | | <el-button type="primary" class="login-content-submit" round @click="onSignIn" :loading="loading.signIn"> |
| | | <span>登录系统</span> |
| | | </el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | > |
| | | <template #prefix> |
| | | <el-icon class="el-input__icon" style="margin-right: 20px" |
| | | ><img src="../../../assets/loginPage/login_icon_password.png" style="width: 24px; height: 24px" |
| | | /></el-icon> |
| | | </template> |
| | | <template #suffix> |
| | | <i |
| | | class="iconfont el-input__icon login-content-password" |
| | | :class="isShowPassword ? 'icon-yincangmima' : 'icon-xianshimima'" |
| | | @click="isShowPassword = !isShowPassword" |
| | | > |
| | | </i> |
| | | </template> |
| | | </el-input> |
| | | </el-form-item> |
| | | <el-form-item class="login-animation4 codeDeal"> |
| | | <el-checkbox v-model="saveCode" label="记住密码" size="large" /> |
| | | <span class="forgetCode">忘记密码?</span> |
| | | </el-form-item> |
| | | <el-form-item class="login-animation4"> |
| | | <el-button type="primary" class="login-content-submit" round @click="onSignIn" :loading="loading.signIn"> |
| | | <span>登录系统</span> |
| | | </el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | |
| | | import { formatAxis } from '/@/utils/formatTime'; |
| | | import { NextLoading } from '/@/utils/loading'; |
| | | import { useLoginApi } from '/@/api/login'; |
| | | import {useUserInfo} from "/@/stores/userInfo"; |
| | | import { useUserInfo } from '/@/stores/userInfo'; |
| | | |
| | | export default defineComponent({ |
| | | name: 'accountLogin', |
| | | setup() { |
| | | const { t } = useI18n(); |
| | | const userInfo = useUserInfo() |
| | | const route = useRoute(); |
| | | const router = useRouter(); |
| | | const state = reactive({ |
| | | isShowPassword: false, |
| | | ruleForm: { |
| | | username: '', |
| | | password: '', |
| | | }, |
| | | loading: { |
| | | signIn: false, |
| | | }, |
| | | }); |
| | | // 时间获取 |
| | | const currentTime = computed(() => { |
| | | return formatAxis(new Date()); |
| | | }); |
| | | // 登录 |
| | | const onSignIn = async () => { |
| | | state.loading.signIn = true; |
| | | // 存储 token 到浏览器缓存 |
| | | let res = await useLoginApi().signIn(state.ruleForm) |
| | | if(res.data.code === '200'){ |
| | | userInfo.setUserInfos(res.data.data) |
| | | Session.set('token', res.data.data.accessToken); |
| | | Session.set('projectId',''); |
| | | Session.set('uid',res.data.data.uid); |
| | | signInSuccess(); |
| | | }else{ |
| | | state.loading.signIn = false |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | // Session.set('token', Math.random().toString(36).substr(0)); |
| | | // // 模拟数据,对接接口时,记得删除多余代码及对应依赖的引入。用于 `/src/stores/userInfo.ts` 中不同用户登录判断(模拟数据) |
| | | // Cookies.set('userName', state.ruleForm.username); |
| | | // if (!themeConfig.value.isRequestRoutes) { |
| | | // // 前端控制路由,2、请注意执行顺序 |
| | | // await initFrontEndControlRoutes(); |
| | | // signInSuccess(); |
| | | // } else { |
| | | // // 模拟后端控制路由,isRequestRoutes 为 true,则开启后端控制路由 |
| | | // // 添加完动态路由,再进行 router 跳转,否则可能报错 No match found for location with path "/" |
| | | // await initBackEndControlRoutes(); |
| | | // // 执行完 initBackEndControlRoutes,再执行 signInSuccess |
| | | // signInSuccess(); |
| | | // } |
| | | }; |
| | | // 登录成功后的跳转 |
| | | const signInSuccess = async () => { |
| | | // 初始化登录成功时间问候语 |
| | | let currentTimeInfo = currentTime.value; |
| | | // 登录成功,跳到转首页 |
| | | // 如果是复制粘贴的路径,非首页/登录页,那么登录成功后重定向到对应的路径中 |
| | | if (route.query?.redirect) { |
| | | router.push('/homeMenu'); |
| | | // router.push({ |
| | | // path: <string>route.query?.redirect, |
| | | // query: Object.keys(<string>route.query?.params).length > 0 ? JSON.parse(<string>route.query?.params) : '', |
| | | // }); |
| | | } else { |
| | | router.push('/loginPage'); |
| | | } |
| | | state.loading.signIn = true; |
| | | const signInText = t('message.signInText'); |
| | | ElMessage.success(`${currentTimeInfo},${signInText}`); |
| | | // 登录成功提示 |
| | | // 关闭 loading |
| | | // 添加 loading,防止第一次进入界面时出现短暂空白 |
| | | // NextLoading.start(); |
| | | }; |
| | | return { |
| | | onSignIn, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | name: 'accountLogin', |
| | | setup() { |
| | | const { t } = useI18n(); |
| | | const userInfo = useUserInfo(); |
| | | const route = useRoute(); |
| | | const router = useRouter(); |
| | | const state = reactive({ |
| | | isShowPassword: false, |
| | | ruleForm: { |
| | | username: '', |
| | | password: '' |
| | | }, |
| | | loading: { |
| | | signIn: false |
| | | } |
| | | }); |
| | | // 时间获取 |
| | | const currentTime = computed(() => { |
| | | return formatAxis(new Date()); |
| | | }); |
| | | // 登录 |
| | | const onSignIn = async () => { |
| | | state.loading.signIn = true; |
| | | // 存储 token 到浏览器缓存 |
| | | let res = await useLoginApi().signIn(state.ruleForm); |
| | | if (res.data.code === '200') { |
| | | await userInfo.setUserInfos(res.data.data); |
| | | Session.set('token', res.data.data.accessToken); |
| | | Session.set('projectId', ''); |
| | | Session.set('uid', res.data.data.uid); |
| | | await signInSuccess(); |
| | | } else { |
| | | state.loading.signIn = false; |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | state.loading.signIn = false; |
| | | // Session.set('token', Math.random().toString(36).substr(0)); |
| | | // // 模拟数据,对接接口时,记得删除多余代码及对应依赖的引入。用于 `/src/stores/userInfo.ts` 中不同用户登录判断(模拟数据) |
| | | // Cookies.set('userName', state.ruleForm.username); |
| | | // if (!themeConfig.value.isRequestRoutes) { |
| | | // // 前端控制路由,2、请注意执行顺序 |
| | | // await initFrontEndControlRoutes(); |
| | | // signInSuccess(); |
| | | // } else { |
| | | // // 模拟后端控制路由,isRequestRoutes 为 true,则开启后端控制路由 |
| | | // // 添加完动态路由,再进行 router 跳转,否则可能报错 No match found for location with path "/" |
| | | // await initBackEndControlRoutes(); |
| | | // // 执行完 initBackEndControlRoutes,再执行 signInSuccess |
| | | // signInSuccess(); |
| | | // } |
| | | }; |
| | | // 登录成功后的跳转 |
| | | const signInSuccess = async () => { |
| | | // 初始化登录成功时间问候语 |
| | | let currentTimeInfo = currentTime.value; |
| | | // 登录成功,跳到转首页 |
| | | // 如果是复制粘贴的路径,非首页/登录页,那么登录成功后重定向到对应的路径中 |
| | | if (route.query?.redirect) { |
| | | router.push('/homeMenu'); |
| | | // router.push({ |
| | | // path: <string>route.query?.redirect, |
| | | // query: Object.keys(<string>route.query?.params).length > 0 ? JSON.parse(<string>route.query?.params) : '', |
| | | // }); |
| | | } else { |
| | | router.push('/loginPage'); |
| | | } |
| | | state.loading.signIn = true; |
| | | const signInText = t('message.signInText'); |
| | | ElMessage.success(`${currentTimeInfo},${signInText}`); |
| | | // 登录成功提示 |
| | | // 关闭 loading |
| | | // 添加 loading,防止第一次进入界面时出现短暂空白 |
| | | // NextLoading.start(); |
| | | }; |
| | | return { |
| | | onSignIn, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | .login-content-form { |
| | | margin-top: 40px; |
| | | width: 420px; |
| | | margin-top: 40px; |
| | | width: 420px; |
| | | |
| | | .el-input::v-deep .el-input__wrapper{ |
| | | height: 56px; |
| | | border-radius: 28px; |
| | | padding: 0 30px; |
| | | background: #F2F2F2; |
| | | &:focus-within{ |
| | | border: 1px solid #2053D7; |
| | | } |
| | | } |
| | | @for $i from 1 through 4 { |
| | | .login-animation#{$i} { |
| | | opacity: 0; |
| | | animation-name: error-num; |
| | | animation-duration: 0.5s; |
| | | animation-fill-mode: forwards; |
| | | animation-delay: calc($i/10) + s; |
| | | } |
| | | } |
| | | .codeDeal::v-deep .el-form-item__content{ |
| | | display: flex; |
| | | justify-content: space-between; |
| | | .el-input::v-deep .el-input__wrapper { |
| | | height: 56px; |
| | | border-radius: 28px; |
| | | padding: 0 30px; |
| | | background: #f2f2f2; |
| | | &:focus-within { |
| | | border: 1px solid #2053d7; |
| | | } |
| | | } |
| | | @for $i from 1 through 4 { |
| | | .login-animation#{$i} { |
| | | opacity: 0; |
| | | animation-name: error-num; |
| | | animation-duration: 0.5s; |
| | | animation-fill-mode: forwards; |
| | | animation-delay: calc($i/10) + s; |
| | | } |
| | | } |
| | | .codeDeal::v-deep .el-form-item__content { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | |
| | | .forgetCode{ |
| | | color: #2053D7; |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | .login-content-password { |
| | | width: 100%; |
| | | display: inline-block; |
| | | width: 20px; |
| | | cursor: pointer; |
| | | &:hover { |
| | | color: #909399; |
| | | } |
| | | } |
| | | .login-content-code { |
| | | width: 100%; |
| | | padding: 0; |
| | | font-weight: bold; |
| | | letter-spacing: 5px; |
| | | } |
| | | .login-content-submit { |
| | | width: 100%; |
| | | height: 56px; |
| | | font-size: 16px; |
| | | border-radius: 28px; |
| | | letter-spacing: 4px; |
| | | font-weight: 300; |
| | | margin-top: 15px; |
| | | background: #2053D7; |
| | | transition: .3s; |
| | | &:hover{ |
| | | letter-spacing: 6px; |
| | | background: #4E7AEC; |
| | | } |
| | | } |
| | | .forgetCode { |
| | | color: #2053d7; |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | .login-content-password { |
| | | width: 100%; |
| | | display: inline-block; |
| | | width: 20px; |
| | | cursor: pointer; |
| | | &:hover { |
| | | color: #909399; |
| | | } |
| | | } |
| | | .login-content-code { |
| | | width: 100%; |
| | | padding: 0; |
| | | font-weight: bold; |
| | | letter-spacing: 5px; |
| | | } |
| | | .login-content-submit { |
| | | width: 100%; |
| | | height: 56px; |
| | | font-size: 16px; |
| | | border-radius: 28px; |
| | | letter-spacing: 4px; |
| | | font-weight: 300; |
| | | margin-top: 15px; |
| | | background: #2053d7; |
| | | transition: 0.3s; |
| | | &:hover { |
| | | letter-spacing: 6px; |
| | | background: #4e7aec; |
| | | } |
| | | } |
| | | } |
| | | </style> |
| | |
| | | <template> |
| | | <div class="system-add-dept-container"> |
| | | <el-dialog :title="title" v-model="isShowDialog" width="600px"> |
| | | <el-form :model="departmentForm" size="default" label-width="90px"> |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="上级部门"> |
| | | <el-cascader |
| | | :options="deptData" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | class="w100" |
| | | v-model="departmentForm.parentDepId" |
| | | > |
| | | </el-cascader> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="部门名称"> |
| | | <el-input v-model="departmentForm.depName" placeholder="请输入部门名称" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="部门描述"> |
| | | <el-input v-model="departmentForm.depInfo" type="textarea" placeholder="请输入部门描述" maxlength="150"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="onCancel" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="onSubmit" size="default">确 定</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | <div class="system-add-dept-container"> |
| | | <el-dialog :title="title" v-model="isShowDialog" width="600px"> |
| | | <el-form :model="departmentForm" size="default" label-width="90px"> |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="上级部门"> |
| | | <el-cascader |
| | | :options="deptData" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | class="w100" |
| | | v-model="departmentForm.parentDepId" |
| | | > |
| | | </el-cascader> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="部门名称"> |
| | | <el-input v-model="departmentForm.depName" placeholder="请输入部门名称" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="部门描述"> |
| | | <el-input v-model="departmentForm.depInfo" type="textarea" placeholder="请输入部门描述" maxlength="150"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="onCancel" size="default">取 消</el-button> |
| | | <el-button type="primary" v-throttle @click="onSubmit" size="default">确 定</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { ElMessage } from 'element-plus'; |
| | | import { reactive, toRefs, onMounted, defineComponent } from 'vue'; |
| | | import { departmentApi } from "/@/api/department"; |
| | | import { departmentApi } from '/@/api/department'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableDataRow { |
| | | name:string, |
| | | info:string, |
| | | parentId:string, |
| | | id:number, |
| | | name: string; |
| | | info: string; |
| | | parentId: string; |
| | | id: number; |
| | | } |
| | | interface DeptSate { |
| | | title:string; |
| | | isShowDialog: boolean; |
| | | departmentForm: { |
| | | depName:string, |
| | | depInfo:string, |
| | | parentDepId:string |
| | | }; |
| | | deptData: Array<TableDataRow>; |
| | | title: string; |
| | | isShowDialog: boolean; |
| | | departmentForm: { |
| | | depName: string; |
| | | depInfo: string; |
| | | parentDepId: string; |
| | | }; |
| | | deptData: Array<TableDataRow>; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | | name: 'systemAddDept', |
| | | setup(prop,context) { |
| | | const state = reactive<DeptSate>({ |
| | | title:'', |
| | | isShowDialog: false, |
| | | departmentForm: { |
| | | depName:'', |
| | | parentDepId:'', |
| | | depInfo:'', |
| | | }, |
| | | deptData: [], // 部门数据 |
| | | }); |
| | | // 打开弹窗 |
| | | const openDialog = (type:string, value: any,departmentList: []) => { |
| | | state.isShowDialog = true; |
| | | state.deptData = JSON.parse(JSON.stringify(departmentList)) |
| | | if(type === '新增'){ |
| | | state.title = '新增部门' |
| | | state.departmentForm = { |
| | | depName:'', |
| | | parentDepId:'', |
| | | depInfo:'', |
| | | } |
| | | }else{ |
| | | state.title = '修改部门' |
| | | state.departmentForm = JSON.parse(JSON.stringify(value)) |
| | | } |
| | | }; |
| | | // 关闭弹窗 |
| | | const closeDialog = () => { |
| | | state.isShowDialog = false; |
| | | }; |
| | | // 取消 |
| | | const onCancel = () => { |
| | | closeDialog(); |
| | | }; |
| | | // 新增 |
| | | const onSubmit = async () => { |
| | | if(state.title === '新增部门'){ |
| | | let res = await departmentApi().addDepartment(state.departmentForm) |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'部门新增成功', |
| | | duration:2000 |
| | | }) |
| | | closeDialog(); |
| | | context.emit('getDepartmentList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }else{ |
| | | let res = await departmentApi().modDepartment(state.departmentForm) |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'部门修改成功', |
| | | duration:2000 |
| | | }) |
| | | closeDialog(); |
| | | context.emit('getDepartmentList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | } |
| | | }; |
| | | // 初始化部门数据 |
| | | const initTableData = () => { |
| | | |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initTableData(); |
| | | }); |
| | | return { |
| | | openDialog, |
| | | closeDialog, |
| | | onCancel, |
| | | onSubmit, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | name: 'systemAddDept', |
| | | setup(prop, context) { |
| | | const state = reactive<DeptSate>({ |
| | | title: '', |
| | | isShowDialog: false, |
| | | departmentForm: { |
| | | depName: '', |
| | | parentDepId: '', |
| | | depInfo: '' |
| | | }, |
| | | deptData: [] // 部门数据 |
| | | }); |
| | | // 打开弹窗 |
| | | const openDialog = (type: string, value: any, departmentList: []) => { |
| | | state.isShowDialog = true; |
| | | state.deptData = JSON.parse(JSON.stringify(departmentList)); |
| | | if (type === '新增') { |
| | | state.title = '新增部门'; |
| | | state.departmentForm = { |
| | | depName: '', |
| | | parentDepId: '', |
| | | depInfo: '' |
| | | }; |
| | | } else { |
| | | state.title = '修改部门'; |
| | | state.departmentForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | // 关闭弹窗 |
| | | const closeDialog = () => { |
| | | state.isShowDialog = false; |
| | | }; |
| | | // 取消 |
| | | const onCancel = () => { |
| | | closeDialog(); |
| | | }; |
| | | // 新增 |
| | | const onSubmit = async () => { |
| | | if (state.title === '新增部门') { |
| | | let res = await departmentApi().addDepartment(state.departmentForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '部门新增成功', |
| | | duration: 2000 |
| | | }); |
| | | closeDialog(); |
| | | context.emit('getDepartmentList'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await departmentApi().modDepartment(state.departmentForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '部门修改成功', |
| | | duration: 2000 |
| | | }); |
| | | closeDialog(); |
| | | context.emit('getDepartmentList'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | }; |
| | | // 初始化部门数据 |
| | | const initTableData = () => {}; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initTableData(); |
| | | }); |
| | | return { |
| | | openDialog, |
| | | closeDialog, |
| | | onCancel, |
| | | onSubmit, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | |
| | | <template> |
| | | <div class="system-dic-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <el-input size="default" placeholder="请输入字典名称" style="max-width: 180px"> </el-input> |
| | | <el-button size="default" type="primary" class="ml10"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenAddDic"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增字典 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="tableData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="50" /> |
| | | <el-table-column prop="dicName" label="字典名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="fieldName" label="字段名" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="字典状态" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <el-tag type="success" v-if="scope.row.status">启用</el-tag> |
| | | <el-tag type="info" v-else>禁用</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="describe" label="字典描述" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="100"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenEditDic(scope.row)">修改</el-button> |
| | | <el-button size="small" text type="primary" @click="onRowDel(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="tableData.param.pageNum" |
| | | background |
| | | v-model:page-size="tableData.param.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="tableData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <AddDic ref="addDicRef" /> |
| | | <EditDic ref="editDicRef" /> |
| | | </div> |
| | | <div class="system-dic-container"> |
| | | <el-card shadow="hover"> |
| | | <el-row :gutter="10"> |
| | | <el-col :xs="24" :sm="24" :md="10" :lg="10" :xl="10"> |
| | | <el-card class="box-card"> |
| | | <div class="box-card-header"> |
| | | <span>字典类型</span> |
| | | </div> |
| | | <div class="box-card-body"> |
| | | <div class="box-card-body-filter"> |
| | | <el-input class="input-box" placeholder="输入名称" @keyup.enter.native="queryHandle('dictionaryType')" /> |
| | | <el-button type="success" @click="showCreateHandle('dictionaryType')">新增</el-button> |
| | | <el-button type="primary" @click="showCreateHandle('dictionaryType')">搜索</el-button> |
| | | </div> |
| | | <div class="table-content"> |
| | | <el-table :data="tableData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="50" /> |
| | | <el-table-column prop="dicName" label="字典名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="fieldName" label="字段名" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="describe" label="字典描述" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="100"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenEditDic(scope.row)">修改</el-button> |
| | | <el-button size="small" text type="primary" @click="onRowDel(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="page-position" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="tableData.param.pageNum" |
| | | background |
| | | v-model:page-size="tableData.param.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="tableData.total" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="14"> |
| | | <el-card class="box-card"> |
| | | <div class="box-card-header"> |
| | | <span>字典详情 </span> |
| | | </div> |
| | | <div class="box-card-body"> |
| | | <div class="box-card-body-filter"> |
| | | <el-input class="input-box" placeholder="输入名称" @keyup.enter.native="queryHandle('dictionaryType')" /> |
| | | <el-button type="success" @click="showCreateHandle('dictionaryType')">新增</el-button> |
| | | <el-button type="primary" @click="showCreateHandle('dictionaryType')">搜索</el-button> |
| | | </div> |
| | | <div class="table-content"> |
| | | <el-table :data="tableData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="50" /> |
| | | <el-table-column prop="dicName" label="字典名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="fieldName" label="字段名" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="describe" label="字典描述" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="createTime" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="100"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenEditDic(scope.row)">修改</el-button> |
| | | <el-button size="small" text type="primary" @click="onRowDel(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="page-position" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="tableData.param.pageNum" |
| | | background |
| | | v-model:page-size="tableData.param.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="tableData.total" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </div> |
| | | </div> |
| | | </el-card> |
| | | </el-col> |
| | | </el-row> |
| | | </el-card> |
| | | <AddDic ref="addDicRef" /> |
| | | <EditDic ref="editDicRef" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableDataRow { |
| | | dicName: string; |
| | | fieldName: string; |
| | | describe: string; |
| | | status: boolean; |
| | | createTime: string; |
| | | dicName: string; |
| | | fieldName: string; |
| | | describe: string; |
| | | status: boolean; |
| | | createTime: string; |
| | | } |
| | | interface TableDataState { |
| | | tableData: { |
| | | data: Array<TableDataRow>; |
| | | total: number; |
| | | loading: boolean; |
| | | param: { |
| | | pageNum: number; |
| | | pageSize: number; |
| | | }; |
| | | }; |
| | | tableData: { |
| | | data: Array<TableDataRow>; |
| | | total: number; |
| | | loading: boolean; |
| | | param: { |
| | | pageNum: number; |
| | | pageSize: number; |
| | | }; |
| | | }; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | | name: 'systemDic', |
| | | components: { AddDic, EditDic }, |
| | | setup() { |
| | | const addDicRef = ref(); |
| | | const editDicRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | tableData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | param: { |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | }, |
| | | }, |
| | | }); |
| | | // 初始化表格数据 |
| | | const initTableData = () => { |
| | | const data: Array<TableDataRow> = []; |
| | | for (let i = 0; i < 2; i++) { |
| | | data.push({ |
| | | dicName: i === 0 ? '角色标识' : '用户性别', |
| | | fieldName: i === 0 ? 'SYS_ROLE' : 'SYS_UERINFO', |
| | | describe: i === 0 ? '这是角色字典' : '这是用户性别字典', |
| | | status: true, |
| | | createTime: new Date().toLocaleString(), |
| | | }); |
| | | } |
| | | state.tableData.data = data; |
| | | state.tableData.total = state.tableData.data.length; |
| | | }; |
| | | // 打开新增字典弹窗 |
| | | const onOpenAddDic = () => { |
| | | addDicRef.value.openDialog(); |
| | | }; |
| | | // 打开修改字典弹窗 |
| | | const onOpenEditDic = (row: TableDataRow) => { |
| | | editDicRef.value.openDialog(row); |
| | | }; |
| | | // 删除字典 |
| | | const onRowDel = (row: TableDataRow) => { |
| | | ElMessageBox.confirm(`此操作将永久删除字典名称:“${row.dicName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }) |
| | | .then(() => { |
| | | ElMessage.success('删除成功'); |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.tableData.param.pageSize = val; |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.tableData.param.pageNum = val; |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initTableData(); |
| | | }); |
| | | return { |
| | | addDicRef, |
| | | editDicRef, |
| | | onOpenAddDic, |
| | | onOpenEditDic, |
| | | onRowDel, |
| | | onHandleSizeChange, |
| | | onHandleCurrentChange, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | name: 'systemDic', |
| | | components: { AddDic, EditDic }, |
| | | setup() { |
| | | const addDicRef = ref(); |
| | | const editDicRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | tableData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | param: { |
| | | pageNum: 1, |
| | | pageSize: 10 |
| | | } |
| | | } |
| | | }); |
| | | // 初始化表格数据 |
| | | const initTableData = () => { |
| | | const data: Array<TableDataRow> = []; |
| | | for (let i = 0; i < 2; i++) { |
| | | data.push({ |
| | | dicName: i === 0 ? '角色标识' : '用户性别', |
| | | fieldName: i === 0 ? 'SYS_ROLE' : 'SYS_UERINFO', |
| | | describe: i === 0 ? '这是角色字典' : '这是用户性别字典', |
| | | status: true, |
| | | createTime: new Date().toLocaleString() |
| | | }); |
| | | } |
| | | state.tableData.data = data; |
| | | state.tableData.total = state.tableData.data.length; |
| | | }; |
| | | // 打开新增字典弹窗 |
| | | const onOpenAddDic = () => { |
| | | addDicRef.value.openDialog(); |
| | | }; |
| | | // 打开修改字典弹窗 |
| | | const onOpenEditDic = (row: TableDataRow) => { |
| | | editDicRef.value.openDialog(row); |
| | | }; |
| | | // 删除字典 |
| | | const onRowDel = (row: TableDataRow) => { |
| | | ElMessageBox.confirm(`此操作将永久删除字典名称:“${row.dicName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(() => { |
| | | ElMessage.success('删除成功'); |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.tableData.param.pageSize = val; |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.tableData.param.pageNum = val; |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initTableData(); |
| | | }); |
| | | return { |
| | | addDicRef, |
| | | editDicRef, |
| | | onOpenAddDic, |
| | | onOpenEditDic, |
| | | onRowDel, |
| | | onHandleSizeChange, |
| | | onHandleCurrentChange, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | | <style scoped lang="scss"> |
| | | .box-card { |
| | | padding: 0 !important; |
| | | .box-card-header { |
| | | padding-bottom: 18px; |
| | | border-bottom: 1px solid #ebeef5; |
| | | -webkit-box-sizing: border-box; |
| | | box-sizing: border-box; |
| | | font-size: 16px; |
| | | width: 100%; |
| | | } |
| | | .box-card-body { |
| | | padding-top: 18px; |
| | | } |
| | | } |
| | | </style> |
| | |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="菜单名称"> |
| | | <el-input v-model="ruleForm.meta.title" placeholder="格式:message.router.xxx" clearable></el-input> |
| | | <el-input v-model.trim="ruleForm.meta.title" placeholder="格式:message.router.xxx" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="路由名称"> |
| | | <el-input v-model="ruleForm.name" placeholder="路由中的 name 值" clearable></el-input> |
| | | <el-input v-model.trim="ruleForm.name" placeholder="路由中的 name 值" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="路由路径"> |
| | | <el-input v-model="ruleForm.path" placeholder="路由中的 path 值" clearable></el-input> |
| | | <el-input v-model.trim="ruleForm.path" placeholder="路由中的 path 值" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="重定向"> |
| | | <el-input v-model="ruleForm.redirect" placeholder="请输入路由重定向" clearable></el-input> |
| | | <el-input v-model.trim="ruleForm.redirect" placeholder="请输入路由重定向" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="菜单图标"> |
| | | <el-input placeholder="请输入菜单图标" v-model="ruleForm.meta.icon" type="all" /> |
| | | <!-- <IconSelector placeholder="请输入菜单图标" v-model="ruleForm.meta.icon" type="all" />--> |
| | | <el-input placeholder="请输入菜单图标" v-model.trim="ruleForm.meta.icon" type="all" /> |
| | | <IconSelector placeholder="请输入菜单图标" v-model="ruleForm.meta.icon" type="all" /> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="组件路径"> |
| | | <el-input v-model="ruleForm.component" placeholder="组件路径" clearable></el-input> |
| | | <el-input v-model.trim="ruleForm.component" placeholder="组件路径" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="权限标识"> |
| | | <el-select v-model="ruleForm.meta.roles" multiple placeholder="取角色管理" clearable class="w100"> |
| | | <el-option label="admin" value="admin"></el-option> |
| | | <el-option label="common" value="common"></el-option> |
| | | <el-option v-for="item in roleList" :key="item.roleId" :value="item.roleCode" :label="item.roleName"></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="onCancel" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="onSubmit" size="default">{{ buttonName }}</el-button> |
| | | <el-button type="primary" v-throttle @click="onSubmit" size="default">{{ buttonName }}</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | |
| | | }, |
| | | btnPower: '' // 菜单类型为按钮时,权限标识 |
| | | }, |
| | | roleList: [], |
| | | menuData: [], // 上级菜单数据 |
| | | projectList: [] |
| | | }); |
| | |
| | | return arr; |
| | | }; |
| | | // 打开弹窗 |
| | | const openDialog = (type: string, value: any, projectList: any, projectId: string) => { |
| | | const openDialog = (type: string, value: any, projectList: any, projectId: string, roleList: []) => { |
| | | state.projectList = JSON.parse(JSON.stringify(projectList)); |
| | | state.roleList = roleList; |
| | | state.isShowDialog = true; |
| | | if (type === '新增') { |
| | | state.buttonName = '新增'; |
| | |
| | | <template> |
| | | <div class="system-menu-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-menu-search mb15"> |
| | | <el-select size="default" v-model="projectId" placeholder="请选择项目名称" style="max-width: 180px" @change="getMenuList()"> |
| | | <el-option |
| | | v-for="item in projectList" |
| | | :key="item.key" |
| | | :value="item.id" |
| | | :label="item.name" |
| | | > |
| | | </el-option> |
| | | </el-select> |
| | | <el-button size="default" type="primary" class="ml10" @click="getMenuList"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenMenuDialog('新增')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增菜单 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="menuTableData" style="width: 100%" row-key="path" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"> |
| | | <el-table-column label="菜单名称" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <SvgIcon :name="scope.row.meta.icon" /> |
| | | <span class="ml10">{{ scope.row.meta.title }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="path" label="路由路径" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="组件路径" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <span>{{ scope.row.component }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="权限标识" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <span>{{ scope.row.meta.roles }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="排序" show-overflow-tooltip width="80"> |
| | | <template #default="scope"> |
| | | {{ scope.$index }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="类型" show-overflow-tooltip width="80"> |
| | | <template #default="scope"> |
| | | <el-tag type="success" size="small">{{ scope.row.xx }}菜单</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" show-overflow-tooltip width="140"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenMenuDialog('新增')">新增</el-button> |
| | | <el-button size="small" text type="primary" @click="onOpenMenuDialog('修改',scope.row)">修改</el-button> |
| | | <el-button size="small" text type="primary" @click="deleteMenu(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-card> |
| | | <menuDialog ref="menuDialog" @getMenuList="getMenuList"/> |
| | | </div> |
| | | <div class="system-menu-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-menu-search mb15"> |
| | | <el-select size="default" v-model="projectId" placeholder="请选择项目名称" style="max-width: 180px" @change="getMenuList()"> |
| | | <el-option v-for="item in projectList" :key="item.key" :value="item.id" :label="item.name"> </el-option> |
| | | </el-select> |
| | | <el-button size="default" type="primary" class="ml10" @click="getMenuList"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenMenuDialog('新增')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增菜单 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="menuTableData" style="width: 100%" row-key="path" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"> |
| | | <el-table-column label="菜单名称" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <SvgIcon :name="scope.row.meta.icon" /> |
| | | <span class="ml10">{{ scope.row.meta.title }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="path" label="路由路径" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="组件路径" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <span>{{ scope.row.component }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="权限标识" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <span>{{ parseRole(scope.row.meta.roles) }}</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="排序" show-overflow-tooltip width="80"> |
| | | <template #default="scope"> |
| | | {{ scope.$index }} |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="类型" show-overflow-tooltip width="80"> |
| | | <template #default="scope"> |
| | | <el-tag type="success" size="small">{{ scope.row.xx }}菜单</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="操作" show-overflow-tooltip width="140"> |
| | | <template #default="scope"> |
| | | <el-button size="small" text type="primary" @click="onOpenMenuDialog('新增')">新增</el-button> |
| | | <el-button size="small" text type="primary" @click="onOpenMenuDialog('修改', scope.row)">修改</el-button> |
| | | <el-button size="small" text type="primary" @click="deleteMenu(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | </el-card> |
| | | <menuDialog ref="menuDialog" @getMenuList="getMenuList" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { ref, toRefs, reactive, computed, onMounted, defineComponent } from 'vue'; |
| | | import { RouteRecordRaw } from 'vue-router'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import { storeToRefs } from 'pinia'; |
| | | import { useRoutesList } from '/@/stores/routesList'; |
| | | import menuDialog from '/@/views/system/menu/component/menuDialog.vue'; |
| | | import {useMenuApi} from "/@/api/menu"; |
| | | import {Session} from "/@/utils/storage"; |
| | | import pinia from "/@/stores"; |
| | | import {dynamicRoutes} from "/@/router/route"; |
| | | import {useUserInfo} from "/@/stores/userInfo"; |
| | | import {initBackEndControlRoutes} from "/@/router/backEnd"; |
| | | import { ref, toRefs, reactive, computed, onMounted, defineComponent } from 'vue'; |
| | | import { RouteRecordRaw } from 'vue-router'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import { storeToRefs } from 'pinia'; |
| | | import { useRoutesList } from '/@/stores/routesList'; |
| | | import menuDialog from '/@/views/system/menu/component/menuDialog.vue'; |
| | | import { useMenuApi } from '/@/api/menu'; |
| | | import { Session } from '/@/utils/storage'; |
| | | import pinia from '/@/stores'; |
| | | import { dynamicRoutes } from '/@/router/route'; |
| | | import { useUserInfo } from '/@/stores/userInfo'; |
| | | import { initBackEndControlRoutes } from '/@/router/backEnd'; |
| | | import { useRoleApi } from '/@/api/role'; |
| | | |
| | | export default defineComponent({ |
| | | name: 'systemMenu', |
| | | components: { menuDialog }, |
| | | setup() { |
| | | const menuDialog = ref(); |
| | | const storesRoutesList = useRoutesList(); |
| | | const state = reactive({ |
| | | projectId:'1', |
| | | menuData:[], |
| | | menuTableData:[], |
| | | projectList:[ |
| | | {id:'1',name:'基础数据权限管理系统',key:0}, |
| | | {id:'2',name:'双重预防系统',key:1}, |
| | | {id:'3',name:'系统2',key:2}, |
| | | {id:'4',name:'系统3',key:3}, |
| | | {id:'5',name:'系统4',key:4}, |
| | | {id:'6',name:'应急管理系统',key:5}, |
| | | {id:'7',name:'目标责任管理系统',key:6}, |
| | | {id:'8',name:'事故管理系统',key:7}, |
| | | {id:'9',name:'设备综合管控系统',key:8}, |
| | | ], |
| | | }); |
| | | // // 获取 vuex 中的路由 |
| | | // const menuTableData = computed(() => { |
| | | // return routesList.value; |
| | | // }); |
| | | // 打开新增菜单弹窗 |
| | | const onOpenMenuDialog = (type: string,value: any) => { |
| | | menuDialog.value.openDialog(type,value,state.projectList,state.projectId); |
| | | }; |
| | | // 打开编辑菜单弹窗 |
| | | // 删除当前行 |
| | | const deleteMenu = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除路由:${row.path}, 是否继续?`, '提示', { |
| | | confirmButtonText: '删除', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }).then(async () => { |
| | | let res = await useMenuApi().deleteMenu({id:row.id}) |
| | | if(res.data.code ==='200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | duration:2000, |
| | | message:'删除成功' |
| | | }) |
| | | await getMenuList() |
| | | if(Session.get('projectId') == state.projectId) await initBackEndControlRoutes() |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }).catch(() => {}); |
| | | }; |
| | | const getMenuList = async () => { |
| | | let res = await useMenuApi().getMenuAdmin(state.projectId) |
| | | if(res.data.code === '200'){ |
| | | state.menuTableData = res.data.data |
| | | if(Session.get('projectId') == state.projectId) await initBackEndControlRoutes() |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }; |
| | | export default defineComponent({ |
| | | name: 'systemMenu', |
| | | components: { menuDialog }, |
| | | filters: { |
| | | parseRole: (roles: Array<string>) => { |
| | | return ['1', '2']; |
| | | } |
| | | }, |
| | | setup() { |
| | | const menuDialog = ref(); |
| | | const storesRoutesList = useRoutesList(); |
| | | const state = reactive({ |
| | | projectId: '1', |
| | | menuData: [], |
| | | roleList: [], |
| | | menuTableData: [], |
| | | projectList: [ |
| | | { id: '1', name: '基础数据权限管理系统', key: 0 }, |
| | | { id: '2', name: '双重预防系统', key: 1 }, |
| | | { id: '3', name: '特殊作业系统', key: 2 }, |
| | | { id: '4', name: '智能巡检系统', key: 3 }, |
| | | { id: '5', name: '安全风险综合预警预报平台', key: 4 }, |
| | | { id: '6', name: '应急管理系统', key: 5 }, |
| | | { id: '7', name: '目标责任管理系统', key: 6 }, |
| | | { id: '8', name: '事故管理系统', key: 7 }, |
| | | { id: '9', name: '设备综合管控系统', key: 8 }, |
| | | { id: '10', name: '安全知识图谱系统', key: 9 }, |
| | | { id: '11', name: '危险化学品全生命周期安全', key: 10 } |
| | | ] |
| | | }); |
| | | // // 获取 vuex 中的路由 |
| | | // const menuTableData = computed(() => { |
| | | // return routesList.value; |
| | | // }); |
| | | // 打开新增菜单弹窗 |
| | | const onOpenMenuDialog = (type: string, value: any) => { |
| | | menuDialog.value.openDialog(type, value, state.projectList, state.projectId, state.roleList); |
| | | }; |
| | | |
| | | const getProjectList = async () => { |
| | | let res = await useMenuApi().getProjectList() |
| | | if(res.data.code === '200'){ |
| | | state.menuTableData = res.data.data |
| | | if(Session.get('projectId') == state.projectId) await initBackEndControlRoutes() |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }; |
| | | // 删除当前行 |
| | | const deleteMenu = (row: any) => { |
| | | ElMessageBox.confirm(`此操作将永久删除路由:${row.path}, 是否继续?`, '提示', { |
| | | confirmButtonText: '删除', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(async () => { |
| | | let res = await useMenuApi().deleteMenu({ id: row.id }); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | duration: 2000, |
| | | message: '删除成功' |
| | | }); |
| | | await getMenuList(); |
| | | if (Session.get('projectId') == state.projectId) await initBackEndControlRoutes(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | const getMenuList = async () => { |
| | | let res = await useMenuApi().getMenuAdmin(state.projectId); |
| | | if (res.data.code === '200') { |
| | | state.menuTableData = res.data.data; |
| | | if (Session.get('projectId') == state.projectId) await initBackEndControlRoutes(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | onMounted( () => { |
| | | getMenuList() |
| | | }); |
| | | return { |
| | | getMenuList, |
| | | menuDialog, |
| | | onOpenMenuDialog, |
| | | deleteMenu, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | }); |
| | | const getRoleList = async () => { |
| | | let res = await useRoleApi().getRoleList(); |
| | | if (res.data.code === '200') { |
| | | state.roleList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const getProjectList = async () => { |
| | | let res = await useMenuApi().getProjectList(); |
| | | if (res.data.code === '200') { |
| | | state.menuTableData = res.data.data; |
| | | if (Session.get('projectId') == state.projectId) await initBackEndControlRoutes(); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const parseRole = (roles: Array<string>) => { |
| | | let role = roles.map((item) => { |
| | | for (let i in state.roleList) { |
| | | if (state.roleList[i].roleCode === item) { |
| | | return state.roleList[i].roleName; |
| | | } |
| | | } |
| | | }); |
| | | return role; |
| | | }; |
| | | |
| | | onMounted(() => { |
| | | getMenuList(); |
| | | getRoleList(); |
| | | }); |
| | | return { |
| | | parseRole, |
| | | getMenuList, |
| | | menuDialog, |
| | | onOpenMenuDialog, |
| | | deleteMenu, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | |
| | | <template> |
| | | <div class="system-add-role-container"> |
| | | <el-dialog :title="title" v-model="isShowRoleDialog" width="769px"> |
| | | <el-form :model="roleForm" size="default" label-width="90px"> |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="角色名称"> |
| | | <el-input v-model="roleForm.roleName" placeholder="请输入角色名称" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="角色标识"> |
| | | <el-input v-model="roleForm.roleCode" placeholder="请输入角色标识" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="角色描述"> |
| | | <el-input v-model="roleForm.roleInfo" type="textarea" placeholder="请输入角色描述" maxlength="150"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowRoleDialog = !isShowRoleDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="onSubmit" size="default">{{ buttonName }}</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | <div class="system-add-role-container"> |
| | | <el-dialog :title="title" v-model="isShowRoleDialog" width="769px"> |
| | | <el-form :model="roleForm" size="default" label-width="90px"> |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="角色名称"> |
| | | <el-input v-model="roleForm.roleName" placeholder="请输入角色名称" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="角色标识"> |
| | | <el-input v-model="roleForm.roleCode" placeholder="请输入角色标识" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb20"> |
| | | <el-form-item label="角色描述"> |
| | | <el-input v-model="roleForm.roleInfo" type="textarea" placeholder="请输入角色描述" maxlength="150"></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowRoleDialog = !isShowRoleDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="onSubmit" v-throttle size="default">{{ buttonName }}</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { ElMessage } from 'element-plus'; |
| | | import { reactive, toRefs, defineComponent } from 'vue'; |
| | | import {useRoleApi} from "/@/api/role"; |
| | | import { useRoleApi } from '/@/api/role'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface MenuDataTree { |
| | | id: number; |
| | | label: string; |
| | | children?: MenuDataTree[]; |
| | | id: number; |
| | | label: string; |
| | | children?: MenuDataTree[]; |
| | | } |
| | | interface RoleState { |
| | | title:string, |
| | | buttonName:string, |
| | | isShowRoleDialog: boolean; |
| | | roleForm: { |
| | | roleName: string; |
| | | title: string; |
| | | buttonName: string; |
| | | isShowRoleDialog: boolean; |
| | | roleForm: { |
| | | roleName: string; |
| | | roleCode: string; |
| | | roleInfo: string; |
| | | }; |
| | | menuData: Array<MenuDataTree>; |
| | | menuProps: { |
| | | children: string; |
| | | label: string; |
| | | }; |
| | | }; |
| | | menuData: Array<MenuDataTree>; |
| | | menuProps: { |
| | | children: string; |
| | | label: string; |
| | | }; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | | name: 'systemAddRole', |
| | | setup(prop,context) { |
| | | const state = reactive<RoleState>({ |
| | | isShowRoleDialog: false, |
| | | title:'', |
| | | buttonName:'', |
| | | roleForm: { |
| | | name: 'systemAddRole', |
| | | setup(prop, context) { |
| | | const state = reactive<RoleState>({ |
| | | isShowRoleDialog: false, |
| | | title: '', |
| | | buttonName: '', |
| | | roleForm: { |
| | | roleName: '', // 角色名称 |
| | | roleCode: '', // 角色标识 |
| | | roleInfo: '', // 排序 |
| | | }, |
| | | menuData: [], |
| | | menuProps: { |
| | | children: 'children', |
| | | label: 'label', |
| | | }, |
| | | }); |
| | | // 打开弹窗 |
| | | const openDialog = (type: string, value: any) => { |
| | | state.isShowRoleDialog = true; |
| | | if(type === '新增'){ |
| | | state.title = '新增角色' |
| | | state.buttonName = '新增' |
| | | state.roleForm = { |
| | | roleName:'', |
| | | roleCode:'', |
| | | roleInfo:'', |
| | | } |
| | | }else{ |
| | | state.title = '修改角色' |
| | | state.buttonName = '修改' |
| | | state.roleForm = JSON.parse(JSON.stringify(value)) |
| | | } |
| | | }; |
| | | // 新增 |
| | | const onSubmit = async () => { |
| | | if(state.title === '新增角色'){ |
| | | let res = await useRoleApi().addRole(state.roleForm) |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'角色新增成功', |
| | | duration:2000 |
| | | }) |
| | | state.isShowRoleDialog = false |
| | | context.emit('refreshRoleList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }else{ |
| | | let res = await useRoleApi().modRole(state.roleForm) |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'角色修改成功', |
| | | duration:2000 |
| | | }) |
| | | state.isShowRoleDialog = false |
| | | context.emit('refreshRoleList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | } |
| | | }; |
| | | // 获取菜单结构数据 |
| | | return { |
| | | onSubmit, |
| | | openDialog, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | roleInfo: '' // 排序 |
| | | }, |
| | | menuData: [], |
| | | menuProps: { |
| | | children: 'children', |
| | | label: 'label' |
| | | } |
| | | }); |
| | | // 打开弹窗 |
| | | const openDialog = (type: string, value: any) => { |
| | | state.isShowRoleDialog = true; |
| | | if (type === '新增') { |
| | | state.title = '新增角色'; |
| | | state.buttonName = '新增'; |
| | | state.roleForm = { |
| | | roleName: '', |
| | | roleCode: '', |
| | | roleInfo: '' |
| | | }; |
| | | } else { |
| | | state.title = '修改角色'; |
| | | state.buttonName = '修改'; |
| | | state.roleForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | // 新增 |
| | | const onSubmit = async () => { |
| | | if (state.title === '新增角色') { |
| | | let res = await useRoleApi().addRole(state.roleForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '角色新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowRoleDialog = false; |
| | | context.emit('refreshRoleList'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await useRoleApi().modRole(state.roleForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '角色修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowRoleDialog = false; |
| | | context.emit('refreshRoleList'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | }; |
| | | // 获取菜单结构数据 |
| | | return { |
| | | onSubmit, |
| | | openDialog, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | | |
| | | <style scoped lang="scss"> |
| | | .system-add-role-container { |
| | | .menu-data-tree { |
| | | width: 100%; |
| | | border: 1px solid var(--el-border-color); |
| | | border-radius: var(--el-input-border-radius, var(--el-border-radius-base)); |
| | | padding: 5px; |
| | | } |
| | | .menu-data-tree { |
| | | width: 100%; |
| | | border: 1px solid var(--el-border-color); |
| | | border-radius: var(--el-input-border-radius, var(--el-border-radius-base)); |
| | | padding: 5px; |
| | | } |
| | | } |
| | | </style> |
| | |
| | | <template> |
| | | <div class="system-add-user-container"> |
| | | <el-dialog :title="title" v-model="isShowUserDialog" width="769px"> |
| | | <el-form :model="userForm" size="default" label-width="90px"> |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="账户名称"> |
| | | <el-input v-model="userForm.username" placeholder="请输入账户名称" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="用户昵称"> |
| | | <el-input v-model="userForm.realName" placeholder="请输入用户昵称" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="关联角色"> |
| | | <el-select v-model="userForm.roleId" placeholder="请选择" clearable class="w100"> |
| | | <el-option |
| | | v-for="item in roleData" |
| | | :key="item.id" |
| | | :label="item.name" |
| | | :value="item.id" |
| | | > |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="部门"> |
| | | <el-cascader |
| | | :options="departmentData" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'id', label: 'name' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | class="w100" |
| | | v-model="userForm.depId" |
| | | > |
| | | </el-cascader> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="手机号"> |
| | | <el-input v-model="userForm.phone" placeholder="请输入手机号" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="邮箱"> |
| | | <el-input v-model="userForm.email" placeholder="请输入" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="性别"> |
| | | <el-select v-model="userForm.sex" placeholder="请选择" clearable class="w100"> |
| | | <el-option |
| | | v-for="item in sexList" |
| | | :key="item.id" |
| | | :value="item.id" |
| | | :label="item.name" |
| | | > |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="账户密码"> |
| | | <el-input v-model="userForm.password" placeholder="请输入" type="password" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="账户过期"> |
| | | <el-date-picker v-model="userForm.expireTime" type="date" placeholder="请选择" class="w100"> </el-date-picker> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">--> |
| | | <!-- <el-form-item label="用户状态">--> |
| | | <!-- <el-switch v-model="userForm.status" inline-prompt active-value = 1 inactive-value= 0 active-text="启" inactive-text="禁"></el-switch>--> |
| | | <!-- </el-form-item>--> |
| | | <!-- </el-col>--> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowUserDialog = !isShowUserDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" @click="onSubmit" size="default">新 增</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | <div class="system-add-user-container"> |
| | | <el-dialog :title="title" v-model="isShowUserDialog" width="769px"> |
| | | <el-form :model="userForm" size="default" label-width="90px"> |
| | | <el-row :gutter="35"> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="账户名称"> |
| | | <el-input v-model="userForm.username" placeholder="请输入账户名称" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="用户昵称"> |
| | | <el-input v-model="userForm.realName" placeholder="请输入用户昵称" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="关联角色"> |
| | | <el-select v-model="userForm.roleId" placeholder="请选择" clearable class="w100"> |
| | | <el-option v-for="item in roleData" :key="item.roleId" :label="item.roleName" :value="item.roleId"> </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="部门"> |
| | | <el-cascader |
| | | :options="departmentData" |
| | | :props="{ emitPath: false, checkStrictly: true, value: 'depId', label: 'depName' }" |
| | | placeholder="请选择部门" |
| | | clearable |
| | | class="w100" |
| | | v-model="userForm.depId" |
| | | > |
| | | </el-cascader> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="手机号"> |
| | | <el-input v-model="userForm.phone" placeholder="请输入手机号" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="身份证"> |
| | | <el-input v-model="userForm.identify" placeholder="请输入身份证" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="邮箱"> |
| | | <el-input v-model="userForm.email" placeholder="请输入" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="性别"> |
| | | <el-select v-model="userForm.gender" placeholder="请选择" clearable class="w100"> |
| | | <el-option v-for="item in sexList" :key="item.id" :value="item.id" :label="item.name"> </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="账户密码"> |
| | | <el-input v-model="userForm.password" placeholder="请输入" type="password" clearable></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20"> |
| | | <el-form-item label="账户过期"> |
| | | <el-date-picker v-model="userForm.expireTime" type="date" placeholder="请选择" class="w100"> </el-date-picker> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">--> |
| | | <!-- <el-form-item label="用户状态">--> |
| | | <!-- <el-switch v-model="userForm.status" inline-prompt active-value = 1 inactive-value= 0 active-text="启" inactive-text="禁"></el-switch>--> |
| | | <!-- </el-form-item>--> |
| | | <!-- </el-col>--> |
| | | </el-row> |
| | | </el-form> |
| | | <template #footer> |
| | | <span class="dialog-footer"> |
| | | <el-button @click="isShowUserDialog = !isShowUserDialog" size="default">取 消</el-button> |
| | | <el-button type="primary" v-throttle @click="onSubmit" size="default">新 增</el-button> |
| | | </span> |
| | | </template> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { reactive, toRefs, onMounted, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import {userApi} from "/@/api/user"; |
| | | import { userApi } from '/@/api/user'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface DeptData { |
| | | } |
| | | interface roleData{ |
| | | |
| | | } |
| | | interface sexData{ |
| | | |
| | | } |
| | | interface DeptData {} |
| | | interface roleData {} |
| | | interface sexData {} |
| | | interface UserState { |
| | | title:string, |
| | | isShowUserDialog: boolean; |
| | | userForm: { |
| | | username: string; |
| | | realName: string; |
| | | roleId: number | null; |
| | | depId: number | null; |
| | | phone: string; |
| | | email: string; |
| | | sex: number | null; |
| | | password: string; |
| | | expireTime: string; |
| | | status: number; |
| | | }; |
| | | departmentData: Array<DeptData>; |
| | | roleData: Array<roleData>; |
| | | sexList:Array<sexData>, |
| | | title: string; |
| | | isShowUserDialog: boolean; |
| | | userForm: { |
| | | username: string; |
| | | realName: string; |
| | | roleId: number | null; |
| | | depId: number | null; |
| | | phone: string; |
| | | email: string; |
| | | gender: number | null; |
| | | password: string; |
| | | expireTime: string; |
| | | status: number; |
| | | identify: string; |
| | | }; |
| | | departmentData: Array<DeptData>; |
| | | roleData: Array<roleData>; |
| | | sexList: Array<sexData>; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | | name: 'user', |
| | | setup(props,context) { |
| | | const state = reactive<UserState>({ |
| | | title:'', |
| | | isShowUserDialog: false, |
| | | userForm: { |
| | | username: '', // 账户名称 |
| | | realName: '', // 用户昵称 |
| | | roleId: null, // 关联角色 |
| | | depId:null, // 部门 |
| | | phone: '', // 手机号 |
| | | email: '', // 邮箱 |
| | | sex: null, // 性别 |
| | | password: '', // 账户密码 |
| | | expireTime: '', // 账户过期 |
| | | status: 1, // 用户状态 |
| | | }, |
| | | departmentData: [], // 部门数据 |
| | | roleData:[],//角色数据 |
| | | sexList:[{id:1,name:'男'},{id:0,name:'女'}] |
| | | }); |
| | | // 打开弹窗 |
| | | const openDialog = (type: string,value: any,departmentList:[], roleList: []) => { |
| | | state.isShowUserDialog = true; |
| | | state.departmentData = departmentList; |
| | | state.roleData = roleList; |
| | | if(type === '新增'){ |
| | | state.title = '新增用户' |
| | | state.userForm = { |
| | | username: '', |
| | | realName: '', |
| | | roleId: null, |
| | | depId: null, |
| | | phone: '', |
| | | email: '', |
| | | sex: null, |
| | | password: '', |
| | | expireTime: '', |
| | | status: 1, |
| | | } |
| | | }else{ |
| | | state.title = '修改用户' |
| | | state.userForm = JSON.parse(JSON.stringify(value)) |
| | | } |
| | | }; |
| | | name: 'user', |
| | | setup(props, context) { |
| | | const state = reactive<UserState>({ |
| | | title: '', |
| | | isShowUserDialog: false, |
| | | userForm: { |
| | | username: '', // 账户名称 |
| | | realName: '', // 用户昵称 |
| | | roleId: null, // 关联角色 |
| | | depId: null, // 部门 |
| | | phone: '', // 手机号 |
| | | email: '', // 邮箱 |
| | | identify: '', |
| | | gender: null, // 性别 |
| | | password: '', // 账户密码 |
| | | expireTime: '', // 账户过期 |
| | | status: 1 // 用户状态 |
| | | }, |
| | | departmentData: [], // 部门数据 |
| | | roleData: [], //角色数据 |
| | | sexList: [ |
| | | { id: 1, name: '男' }, |
| | | { id: 0, name: '女' } |
| | | ] |
| | | }); |
| | | // 打开弹窗 |
| | | const openDialog = (type: string, value: any, departmentList: [], roleList: []) => { |
| | | state.isShowUserDialog = true; |
| | | state.departmentData = departmentList; |
| | | state.roleData = roleList; |
| | | if (type === '新增') { |
| | | state.title = '新增用户'; |
| | | state.userForm = { |
| | | username: '', |
| | | realName: '', |
| | | roleId: null, |
| | | depId: null, |
| | | phone: '', |
| | | email: '', |
| | | identify: '', |
| | | gender: null, |
| | | password: '', |
| | | expireTime: '', |
| | | status: 1 |
| | | }; |
| | | } else { |
| | | state.title = '修改用户'; |
| | | state.userForm = JSON.parse(JSON.stringify(value)); |
| | | } |
| | | }; |
| | | |
| | | // 新增修改 |
| | | const onSubmit = async () => { |
| | | if (state.title === '新增用户') { |
| | | let res = await userApi().addUser(state.userForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '用户新增成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowUserDialog = false; |
| | | context.emit('getUserList'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } else { |
| | | let res = await userApi().modUser(state.userForm); |
| | | if (res.data.code === '200') { |
| | | ElMessage({ |
| | | type: 'success', |
| | | message: '用户修改成功', |
| | | duration: 2000 |
| | | }); |
| | | state.isShowUserDialog = false; |
| | | context.emit('getUserList'); |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | } |
| | | }; |
| | | |
| | | // 新增修改 |
| | | const onSubmit = async () => { |
| | | if(state.title === '新增用户'){ |
| | | let res = await userApi().addUser(state.userForm) |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'用户新增成功', |
| | | duration:2000 |
| | | }) |
| | | state.isShowUserDialog = false; |
| | | context.emit('getUserList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }else{ |
| | | let res = await userApi().modUser(state.userForm) |
| | | if(res.data.code === '200'){ |
| | | ElMessage({ |
| | | type:'success', |
| | | message:'用户修改成功', |
| | | duration:2000 |
| | | }) |
| | | state.isShowUserDialog = false; |
| | | context.emit('getUserList') |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | } |
| | | }; |
| | | |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | }); |
| | | return { |
| | | openDialog, |
| | | onSubmit, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | // 页面加载时 |
| | | onMounted(() => {}); |
| | | return { |
| | | openDialog, |
| | | onSubmit, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | |
| | | <template> |
| | | <div class="system-user-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <el-input size="default" placeholder="请输入用户名称" style="max-width: 180px"> </el-input> |
| | | <el-button size="default" type="primary" class="ml10"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenUserDialog('新增','')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增用户 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="userTableData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="username" label="账户名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="realName" label="用户昵称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="sex" label="性别" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="role.name" label="关联角色" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="department.name" label="部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="phone" label="手机号" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="email" label="邮箱" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="用户状态" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <el-tag type="success" v-if="scope.row.status">启用</el-tag> |
| | | <el-tag type="info" v-else>禁用</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="100"> |
| | | <template #default="scope"> |
| | | <el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onOpenUserDialog('修改',scope.row)">修改</el-button> |
| | | <el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onRowDel(scope.row)">删除</el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="mt15" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="userTableData.listQuery.pageIndex" |
| | | background |
| | | v-model:page-size="userTableData.listQuery.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="userTableData.total" |
| | | > |
| | | </el-pagination> |
| | | </el-card> |
| | | <userDialog ref="userRef" @getUserList = "initUserTableData"/> |
| | | </div> |
| | | <div class="system-user-container"> |
| | | <el-card shadow="hover"> |
| | | <div class="system-user-search mb15"> |
| | | <el-input size="default" placeholder="请输入用户名称" style="max-width: 180px"> </el-input> |
| | | <el-button size="default" type="primary" class="ml10"> |
| | | <el-icon> |
| | | <ele-Search /> |
| | | </el-icon> |
| | | 查询 |
| | | </el-button> |
| | | <el-button size="default" type="success" class="ml10" @click="onOpenUserDialog('新增', '')"> |
| | | <el-icon> |
| | | <ele-FolderAdd /> |
| | | </el-icon> |
| | | 新增用户 |
| | | </el-button> |
| | | </div> |
| | | <el-table :data="userTableData.data" style="width: 100%"> |
| | | <el-table-column type="index" label="序号" width="60" /> |
| | | <el-table-column prop="username" label="账户名称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="realName" label="用户昵称" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="sex" label="性别" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="role.name" label="关联角色" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="department.name" label="部门" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="phone" label="手机号" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="email" label="邮箱" show-overflow-tooltip></el-table-column> |
| | | <el-table-column prop="status" label="用户状态" show-overflow-tooltip> |
| | | <template #default="scope"> |
| | | <el-tag type="success" v-if="scope.row.status">启用</el-tag> |
| | | <el-tag type="info" v-else>禁用</el-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column prop="gmtCreate" label="创建时间" show-overflow-tooltip></el-table-column> |
| | | <el-table-column label="操作" width="100"> |
| | | <template #default="scope"> |
| | | <el-button |
| | | :disabled="scope.row.userName === 'admin'" |
| | | size="small" |
| | | text |
| | | type="primary" |
| | | @click="onOpenUserDialog('修改', scope.row)" |
| | | >修改</el-button |
| | | > |
| | | <el-button :disabled="scope.row.userName === 'admin'" size="small" text type="primary" @click="onRowDel(scope.row)" |
| | | >删除</el-button |
| | | > |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | <br /> |
| | | <el-pagination |
| | | @size-change="onHandleSizeChange" |
| | | @current-change="onHandleCurrentChange" |
| | | class="page-position" |
| | | :pager-count="5" |
| | | :page-sizes="[10, 20, 30]" |
| | | v-model:current-page="userTableData.listQuery.pageIndex" |
| | | background |
| | | v-model:page-size="userTableData.listQuery.pageSize" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="userTableData.total" |
| | | > |
| | | </el-pagination> |
| | | <br /> |
| | | <br /> |
| | | </el-card> |
| | | <userDialog ref="userRef" @getUserList="initUserTableData" /> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts"> |
| | | import { toRefs, reactive, onMounted, ref, defineComponent } from 'vue'; |
| | | import { ElMessageBox, ElMessage } from 'element-plus'; |
| | | import userDialog from '/@/views/system/user/component/userDialog.vue'; |
| | | import {userApi} from "/@/api/user"; |
| | | import {departmentApi} from "/@/api/department"; |
| | | import {useRoleApi} from "/@/api/role"; |
| | | import { userApi } from '/@/api/user'; |
| | | import { departmentApi } from '/@/api/department'; |
| | | import { useRoleApi } from '/@/api/role'; |
| | | |
| | | // 定义接口来定义对象的类型 |
| | | interface TableDataRow { |
| | | userName: string; |
| | | userNickname: string; |
| | | roleSign: string; |
| | | department: string[]; |
| | | phone: string; |
| | | email: string; |
| | | sex: string; |
| | | password: string; |
| | | overdueTime: Date; |
| | | status: boolean; |
| | | describe: string; |
| | | createTime: string; |
| | | userName: string; |
| | | userNickname: string; |
| | | roleSign: string; |
| | | department: string[]; |
| | | phone: string; |
| | | email: string; |
| | | sex: string; |
| | | password: string; |
| | | overdueTime: Date; |
| | | status: boolean; |
| | | describe: string; |
| | | createTime: string; |
| | | } |
| | | interface DepartmentDataRow{ |
| | | |
| | | } |
| | | interface DepartmentDataRow {} |
| | | interface TableDataState { |
| | | userTableData: { |
| | | data: Array<TableDataRow>; |
| | | total: number; |
| | | loading: boolean; |
| | | listQuery: { |
| | | searchParams:{ |
| | | username:string, |
| | | realName:string, |
| | | }, |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | }; |
| | | }; |
| | | departmentList:[]; |
| | | roleList:[]; |
| | | userTableData: { |
| | | data: Array<TableDataRow>; |
| | | total: number; |
| | | loading: boolean; |
| | | listQuery: { |
| | | searchParams: { |
| | | username: string; |
| | | realName: string; |
| | | }; |
| | | pageIndex: number; |
| | | pageSize: number; |
| | | }; |
| | | }; |
| | | departmentList: []; |
| | | roleList: []; |
| | | } |
| | | |
| | | export default defineComponent({ |
| | | name: 'systemUser', |
| | | components: { userDialog }, |
| | | setup() { |
| | | const userRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | userTableData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | listQuery: { |
| | | searchParams:{ |
| | | username:'', |
| | | realName:'', |
| | | }, |
| | | pageIndex: 1, |
| | | pageSize: 10, |
| | | }, |
| | | }, |
| | | departmentList:[], |
| | | roleList:[], |
| | | }); |
| | | // 初始化表格数据 |
| | | const initUserTableData = async () => { |
| | | let res = await userApi().getUserList(state.userTableData.listQuery) |
| | | if(res.data.code === '200'){ |
| | | state.userTableData.data = res.data.data; |
| | | state.userTableData.total = res.data.data.length; |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | }; |
| | | name: 'systemUser', |
| | | components: { userDialog }, |
| | | setup() { |
| | | const userRef = ref(); |
| | | const state = reactive<TableDataState>({ |
| | | userTableData: { |
| | | data: [], |
| | | total: 0, |
| | | loading: false, |
| | | listQuery: { |
| | | searchParams: { |
| | | username: '', |
| | | realName: '' |
| | | }, |
| | | pageIndex: 1, |
| | | pageSize: 10 |
| | | } |
| | | }, |
| | | departmentList: [], |
| | | roleList: [] |
| | | }); |
| | | // 初始化表格数据 |
| | | const initUserTableData = async () => { |
| | | let res = await userApi().getUserList(state.userTableData.listQuery); |
| | | if (res.data.code === '200') { |
| | | state.userTableData.data = res.data.data; |
| | | state.userTableData.total = res.data.total; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList() |
| | | if(res.data.code === '200'){ |
| | | state.departmentList = res.data.data |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | } |
| | | const getDepartmentData = async () => { |
| | | let res = await departmentApi().getDepartmentList(); |
| | | if (res.data.code === '200') { |
| | | state.departmentList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | const getRoleData = async () => { |
| | | let res = await useRoleApi().getRoleList() |
| | | if(res.data.code === '200'){ |
| | | state.roleList = res.data.data |
| | | }else{ |
| | | ElMessage({ |
| | | type:'warning', |
| | | message:res.data.msg |
| | | }) |
| | | } |
| | | } |
| | | const getRoleData = async () => { |
| | | let res = await useRoleApi().getRoleList(); |
| | | if (res.data.code === '200') { |
| | | state.roleList = res.data.data; |
| | | } else { |
| | | ElMessage({ |
| | | type: 'warning', |
| | | message: res.data.msg |
| | | }); |
| | | } |
| | | }; |
| | | |
| | | // 打开新增修改用户弹窗 |
| | | const onOpenUserDialog = (type: string,value: any) => { |
| | | userRef.value.openDialog(type, value, state.departmentList,state.roleList); |
| | | }; |
| | | // 打开新增修改用户弹窗 |
| | | const onOpenUserDialog = (type: string, value: any) => { |
| | | userRef.value.openDialog(type, value, state.departmentList, state.roleList); |
| | | }; |
| | | |
| | | // 删除用户 |
| | | const onRowDel = (row: TableDataRow) => { |
| | | ElMessageBox.confirm(`此操作将永久删除账户名称:“${row.userName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning', |
| | | }).then(() => { |
| | | ElMessage.success('删除成功'); |
| | | }).catch(() => {}); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.userTableData.listQuery.pageSize = val; |
| | | initUserTableData() |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.userTableData.listQuery.pageSize = val; |
| | | initUserTableData() |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initUserTableData(); |
| | | getDepartmentData(); |
| | | getRoleData(); |
| | | }); |
| | | return { |
| | | userRef, |
| | | onOpenUserDialog, |
| | | onRowDel, |
| | | onHandleSizeChange, |
| | | initUserTableData, |
| | | onHandleCurrentChange, |
| | | ...toRefs(state), |
| | | }; |
| | | }, |
| | | // 删除用户 |
| | | const onRowDel = (row: TableDataRow) => { |
| | | ElMessageBox.confirm(`此操作将永久删除账户名称:“${row.userName}”,是否继续?`, '提示', { |
| | | confirmButtonText: '确认', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }) |
| | | .then(() => { |
| | | ElMessage.success('删除成功'); |
| | | }) |
| | | .catch(() => {}); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleSizeChange = (val: number) => { |
| | | state.userTableData.listQuery.pageSize = val; |
| | | initUserTableData(); |
| | | }; |
| | | // 分页改变 |
| | | const onHandleCurrentChange = (val: number) => { |
| | | state.userTableData.listQuery.pageIndex = val; |
| | | initUserTableData(); |
| | | }; |
| | | // 页面加载时 |
| | | onMounted(() => { |
| | | initUserTableData(); |
| | | getDepartmentData(); |
| | | getRoleData(); |
| | | }); |
| | | return { |
| | | userRef, |
| | | onOpenUserDialog, |
| | | onRowDel, |
| | | onHandleSizeChange, |
| | | initUserTableData, |
| | | onHandleCurrentChange, |
| | | ...toRefs(state) |
| | | }; |
| | | } |
| | | }); |
| | | </script> |
| | |
| | | /* Experimental Options */ |
| | | "experimentalDecorators": true /* Enables experimental support for ES7 decorators. */, |
| | | // "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */ |
| | | |
| | | /* Advanced Options */ |
| | | "skipLibCheck": true /* Skip type checking of declaration files. */, |
| | | "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */ |
| | |
| | | |
| | | "@ctrl/tinycolor@^3.4.1": |
| | | "integrity" "sha512-ej5oVy6lykXsvieQtqZxCOaLT+xD4+QNarq78cIYISHmZXshCvROLudpQN3lfL8G0NL7plMSSK+zlyvCaIJ4Iw==" |
| | | "resolved" "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz" |
| | | "resolved" "https://registry.npmmirror.com/@ctrl/tinycolor/-/tinycolor-3.4.1.tgz" |
| | | "version" "3.4.1" |
| | | |
| | | "@element-plus/icons-vue@^1.1.4": |
| | | "integrity" "sha512-Iz/nHqdp1sFPmdzRwHkEQQA3lKvoObk8azgABZ81QUOpW9s/lUyQVUSh0tNtEPZXQlKwlSh7SPgoVxzrE0uuVQ==" |
| | | "resolved" "https://registry.npmjs.org/@element-plus/icons-vue/-/icons-vue-1.1.4.tgz" |
| | | "version" "1.1.4" |
| | | |
| | | "@element-plus/icons-vue@^2.0.6": |
| | | "integrity" "sha512-lPpG8hYkjL/Z97DH5Ei6w6o22Z4YdNglWCNYOPcB33JCF2A4wye6HFgSI7hEt9zdLyxlSpiqtgf9XcYU+m5mew==" |
| | |
| | | "minimatch" "^3.1.2" |
| | | "strip-json-comments" "^3.1.1" |
| | | |
| | | "@floating-ui/core@^0.7.1": |
| | | "integrity" "sha512-grcqEmI8DTIolufpxhJagVeJmvloxBXE6xxSrVnSXz/Wz1uUIsC85ad+UNBqAoBOvzLxE42wvDj3YkmSGqWRxA==" |
| | | "resolved" "https://registry.npmjs.org/@floating-ui/core/-/core-0.7.1.tgz" |
| | | "version" "0.7.1" |
| | | "@floating-ui/core@^0.7.3": |
| | | "integrity" "sha512-buc8BXHmG9l82+OQXOFU3Kr2XQx9ys01U/Q9HMIrZ300iLc8HLMgh7dcCqgYzAzf4BkoQvDcXf5Y+CuEZ5JBYg==" |
| | | "resolved" "https://registry.npmmirror.com/@floating-ui/core/-/core-0.7.3.tgz" |
| | | "version" "0.7.3" |
| | | |
| | | "@floating-ui/dom@^0.5.0": |
| | | "integrity" "sha512-dkPSy5JPiQEtljc3VpG9lauYctxfLlqj/8N9f+lmsR92gQaSVMAWuBbFBH2keY5DmdQn3p4Dv1dQd+e8osH+/g==" |
| | | "resolved" "https://registry.npmjs.org/@floating-ui/dom/-/dom-0.5.1.tgz" |
| | | "version" "0.5.1" |
| | | "@floating-ui/dom@^0.5.4": |
| | | "integrity" "sha512-419BMceRLq0RrmTSDxn8hf9R3VCJv2K9PUfugh5JyEFmdjzDo+e8U5EdR8nzKq8Yj1htzLm3b6eQEEam3/rrtg==" |
| | | "resolved" "https://registry.npmmirror.com/@floating-ui/dom/-/dom-0.5.4.tgz" |
| | | "version" "0.5.4" |
| | | dependencies: |
| | | "@floating-ui/core" "^0.7.1" |
| | | "@floating-ui/core" "^0.7.3" |
| | | |
| | | "@humanwhocodes/config-array@^0.9.2": |
| | | "integrity" "sha512-ObyMyWxZiCu/yTisA7uzx81s40xR2fD5Cg/2Kq7G02ajkNubJf6BopgDTmDyc3U7sXpNKM8cYOw7s7Tyr+DnCw==" |
| | |
| | | |
| | | "@popperjs/core@npm:@sxzz/popperjs-es@^2.11.7": |
| | | "integrity" "sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ==" |
| | | "resolved" "https://registry.npmjs.org/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz" |
| | | "resolved" "https://registry.npmmirror.com/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz" |
| | | "version" "2.11.7" |
| | | |
| | | "@transloadit/prettier-bytes@0.0.7": |
| | |
| | | |
| | | "@types/lodash-es@*", "@types/lodash-es@^4.17.6": |
| | | "integrity" "sha512-R+zTeVUKDdfoRxpAryaQNRKk3105Rrgx2CFRClIgRGaqDTdjsm8h6IYA8ir584W3ePzkZfst5xIgDwYrlh9HLg==" |
| | | "resolved" "https://registry.npmjs.org/@types/lodash-es/-/lodash-es-4.17.6.tgz" |
| | | "resolved" "https://registry.npmmirror.com/@types/lodash-es/-/lodash-es-4.17.6.tgz" |
| | | "version" "4.17.6" |
| | | dependencies: |
| | | "@types/lodash" "*" |
| | | |
| | | "@types/lodash@*", "@types/lodash@^4.14.182": |
| | | "integrity" "sha512-/THyiqyQAP9AfARo4pF+aCGcyiQ94tX/Is2I7HofNRqoYLgN1PBoOWu2/zTA5zMxzP5EFutMtWtGAFRKUe961Q==" |
| | | "resolved" "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.182.tgz" |
| | | "resolved" "https://registry.npmmirror.com/@types/lodash/-/lodash-4.14.182.tgz" |
| | | "version" "4.14.182" |
| | | |
| | | "@types/node@*", "@types/node@^17.0.39": |
| | |
| | | "integrity" "sha512-C3064MH72iEfeGCYEGCt7FCxXoAXaMPG0QPnstcxvPmbl54erpISu06d++FY37Smja64iWy5L8wOyHHBghWbJQ==" |
| | | "resolved" "https://registry.npmjs.org/@types/sortablejs/-/sortablejs-1.13.0.tgz" |
| | | "version" "1.13.0" |
| | | |
| | | "@types/web-bluetooth@^0.0.14": |
| | | "integrity" "sha512-5d2RhCard1nQUC3aHcq/gHzWYO6K0WJmAbjO7mQJgCQKtZpgXxv1rOM6O/dBDhDYYVutk1sciOgNSe+5YyfM8A==" |
| | | "resolved" "https://registry.npmmirror.com/@types/web-bluetooth/-/web-bluetooth-0.0.14.tgz" |
| | | "version" "0.0.14" |
| | | |
| | | "@typescript-eslint/eslint-plugin@^5.27.0": |
| | | "integrity" "sha512-DDrIA7GXtmHXr1VCcx9HivA39eprYBIFxbQEHI6NyraRDxCGpxAFiYQAT/1Y0vh1C+o2vfBiy4IuPoXxtTZCAQ==" |
| | |
| | | "resolved" "https://registry.npmjs.org/@vue/shared/-/shared-3.2.36.tgz" |
| | | "version" "3.2.36" |
| | | |
| | | "@vueuse/core@^8.5.0": |
| | | "integrity" "sha512-VEJ6sGNsPlUp0o9BGda2YISvDZbhWJSOJu5zlp2TufRGVrLcYUKr31jyFEOj6RXzG3k/H4aCYeZyjpItfU8glw==" |
| | | "resolved" "https://registry.npmjs.org/@vueuse/core/-/core-8.5.0.tgz" |
| | | "version" "8.5.0" |
| | | "@vueuse/core@^8.7.5": |
| | | "integrity" "sha512-dE3/JgwqIHmmtmRBdZAnq87rZCSFbYVps2t3gWy9Jv/+Qp6sHSSKuPFtwguJVZ2OnaGnB/AMRmx4CuFRxFin3A==" |
| | | "resolved" "https://registry.npmmirror.com/@vueuse/core/-/core-8.9.2.tgz" |
| | | "version" "8.9.2" |
| | | dependencies: |
| | | "@vueuse/metadata" "8.5.0" |
| | | "@vueuse/shared" "8.5.0" |
| | | "@types/web-bluetooth" "^0.0.14" |
| | | "@vueuse/metadata" "8.9.2" |
| | | "@vueuse/shared" "8.9.2" |
| | | "vue-demi" "*" |
| | | |
| | | "@vueuse/metadata@8.5.0": |
| | | "integrity" "sha512-WxsD+Cd+bn+HcjpY6Dl9FJ8ywTRTT9pTwk3bCQpzEhXVYAyNczKDSahk50fCfIJKeWHhyI4B2+/ZEOxQAkUr0g==" |
| | | "resolved" "https://registry.npmjs.org/@vueuse/metadata/-/metadata-8.5.0.tgz" |
| | | "version" "8.5.0" |
| | | "@vueuse/metadata@8.9.2": |
| | | "integrity" "sha512-g2s2BeyeEtJElmMFfFPnM+BTvnt0omniyvz8U18/zXDpQIMGozlNQgHoFeratyMfgVBhH/u2VKzmchChtDsgPQ==" |
| | | "resolved" "https://registry.npmmirror.com/@vueuse/metadata/-/metadata-8.9.2.tgz" |
| | | "version" "8.9.2" |
| | | |
| | | "@vueuse/shared@8.5.0": |
| | | "integrity" "sha512-qKG+SZb44VvGD4dU5cQ63z4JE2Yk39hQUecR0a9sEdJA01cx+XrxAvFKJfPooxwoiqalAVw/ktWK6xbyc/jS3g==" |
| | | "resolved" "https://registry.npmjs.org/@vueuse/shared/-/shared-8.5.0.tgz" |
| | | "version" "8.5.0" |
| | | "@vueuse/shared@8.9.2": |
| | | "integrity" "sha512-s4Nk82oheL5z1GywyGnqjob0MzbAt88olMZa0vgt/p3gcMsT8Ff7+SqmNgEFC6AAs6xiuhOAZpnew9Zs3d90yQ==" |
| | | "resolved" "https://registry.npmmirror.com/@vueuse/shared/-/shared-8.9.2.tgz" |
| | | "version" "8.9.2" |
| | | dependencies: |
| | | "vue-demi" "*" |
| | | |
| | |
| | | "resolved" "https://registry.npmjs.org/array-union/-/array-union-2.1.0.tgz" |
| | | "version" "2.1.0" |
| | | |
| | | "async-validator@^4.1.1": |
| | | "integrity" "sha512-p4DO/JXwjs8klJyJL8Q2oM4ks5fUTze/h5k10oPPKMiLe1fj3G1QMzPHNmN1Py4ycOk7WlO2DcGXv1qiESJCZA==" |
| | | "resolved" "https://registry.npmjs.org/async-validator/-/async-validator-4.1.1.tgz" |
| | | "version" "4.1.1" |
| | | "async-validator@^4.2.5": |
| | | "integrity" "sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==" |
| | | "resolved" "https://registry.npmmirror.com/async-validator/-/async-validator-4.2.5.tgz" |
| | | "version" "4.2.5" |
| | | |
| | | "asynckit@^0.4.0": |
| | | "integrity" "sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==" |
| | |
| | | "es5-ext" "^0.10.50" |
| | | "type" "^1.0.1" |
| | | |
| | | "dayjs@^1.11.2": |
| | | "integrity" "sha512-F4LXf1OeU9hrSYRPTTj/6FbO4HTjPKXvEIC1P2kcnFurViINCVk3ZV0xAS3XVx9MkMsXbbqlK6hjseaYbgKEHw==" |
| | | "resolved" "https://registry.npmjs.org/dayjs/-/dayjs-1.11.2.tgz" |
| | | "version" "1.11.2" |
| | | "dayjs@^1.11.3": |
| | | "integrity" "sha512-xxwlswWOlGhzgQ4TKzASQkUhqERI3egRNqgV4ScR8wlANA/A9tZ7miXa44vTTKEq5l7vWoL5G57bG3zA+Kow0A==" |
| | | "resolved" "https://registry.npmmirror.com/dayjs/-/dayjs-1.11.3.tgz" |
| | | "version" "1.11.3" |
| | | |
| | | "debug@^4.1.1", "debug@^4.3.2", "debug@^4.3.4": |
| | | "integrity" "sha512-PRWFHuSU3eDtQJPvnNY7Jcket1j0t5OuOsFzPPzsekD52Zl8qUfFIPEiswXqIvHWGVHOgX+7G/vCNNhehwxfkQ==" |
| | |
| | | "resolved" "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.4.137.tgz" |
| | | "version" "1.4.137" |
| | | |
| | | "element-plus@^2.2.2": |
| | | "integrity" "sha512-yGcj2Ayb0jZO1WbI51tHJ4efhlfWKlBqqGtWbzhq+tcpfaKzJZN+IHRouuFasqn0ZV3tWCDu1jggDR1+9y7XfQ==" |
| | | "resolved" "https://registry.npmjs.org/element-plus/-/element-plus-2.2.2.tgz" |
| | | "version" "2.2.2" |
| | | "element-plus@^2.2.9": |
| | | "integrity" "sha512-jYbL0JkCdv95rkT6trZJjCAizLPySa0qcd2cgq+57SKQnCZAcNDDq4GbTuFRnNavdoeCJnuM3HIficTIUpsMOQ==" |
| | | "resolved" "https://registry.npmmirror.com/element-plus/-/element-plus-2.2.9.tgz" |
| | | "version" "2.2.9" |
| | | dependencies: |
| | | "@ctrl/tinycolor" "^3.4.1" |
| | | "@element-plus/icons-vue" "^1.1.4" |
| | | "@floating-ui/dom" "^0.5.0" |
| | | "@element-plus/icons-vue" "^2.0.6" |
| | | "@floating-ui/dom" "^0.5.4" |
| | | "@popperjs/core" "npm:@sxzz/popperjs-es@^2.11.7" |
| | | "@types/lodash" "^4.14.182" |
| | | "@types/lodash-es" "^4.17.6" |
| | | "@vueuse/core" "^8.5.0" |
| | | "async-validator" "^4.1.1" |
| | | "dayjs" "^1.11.2" |
| | | "@vueuse/core" "^8.7.5" |
| | | "async-validator" "^4.2.5" |
| | | "dayjs" "^1.11.3" |
| | | "escape-html" "^1.0.3" |
| | | "lodash" "^4.17.21" |
| | | "lodash-es" "^4.17.21" |
| | |
| | | "version" "3.1.1" |
| | | |
| | | "escape-html@^1.0.3": |
| | | "integrity" "sha1-Aljq5NPQwJdN4cFpGI7wBR0dGYg=" |
| | | "resolved" "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz" |
| | | "integrity" "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==" |
| | | "resolved" "https://registry.npmmirror.com/escape-html/-/escape-html-1.0.3.tgz" |
| | | "version" "1.0.3" |
| | | |
| | | "escape-string-regexp@^4.0.0": |
| | |
| | | |
| | | "lodash-es@*", "lodash-es@^4.17.21": |
| | | "integrity" "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==" |
| | | "resolved" "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz" |
| | | "resolved" "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.21.tgz" |
| | | "version" "4.17.21" |
| | | |
| | | "lodash-unified@^1.0.2": |
| | | "integrity" "sha512-OGbEy+1P+UT26CYi4opY4gebD8cWRDxAT6MAObIVQMiqYdxZr1g3QHWCToVsm31x2NkLS4K3+MC2qInaRMa39g==" |
| | | "resolved" "https://registry.npmjs.org/lodash-unified/-/lodash-unified-1.0.2.tgz" |
| | | "resolved" "https://registry.npmmirror.com/lodash-unified/-/lodash-unified-1.0.2.tgz" |
| | | "version" "1.0.2" |
| | | |
| | | "lodash.camelcase@^4.3.0": |
| | |
| | | |
| | | "memoize-one@^6.0.0": |
| | | "integrity" "sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==" |
| | | "resolved" "https://registry.npmjs.org/memoize-one/-/memoize-one-6.0.0.tgz" |
| | | "resolved" "https://registry.npmmirror.com/memoize-one/-/memoize-one-6.0.0.tgz" |
| | | "version" "6.0.0" |
| | | |
| | | "merge-stream@^2.0.0": |
| | |
| | | |
| | | "normalize-wheel-es@^1.1.2": |
| | | "integrity" "sha512-scX83plWJXYH1J4+BhAuIHadROzxX0UBF3+HuZNY2Ks8BciE7tSTQ+5JhTsvzjaO0/EJdm4JBGrfObKxFf3Png==" |
| | | "resolved" "https://registry.npmjs.org/normalize-wheel-es/-/normalize-wheel-es-1.1.2.tgz" |
| | | "resolved" "https://registry.npmmirror.com/normalize-wheel-es/-/normalize-wheel-es-1.1.2.tgz" |
| | | "version" "1.1.2" |
| | | |
| | | "nprogress@^0.2.0": |
| | |
| | | "clipboard" "^2.0.6" |
| | | |
| | | "vue-demi@*": |
| | | "integrity" "sha512-BREuTgTYlUr0zw0EZn3hnhC3I6gPWv+Kwh4MCih6QcAeaTlaIX0DwOVN0wHej7hSvDPecz4jygy/idsgKfW58Q==" |
| | | "resolved" "https://registry.npmjs.org/vue-demi/-/vue-demi-0.12.5.tgz" |
| | | "version" "0.12.5" |
| | | "integrity" "sha512-KP4lq9uSz0KZbaqCllRhnxMV3mYRsRWJfdsAhZyt5bV5O1RTpoeDptBRV9NOa/JgOpfaA9ane88VF7OjWNK/DA==" |
| | | "resolved" "https://registry.npmmirror.com/vue-demi/-/vue-demi-0.13.4.tgz" |
| | | "version" "0.13.4" |
| | | |
| | | "vue-eslint-parser@^9.0.1", "vue-eslint-parser@^9.0.2": |
| | | "integrity" "sha512-uCPQwTGjOtAYrwnU+76pYxalhjsh7iFBsHwBqDHiOPTxtICDaraO4Szw54WFTNZTAEsgHHzqFOu1mmnBOBRzDA==" |