renren/spc
4
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

更新

Browse Source
This commit is contained in:
朱文强 2022-12-13 16:41:37 +08:00
parent c0a5dbac2d
commit f6b3f2f323
60 changed files with 6404 additions and 742 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

311
package-lock.json generated
View File

@ -17,6 +17,20 @@
"utility-types": "^3.10.0"
}
},
"@antv/x6-react-components": {
"version": "1.1.15",
"resolved": "https://registry.npmjs.org/@antv/x6-react-components/-/x6-react-components-1.1.15.tgz",
"integrity": "sha512-tXUak5CPuZLIA0fVBSM2vZ+TxxoEGBcokr0J69e7H0G3WIutDf6J6RkNeRGuKvcW8O1Lef1jiBGSLLjlrRXf0g==",
"requires": {
"clamp": "^1.0.1",
"classnames": "^2.2.6",
"rc-dropdown": "^3.0.0-alpha.0",
"rc-util": "^4.15.7",
"react-color": "^2.17.3",
"react-resize-detector": "^6.6.4",
"ua-parser-js": "^0.7.20"
}
},
"@babel/code-frame": {
"version": "7.0.0-beta.44",
"resolved": "https://registry.npm.taobao.org/@babel/code-frame/download/@babel/code-frame-7.0.0-beta.44.tgz?cache=0&sync_timestamp=1593529659031&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40babel%2Fcode-frame%2Fdownload%2F%40babel%2Fcode-frame-7.0.0-beta.44.tgz",
@ -2373,7 +2387,6 @@
"version": "7.10.5",
"resolved": "https://registry.npm.taobao.org/@babel/runtime/download/@babel/runtime-7.10.5.tgz",
"integrity": "sha1-MD2L1EDs1aSR6uYRf9M2dphnTFw=",
"dev": true,
"requires": {
"regenerator-runtime": "^0.13.4"
},
@ -2381,8 +2394,7 @@
"regenerator-runtime": {
"version": "0.13.7",
"resolved": "https://registry.npm.taobao.org/regenerator-runtime/download/regenerator-runtime-0.13.7.tgz?cache=0&sync_timestamp=1595456367497&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fregenerator-runtime%2Fdownload%2Fregenerator-runtime-0.13.7.tgz",
"integrity": "sha1-ysLazIoepnX+qrrriugziYrkb1U=",
"dev": true
"integrity": "sha1-ysLazIoepnX+qrrriugziYrkb1U="
}
}
},
@ -2463,6 +2475,11 @@
"@hapi/hoek": "^8.3.0"
}
},
"@icons/material": {
"version": "0.2.4",
"resolved": "https://registry.npmjs.org/@icons/material/-/material-0.2.4.tgz",
"integrity": "sha512-QPcGmICAPbGLGb6F/yNf/KzKqvFx8z5qx3D1yFqVAjoFmXK35EgyW+cJ57Te3CNsmzblwtzakLGFqHPqrfb4Tw=="
},
"@intervolga/optimize-cssnano-plugin": {
"version": "1.0.6",
"resolved": "https://registry.npm.taobao.org/@intervolga/optimize-cssnano-plugin/download/@intervolga/optimize-cssnano-plugin-1.0.6.tgz",
@ -2640,6 +2657,11 @@
"integrity": "sha1-FZJUFOCtLNdlv+9YhC9+JqesyyQ=",
"dev": true
},
"@types/resize-observer-browser": {
"version": "0.1.7",
"resolved": "https://registry.npmjs.org/@types/resize-observer-browser/-/resize-observer-browser-0.1.7.tgz",
"integrity": "sha512-G9eN0Sn0ii9PWQ3Vl72jDPgeJwRWhv2Qk/nQkJuWmRmOB4HX3/BhD5SE1dZs/hzPZL/WKnvF0RHdTSG54QJFyg=="
},
"@vue/babel-helper-vue-jsx-merge-props": {
"version": "1.0.0",
"resolved": "https://registry.npm.taobao.org/@vue/babel-helper-vue-jsx-merge-props/download/@vue/babel-helper-vue-jsx-merge-props-1.0.0.tgz",
@ -4042,6 +4064,21 @@
"integrity": "sha1-DeiJpgEgOQmw++B7iTjcIdLpZ7w=",
"dev": true
},
"add-dom-event-listener": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/add-dom-event-listener/-/add-dom-event-listener-1.1.0.tgz",
"integrity": "sha512-WCxx1ixHT0GQU9hb0KI/mhgRQhnU+U3GvwY6ZvVjYq8rsihIGoaIOUbY0yMPBxLH5MDtr0kz3fisWGNcbWW7Jw==",
"requires": {
"object-assign": "4.x"
},
"dependencies": {
"object-assign": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg=="
}
}
},
"address": {
"version": "1.1.2",
"resolved": "https://registry.npm.taobao.org/address/download/address-1.1.2.tgz?cache=0&sync_timestamp=1593529661616&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Faddress%2Fdownload%2Faddress-1.1.2.tgz",
@ -5290,6 +5327,11 @@
"safe-buffer": "^5.0.1"
}
},
"clamp": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/clamp/-/clamp-1.0.1.tgz",
"integrity": "sha512-kgMuFyE78OC6Dyu3Dy7vcx4uy97EIbVxJB/B0eJ3bUNAkwdNcxYzgKltnyADiYwsR7SEqkkUPsEUT//OVS6XMA=="
},
"class-utils": {
"version": "0.3.6",
"resolved": "https://registry.npm.taobao.org/class-utils/download/class-utils-0.3.6.tgz",
@ -5311,6 +5353,11 @@
}
}
},
"classnames": {
"version": "2.3.1",
"resolved": "https://registry.npmjs.org/classnames/-/classnames-2.3.1.tgz",
"integrity": "sha512-OlQdbZ7gLfGarSqxesMesDa5uz7KFbID8Kpq/SxIoNGDqY8lSYs0D+hhtBXhcdB3rcbXArFr7vlHheLk1voeNA=="
},
"clean-css": {
"version": "3.4.28",
"resolved": "https://registry.npm.taobao.org/clean-css/download/clean-css-3.4.28.tgz",
@ -6950,6 +6997,11 @@
"buffer-indexof": "^1.0.0"
}
},
"dom-align": {
"version": "1.12.3",
"resolved": "https://registry.npmjs.org/dom-align/-/dom-align-1.12.3.tgz",
"integrity": "sha512-Gj9hZN3a07cbR6zviMUBOMPdWxYhbMI+x+WS0NAIu2zFZmbK8ys9R79g+iG9qLnlCwpFoaB+fKy8Pdv470GsPA=="
},
"dom-converter": {
"version": "0.2.0",
"resolved": "https://registry.npm.taobao.org/dom-converter/download/dom-converter-0.2.0.tgz",
@ -10608,6 +10660,11 @@
"object-visit": "^1.0.0"
}
},
"material-colors": {
"version": "1.2.6",
"resolved": "https://registry.npmjs.org/material-colors/-/material-colors-1.2.6.tgz",
"integrity": "sha512-6qE4B9deFBIa9YSpOc9O0Sgc43zTeVYbgDT5veRKSlB2+ZuHNoVVxA1L/ckMUayV9Ay9y7Z/SZCLcGteW9i7bg=="
},
"md5.js": {
"version": "1.3.5",
"resolved": "https://registry.npm.taobao.org/md5.js/download/md5.js-1.3.5.tgz",
@ -13640,6 +13697,23 @@
"integrity": "sha1-mEcocL8igTL8vdhoEputEsPAKeM=",
"dev": true
},
"prop-types": {
"version": "15.8.1",
"resolved": "https://registry.npmjs.org/prop-types/-/prop-types-15.8.1.tgz",
"integrity": "sha512-oj87CgZICdulUohogVAR7AjlC0327U4el4L6eAvOqCeudMDVU0NThNaV+b9Df4dXgSP1gXMTnPdhfe/2qDH5cg==",
"requires": {
"loose-envify": "^1.4.0",
"object-assign": "^4.1.1",
"react-is": "^16.13.1"
},
"dependencies": {
"object-assign": {
"version": "4.1.1",
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg=="
}
}
},
"proxy-addr": {
"version": "2.0.6",
"resolved": "https://registry.npm.taobao.org/proxy-addr/download/proxy-addr-2.0.6.tgz",
@ -13880,6 +13954,222 @@
"unpipe": "1.0.0"
}
},
"rc-align": {
"version": "4.0.12",
"resolved": "https://registry.npmjs.org/rc-align/-/rc-align-4.0.12.tgz",
"integrity": "sha512-3DuwSJp8iC/dgHzwreOQl52soj40LchlfUHtgACOUtwGuoFIOVh6n/sCpfqCU8kO5+iz6qR0YKvjgB8iPdE3aQ==",
"requires": {
"@babel/runtime": "^7.10.1",
"classnames": "2.x",
"dom-align": "^1.7.0",
"lodash": "^4.17.21",
"rc-util": "^5.3.0",
"resize-observer-polyfill": "^1.5.1"
},
"dependencies": {
"lodash": {
"version": "4.17.21",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
},
"rc-util": {
"version": "5.24.2",
"resolved": "https://registry.npmjs.org/rc-util/-/rc-util-5.24.2.tgz",
"integrity": "sha512-MWd0ZEV7xSwN4HM9jz9BwpnMzwCPjYJ7K90lePsrdgAkrmm8U7b4BOTIsv/84BQsaF7N3ejNkcrZ3AfEwc9HXA==",
"requires": {
"@babel/runtime": "^7.18.3",
"react-is": "^16.12.0",
"shallowequal": "^1.1.0"
},
"dependencies": {
"@babel/runtime": {
"version": "7.19.0",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.19.0.tgz",
"integrity": "sha512-eR8Lo9hnDS7tqkO7NsV+mKvCmv5boaXFSZ70DnfhcgiEne8hv9oCEd36Klw74EtizEqLsy4YnW8UWwpBVolHZA==",
"requires": {
"regenerator-runtime": "^0.13.4"
}
}
}
},
"regenerator-runtime": {
"version": "0.13.9",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
}
}
},
"rc-dropdown": {
"version": "3.6.2",
"resolved": "https://registry.npmjs.org/rc-dropdown/-/rc-dropdown-3.6.2.tgz",
"integrity": "sha512-Wsw7GkVbUXADEs8FPL0v8gd+3mWQiydPFXBlr2imMScQaf8hh79pG9KrBc1DwK+nqHmYOpQfK2gn6jG2AQw9Pw==",
"requires": {
"@babel/runtime": "^7.10.1",
"classnames": "^2.2.6",
"rc-trigger": "^5.0.4",
"rc-util": "^5.17.0"
},
"dependencies": {
"rc-util": {
"version": "5.24.2",
"resolved": "https://registry.npmjs.org/rc-util/-/rc-util-5.24.2.tgz",
"integrity": "sha512-MWd0ZEV7xSwN4HM9jz9BwpnMzwCPjYJ7K90lePsrdgAkrmm8U7b4BOTIsv/84BQsaF7N3ejNkcrZ3AfEwc9HXA==",
"requires": {
"@babel/runtime": "^7.18.3",
"react-is": "^16.12.0",
"shallowequal": "^1.1.0"
},
"dependencies": {
"@babel/runtime": {
"version": "7.19.0",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.19.0.tgz",
"integrity": "sha512-eR8Lo9hnDS7tqkO7NsV+mKvCmv5boaXFSZ70DnfhcgiEne8hv9oCEd36Klw74EtizEqLsy4YnW8UWwpBVolHZA==",
"requires": {
"regenerator-runtime": "^0.13.4"
}
}
}
},
"regenerator-runtime": {
"version": "0.13.9",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
}
}
},
"rc-motion": {
"version": "2.6.2",
"resolved": "https://registry.npmjs.org/rc-motion/-/rc-motion-2.6.2.tgz",
"integrity": "sha512-4w1FaX3dtV749P8GwfS4fYnFG4Rb9pxvCYPc/b2fw1cmlHJWNNgOFIz7ysiD+eOrzJSvnLJWlNQQncpNMXwwpg==",
"requires": {
"@babel/runtime": "^7.11.1",
"classnames": "^2.2.1",
"rc-util": "^5.21.0"
},
"dependencies": {
"@babel/runtime": {
"version": "7.19.0",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.19.0.tgz",
"integrity": "sha512-eR8Lo9hnDS7tqkO7NsV+mKvCmv5boaXFSZ70DnfhcgiEne8hv9oCEd36Klw74EtizEqLsy4YnW8UWwpBVolHZA==",
"requires": {
"regenerator-runtime": "^0.13.4"
}
},
"rc-util": {
"version": "5.24.2",
"resolved": "https://registry.npmjs.org/rc-util/-/rc-util-5.24.2.tgz",
"integrity": "sha512-MWd0ZEV7xSwN4HM9jz9BwpnMzwCPjYJ7K90lePsrdgAkrmm8U7b4BOTIsv/84BQsaF7N3ejNkcrZ3AfEwc9HXA==",
"requires": {
"@babel/runtime": "^7.18.3",
"react-is": "^16.12.0",
"shallowequal": "^1.1.0"
}
},
"regenerator-runtime": {
"version": "0.13.9",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
}
}
},
"rc-trigger": {
"version": "5.3.1",
"resolved": "https://registry.npmjs.org/rc-trigger/-/rc-trigger-5.3.1.tgz",
"integrity": "sha512-5gaFbDkYSefZ14j2AdzucXzlWgU2ri5uEjkHvsf1ynRhdJbKxNOnw4PBZ9+FVULNGFiDzzlVF8RJnR9P/xrnKQ==",
"requires": {
"@babel/runtime": "^7.18.3",
"classnames": "^2.2.6",
"rc-align": "^4.0.0",
"rc-motion": "^2.0.0",
"rc-util": "^5.19.2"
},
"dependencies": {
"@babel/runtime": {
"version": "7.19.0",
"resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.19.0.tgz",
"integrity": "sha512-eR8Lo9hnDS7tqkO7NsV+mKvCmv5boaXFSZ70DnfhcgiEne8hv9oCEd36Klw74EtizEqLsy4YnW8UWwpBVolHZA==",
"requires": {
"regenerator-runtime": "^0.13.4"
}
},
"rc-util": {
"version": "5.24.2",
"resolved": "https://registry.npmjs.org/rc-util/-/rc-util-5.24.2.tgz",
"integrity": "sha512-MWd0ZEV7xSwN4HM9jz9BwpnMzwCPjYJ7K90lePsrdgAkrmm8U7b4BOTIsv/84BQsaF7N3ejNkcrZ3AfEwc9HXA==",
"requires": {
"@babel/runtime": "^7.18.3",
"react-is": "^16.12.0",
"shallowequal": "^1.1.0"
}
},
"regenerator-runtime": {
"version": "0.13.9",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.9.tgz",
"integrity": "sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA=="
}
}
},
"rc-util": {
"version": "4.21.1",
"resolved": "https://registry.npmjs.org/rc-util/-/rc-util-4.21.1.tgz",
"integrity": "sha512-Z+vlkSQVc1l8O2UjR3WQ+XdWlhj5q9BMQNLk2iOBch75CqPfrJyGtcWMcnhRlNuDu0Ndtt4kLVO8JI8BrABobg==",
"requires": {
"add-dom-event-listener": "^1.1.0",
"prop-types": "^15.5.10",
"react-is": "^16.12.0",
"react-lifecycles-compat": "^3.0.4",
"shallowequal": "^1.1.0"
}
},
"react-color": {
"version": "2.19.3",
"resolved": "https://registry.npmjs.org/react-color/-/react-color-2.19.3.tgz",
"integrity": "sha512-LEeGE/ZzNLIsFWa1TMe8y5VYqr7bibneWmvJwm1pCn/eNmrabWDh659JSPn9BuaMpEfU83WTOJfnCcjDZwNQTA==",
"requires": {
"@icons/material": "^0.2.4",
"lodash": "^4.17.15",
"lodash-es": "^4.17.15",
"material-colors": "^1.2.1",
"prop-types": "^15.5.10",
"reactcss": "^1.2.0",
"tinycolor2": "^1.4.1"
}
},
"react-is": {
"version": "16.13.1",
"resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
"integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
},
"react-lifecycles-compat": {
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
"integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
},
"react-resize-detector": {
"version": "6.7.8",
"resolved": "https://registry.npmjs.org/react-resize-detector/-/react-resize-detector-6.7.8.tgz",
"integrity": "sha512-0FaEcUBAbn+pq3PT5a9hHRebUfuS1SRLGLpIw8LydU7zX429I6XJgKerKAMPsJH0qWAl6o5bVKNqFJqr6tGPYw==",
"requires": {
"@types/resize-observer-browser": "^0.1.6",
"lodash": "^4.17.21",
"resize-observer-polyfill": "^1.5.1"
},
"dependencies": {
"lodash": {
"version": "4.17.21",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.21.tgz",
"integrity": "sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg=="
}
}
},
"reactcss": {
"version": "1.2.3",
"resolved": "https://registry.npmjs.org/reactcss/-/reactcss-1.2.3.tgz",
"integrity": "sha512-KiwVUcFu1RErkI97ywr8nvx8dNOpT03rbnma0SSalTYjkrPYaEajR4a/MRt6DZ46K6arDRbWMNHF+xH7G7n/8A==",
"requires": {
"lodash": "^4.0.1"
}
},
"read-pkg": {
"version": "1.1.0",
"resolved": "https://registry.npm.taobao.org/read-pkg/download/read-pkg-1.1.0.tgz",
@ -14590,6 +14880,11 @@
"safe-buffer": "^5.0.1"
}
},
"shallowequal": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/shallowequal/-/shallowequal-1.1.0.tgz",
"integrity": "sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ=="
},
"shebang-command": {
"version": "1.2.0",
"resolved": "https://registry.npm.taobao.org/shebang-command/download/shebang-command-1.2.0.tgz",
@ -15839,6 +16134,11 @@
"integrity": "sha1-QFQRqOfmM5/mTbmiNN4R3DHgK9Q=",
"dev": true
},
"tinycolor2": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/tinycolor2/-/tinycolor2-1.4.2.tgz",
"integrity": "sha512-vJhccZPs965sV/L2sU4oRQVAos0pQXwsvTLkWYdqJ+a8Q5kPFzJTuOFwy7UniPli44NKQGAglksjvOcpo95aZA=="
},
"to-arraybuffer": {
"version": "1.0.1",
"resolved": "https://registry.npm.taobao.org/to-arraybuffer/download/to-arraybuffer-1.0.1.tgz",
@ -16013,6 +16313,11 @@
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
"dev": true
},
"ua-parser-js": {
"version": "0.7.31",
"resolved": "https://registry.npmjs.org/ua-parser-js/-/ua-parser-js-0.7.31.tgz",
"integrity": "sha512-qLK/Xe9E2uzmYI3qLeOmI0tEOt+TBBQyUIAh4aAgU05FVYzeZrKUdkAZfBNVGRaHVgV0TDkdEngJSw/SyQchkQ=="
},
"uglify-js": {
"version": "3.4.10",
"resolved": "https://registry.npm.taobao.org/uglify-js/download/uglify-js-3.4.10.tgz",

3
package.json
View File

@ -3,7 +3,7 @@
"version": "5.0.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"dev": "vue-cli-service serve",
"build": "vue-cli-service build",
"build:prod": "vue-cli-service build --mode production",
"build:sit": "vue-cli-service build --mode production.sit",
@ -11,6 +11,7 @@
},
"dependencies": {
"@antv/x6": "^1.33.1",
"@antv/x6-react-components": "^1.1.15",
"axios": "^0.19.2",
"babel-eslint": "^8.0.1",
"babel-plugin-component": "^1.1.1",

4
public/index.html
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2022-08-22 14:57:50
* @LastEditors: zwq
* @LastEditTime: 2022-08-22 15:15:04
* @LastEditTime: 2022-12-13 14:33:51
* @Description:
-->
<!DOCTYPE html>
@ -37,7 +37,7 @@
<!-- 开发环境 -->
<% if (process.env.VUE_APP_NODE_ENV === 'dev') { %>
<script>
window.SITE_CONFIG['apiURL'] = 'http://192.168.1.74:8080/ym-spc';
window.SITE_CONFIG['apiURL'] = 'http://192.168.1.73:8080/ym-spc';
</script>
<% } %>
<!-- 集成测试环境 -->

1
src/icons/svg/08质量.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663551954271" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2653" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M640 512c0 40.8-19.2 76.8-48.8 100l-43.2-43.2-45.6 45.6 24.8 24.8c-4.8 0.8-10.4 0.8-15.2 0.8-70.4 0-128-57.6-128-128s57.6-128 128-128 128 57.6 128 128z m226.4-283.2v244.8c0 226.4-151.2 437.6-353.6 489.6-203.2-51.2-354.4-263.2-354.4-489.6V228.8L512.8 65.6l353.6 163.2zM636.8 657.6C677.6 622.4 704 570.4 704 512c0-106.4-85.6-192-192-192S320 406.4 320 512s85.6 192 192 192c24 0 46.4-4.8 68-12l58.4 58.4 45.6-45.6-47.2-47.2z" p-id="2654"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 780 B

1
src/icons/svg/控制中心.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1663552103188" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="5400" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><path d="M682.666667 682.666667v-42.666667h85.333333v42.666667h85.333333v85.333333h-85.333333v42.666667h-85.333333v-42.666667H170.666667v-85.333333h512z m-213.333334-213.333334v-42.666666h85.333334v42.666666h298.666666v85.333334h-298.666666v42.666666h-85.333334v-42.666666H170.666667v-85.333334h298.666666zM256 256V213.333333h85.333333v42.666667h512v85.333333H341.333333v42.666667H256V341.333333H170.666667V256h85.333333z" fill="#fff" p-id="5401"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 784 B

1
src/icons/svg/方案管理.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 9.0 KiB

8
src/main.js
View File

@ -1,3 +1,10 @@
/*
* @Author: zwq
* @Date: 2022-08-22 14:57:50
* @LastEditors: zwq
* @LastEditTime: 2022-09-13 10:39:56
* @Description:
*/
import Vue from 'vue'
import Element from 'element-ui'
import App from '@/App'
@ -15,6 +22,7 @@ import renRegionTree from '@/components/ren-region-tree'
import { hasPermission, getDictLabel } from '@/utils'
import cloneDeep from 'lodash/cloneDeep'
Vue.config.productionTip = false
Vue.use(Element, {

2
src/mixins/basic-add.js
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2022-08-24 11:19:43
* @LastEditors: zwq
* @LastEditTime: 2022-08-26 15:38:58
* @LastEditTime: 2022-09-19 14:12:43
* @Description:
*/
export default {

10
src/mixins/basic-page.js
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2022-08-24 11:19:43
* @LastEditors: zwq
* @LastEditTime: 2022-08-24 14:06:58
* @LastEditTime: 2022-09-16 13:50:19
* @Description:
*/
export default {
@ -15,10 +15,8 @@ export default {
statusUrl: '',
exportUrl: ''
},
dataForm: {
paramKey: "",
},
dataList: [],
dataForm: {},
pageIndex: 1,
pageSize: 10,
totalPage: 0,
@ -32,7 +30,6 @@ export default {
this.getDataList();
},
methods: {
// 获取数据列表
getDataList() {
this.dataListLoading = true;
@ -41,8 +38,7 @@ export default {
params: {
page: this.pageIndex,
limit: this.pageSize,
code: this.dataForm.paramKey,
name: this.dataForm.paramKey,
...this.dataForm
},
})
.then(({ data: res }) => {

152
src/mixins/process-page.js Normal file
View File

@ -0,0 +1,152 @@
/*
* @Author: zwq
* @Date: 2022-08-24 11:19:43
* @LastEditors: zwq
* @LastEditTime: 2022-09-16 14:19:44
* @Description:
*/
export default {
data () {
/* eslint-disable */
return {
urlOptions: {
getDataListURL: '',
deleteURL: '',
statusUrl: '',
exportUrl: ''
},
dataList: [],
dataForm: {},
pageIndex: 1,
pageSize: 10,
totalPage: 0,
dataListLoading: false,
addOrUpdateVisible: false,
}
},
created () {
},
activated() {
this.getDataList();
},
methods: {
// 获取数据列表
getDataList() {
this.dataListLoading = true;
this.$http
.get(this.urlOptions.getDataListURL, {
params: {
page: this.pageIndex,
limit: this.pageSize,
...this.dataForm
},
})
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
this.dataList = [];
this.totalPage = 0;
return this.$message.error(res.msg);
}
this.dataList = res.data.list;
this.totalPage = res.data.total;
})
.catch(() => {
this.dataListLoading = false;
});
},
// 每页数
sizeChangeHandle(val) {
this.pageSize = val;
this.pageIndex = 1;
this.getDataList();
},
// 当前页
currentChangeHandle(val) {
this.pageIndex = val;
this.getDataList();
},
// 新增 / 修改
addOrUpdateHandle(id) {
this.addOrUpdateVisible = true;
this.$nextTick(() => {
this.$refs.addOrUpdate.init(id);
});
},
cancel(id) {
this.$refs["popover-" + id].showPopper = false;
},
changeStatus(id) {
this.$http
.post(this.urlOptions.statusUrl, { id })
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.$refs["popover-" + id].showPopper = false;
this.$message({
message: this.$t("prompt.success"),
type: "success",
duration: 500,
onClose: () => {
this.getDataList();
},
});
})
.catch(() => {});
},
// 删除
deleteHandle(id, name) {
this.$confirm(`确定对[名称=${name}]进行删除操作?`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$http.delete(this.urlOptions.deleteURL, { data: [id] }).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.getDataList();
},
});
} else {
this.$message.error(data.msg);
}
});
})
.catch(() => {});
},
// 导出
exportHandle(name) {
this.$http
.get(this.urlOptions.exportUrl, { responseType: "blob" })
.then(({ data: res }) => {
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth() + 1;
var strDate = date.getDate();
if (month >= 1 && month <= 9) {
month = "0" + month;
}
if (strDate >= 0 && strDate <= 9) {
strDate = "0" + strDate;
}
var currentdate = year + "-" + month + "-" + strDate;
const blob = new Blob([res]);
const downloadElement = document.createElement("a");
const href = window.URL.createObjectURL(blob); // 创建下载的链接
downloadElement.href = href;
downloadElement.download = `${name+currentdate}.xls`; // 下载后文件名
document.body.appendChild(downloadElement);
downloadElement.click(); // 点击下载
document.body.removeChild(downloadElement); // 下载完成移除元素
window.URL.revokeObjectURL(href);
})
.catch(() => {});
}
}
}

4
src/mixins/view-module.js
View File

@ -47,8 +47,8 @@ export default {
this.mixinViewModuleOptions.getDataListURL,
{
params: {
order: this.order,
orderField: this.orderField,
order: this.order?this.order:null,
orderField: this.orderField?this.orderField:null,
page: this.mixinViewModuleOptions.getDataListIsPage ? this.page : null,
limit: this.mixinViewModuleOptions.getDataListIsPage ? this.limit : null,
...this.dataForm

24
src/router/index.js
View File

@ -33,8 +33,12 @@ export const moduleRoutes = {
meta: { title: '主入口布局' },
children: [
{ path: '/home', component: () => import('@/views/modules/home'), name: 'home', meta: { title: '首页', isTab: true } },
{ path: '/echart-line', component: () => import('@/views/spc/echart-line'), name: 'echart-line', meta: { title: 'spc折线', isTab: true } },
{ path: '/echart-3line', component: () => import('@/views/spc/echart-3line'), name: 'echart-3line', meta: { title: 'spc3折线', isTab: true } },
{ path: '/echart-line', component: () => import('@/views/spc-chart/echart-line'), name: 'echart-line', meta: { title: 'spc折线', isTab: true } },
{ path: '/echart-3line', component: () => import('@/views/spc-chart/echart-3line'), name: 'echart-3line', meta: { title: 'spc3折线', isTab: true } },
{ path: '/echart-2line', component: () => import('@/views/spc-chart/echart-2line'), name: 'echart-2line', meta: { title: 'spc2折线', isTab: true } },
// 基础信息
{ path: '/productType', component: () => import('@/views/spc-basic/productType'), name: 'productType', meta: { title: '产品类型', isTab: true } },
{ path: '/productList', component: () => import('@/views/spc-basic/productList'), name: 'productList', meta: { title: '产品列表', isTab: true } },
{ path: '/factoryManage', component: () => import('@/views/spc-basic/factoryManage'), name: 'factoryManage', meta: { title: '工厂管理', isTab: true } },
@ -44,8 +48,20 @@ export const moduleRoutes = {
{ path: '/siteManage', component: () => import('@/views/spc-basic/siteManage'), name: 'siteManage', meta: { title: '站点管理', isTab: true } },
{ path: '/machineManage', component: () => import('@/views/spc-basic/machineManage'), name: 'machineManage', meta: { title: '机台管理', isTab: true } },
{ path: '/toolsType', component: () => import('@/views/spc-basic/toolsType'), name: 'toolsType', meta: { title: '量具管理', isTab: true } },
{ path: '/unitList', component: () => import('@/views/spc-basic/unitList'), name: 'unitList', meta: { title: '计量单位管理', isTab: true } }
{ path: '/unitList', component: () => import('@/views/spc-basic/unitList'), name: 'unitList', meta: { title: '计量单位管理', isTab: true } },
// 质量规划
{ path: '/controlGraph', component: () => import('@/views/quality-planning/controlGraph'), name: 'controlGraph', meta: { title: '控制图形', isTab: true } },
{ path: '/controlRatio', component: () => import('@/views/quality-planning/controlRatio'), name: 'controlRatio', meta: { title: '控制系数', isTab: true } },
{ path: '/interpretationScheme', component: () => import('@/views/quality-planning/interpretationScheme'), name: 'interpretationScheme', meta: { title: '判读方案', isTab: true } },
// 过程检验
{ path: '/generalOperation', component: () => import('@/views/process-inspection/generalOperation'), name: 'generalOperation', meta: { title: '通用作业', isTab: true } },
{ path: '/XbarRGraph', component: () => import('@/views/process-inspection/Metrological/XbarRGraph'), name: 'XbarRGraph', meta: { title: '均值极差控制图', isTab: true } },
{ path: '/XbarSGraph', component: () => import('@/views/process-inspection/Metrological/XbarSGraph'), name: 'XbarSGraph', meta: { title: '均值标准差控制图', isTab: true } },
{ path: '/XMRGraph', component: () => import('@/views/process-inspection/Metrological/XMRGraph'), name: 'XMRGraph', meta: { title: '单值移动极差控制图', isTab: true } },
{ path: '/CGraph', component: () => import('@/views/process-inspection/Counting/CGraph'), name: 'CGraph', meta: { title: 'C图', isTab: true } },
{ path: '/UGraph', component: () => import('@/views/process-inspection/Counting/UGraph'), name: 'UGraph', meta: { title: 'U图', isTab: true } },
{ path: '/NPGraph', component: () => import('@/views/process-inspection/Counting/NPGraph'), name: 'NPGraph', meta: { title: 'NP图', isTab: true } },
{ path: '/PGraph', component: () => import('@/views/process-inspection/Counting/PGraph'), name: 'PGraph', meta: { title: 'P图', isTab: true } },
]
}

136
src/views/main-sidebar.vue
View File

@ -15,11 +15,15 @@
</template>
<el-submenu index="product">
<template slot="title">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-config"></use></svg>
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-config"></use>
</svg>
<span>产品管理</span>
</template>
<el-menu-item index="productType" @click="$router.push({ name: 'productType' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-zonghe"></use></svg>
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-zonghe"></use>
</svg>
<span slot="title">产品类型</span>
</el-menu-item>
<el-menu-item index="productList" @click="$router.push({ name: 'productList' })">
@ -33,33 +37,45 @@
</el-menu-item>
<el-submenu index="process">
<template slot="title">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-config"></use></svg>
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-config"></use>
</svg>
<span>过程管理</span>
</template>
<el-menu-item index="processType" @click="$router.push({ name: 'processType' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-zonghe"></use></svg>
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-zonghe"></use>
</svg>
<span slot="title">工序类型</span>
</el-menu-item>
<el-menu-item index="processDefine" @click="$router.push({ name: 'processDefine' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-zonghe"></use></svg>
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-zonghe"></use>
</svg>
<span slot="title">工序定义</span>
</el-menu-item>
<el-menu-item index="processFlow" @click="$router.push({ name: 'processFlow' })">
<!-- <el-menu-item index="processFlow" @click="$router.push({ name: 'processFlow' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-zonghe"></use></svg>
<span slot="title">工艺流程</span>
</el-menu-item>
</el-menu-item> -->
</el-submenu>
<el-submenu index="Machine">
<template slot="title">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-config"></use></svg>
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-config"></use>
</svg>
<span>机台管理</span>
</template>
<el-menu-item index="siteManage" @click="$router.push({ name: 'siteManage' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-zonghe"></use></svg>
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-zonghe"></use>
</svg>
<span slot="title">站点管理</span>
</el-menu-item>
<el-menu-item index="machineManage" @click="$router.push({ name: 'machineManage' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-zonghe"></use></svg>
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-zonghe"></use>
</svg>
<span slot="title">机台管理</span>
</el-menu-item>
</el-submenu>
@ -74,18 +90,116 @@
</el-submenu>
<el-submenu index="spc">
<template slot="title">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-shoucang"></use></svg>
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-shoucang"></use>
</svg>
<span>SPC</span>
</template>
<el-menu-item index="echart-line" @click="$router.push({ name: 'echart-line' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-tubiao"></use></svg>
<span slot="title">spc折线</span>
</el-menu-item>
<el-menu-item index="echart-2line" @click="$router.push({ name: 'echart-2line' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-tubiao"></use></svg>
<span slot="title">spc2折线</span>
</el-menu-item>
<el-menu-item index="echart-line" @click="$router.push({ name: 'echart-3line' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-tubiao"></use></svg>
<span slot="title">spc3折线</span>
</el-menu-item>
</el-submenu>
<el-submenu index="quality">
<template slot="title">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#08质量"></use>
</svg>
<span>质量规划</span>
</template>
<el-menu-item index="controlGraph" @click="$router.push({ name: 'controlGraph' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#控制中心"></use></svg>
<span slot="title">控制图形</span>
</el-menu-item>
<el-menu-item index="controlRatio" @click="$router.push({ name: 'controlRatio' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#控制中心"></use></svg>
<span slot="title">控制系数</span>
</el-menu-item>
<el-menu-item index="interpretationScheme" @click="$router.push({ name: 'interpretationScheme' })">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#方案管理"></use></svg>
<span slot="title">判读方案</span>
</el-menu-item>
</el-submenu>
<el-submenu index="inspection">
<template slot="title">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-shoucang"></use>
</svg>
<span>过程检验</span>
</template>
<el-menu-item index="generalOperation" @click="$router.push({ name: 'generalOperation' })">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-log"></use>
</svg>
<span slot="title">通用作业</span>
</el-menu-item>
<el-submenu index="Metrological">
<template slot="title">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-log"></use>
</svg>
<span>计量分析</span>
</template>
<el-menu-item index="XbarRGraph" @click="$router.push({ name: 'XbarRGraph' })">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-tubiao"></use>
</svg>
<span slot="title">均值极差控制图</span>
</el-menu-item>
<el-menu-item index="XbarSGraph" @click="$router.push({ name: 'XbarSGraph' })">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-tubiao"></use>
</svg>
<span slot="title">均值标准差控制图</span>
</el-menu-item>
<el-menu-item index="XMRGraph" @click="$router.push({ name: 'XMRGraph' })">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-tubiao"></use>
</svg>
<span slot="title">单值移动极差控制图</span>
</el-menu-item>
</el-submenu>
<el-submenu index="Counting">
<template slot="title">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-log"></use>
</svg>
<span>计数分析</span>
</template>
<el-menu-item index="CGraph" @click="$router.push({ name: 'CGraph' })">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-tubiao"></use>
</svg>
<span slot="title">C图</span>
</el-menu-item>
<el-menu-item index="UGraph" @click="$router.push({ name: 'UGraph' })">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-tubiao"></use>
</svg>
<span slot="title">U图</span>
</el-menu-item>
<el-menu-item index="NPGraph" @click="$router.push({ name: 'NPGraph' })">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-tubiao"></use>
</svg>
<span slot="title">NP图</span>
</el-menu-item>
<el-menu-item index="PGraph" @click="$router.push({ name: 'PGraph' })">
<svg class="icon-svg aui-sidebar__menu-icon">
<use xlink:href="#icon-tubiao"></use>
</svg>
<span slot="title">P图</span>
</el-menu-item>
</el-submenu>
</el-submenu>
<sub-menu v-for="menu in $store.state.sidebarMenuList" :key="menu.id" :menu="menu" />
</el-menu>
</div>

8
src/views/modules/sys/role.vue
View File

@ -1,3 +1,10 @@
<!--
* @Author: zwq
* @Date: 2022-08-22 14:57:51
* @LastEditors: zwq
* @LastEditTime: 2022-12-07 14:54:22
* @Description:
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<div class="mod-sys__role">
@ -62,7 +69,6 @@ export default {
deleteIsBatch: true
},
dataForm: {
name: ''
}
}
},

3
src/views/pages/login.vue
View File

@ -52,7 +52,7 @@
<script>
import Cookies from 'js-cookie'
import debounce from 'lodash/debounce'
//import { getUUID } from '@/utils'
import { getUUID } from '@/utils'
export default {
data () {
return {
@ -86,6 +86,7 @@ export default {
methods: {
// 获取验证码
getCaptcha () {
this.dataForm.uuid = getUUID()
this.captchaPath = `${window.SITE_CONFIG['apiURL']}/captcha?uuid=${this.dataForm.uuid}`
},
// 表单提交

85
src/views/process-inspection/Counting/CGraph.vue Normal file
View File

@ -0,0 +1,85 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:22:53
* @LastEditors: zwq
* @LastEditTime: 2022-12-01 10:23:29
* @Description: C图
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<query-form
:page-name="'缺陷数图'"
:data-form="dataForm"
@getDataList="getDataList"
@rawData="rawData"
@exportHandle="exportHandle"
/>
<el-row :gutter="6" v-if="chartVisible">
<el-col :span="24">
<chart-line
ref="CGraph"
:chartLineName="'CGraph'"
:yName="'缺陷数'"
:title="chartTitle"
:data-list="dataList.list"
></chart-line>
</el-col>
</el-row>
</el-card>
</template>
<script>
import queryForm from "../query-form";
import processPage from "@/mixins/process-page";
import chartLine from "../charts/echart-3line.vue";
export default {
mixins: [processPage],
data() {
return {
urlOptions: {
exportUrl: "/basic/unit/export",
},
chartVisible: false,
chartTitle: "缺陷数图",
};
},
components: {
queryForm,
chartLine,
},
methods: {
// 获取数据列表
getDataList() {
this.$http
.post("/processInspection/CGraphTest")
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
this.dataList = [];
this.rightList = [];
return this.$message.error(res.msg);
}
this.dataList = res.data;
this.chartVisible = true;
this.$nextTick(() => {
this.$refs.CGraph.initChartLine();
});
})
.catch(() => {});
},
rawData() {
console.log("原始数据");
},
},
};
</script>
<style scoped>
.rightDiv {
padding: 8px 16px;
font-size: 16px;
background-color: #fdfdfd;
border-bottom: 1px solid #f5f5f5;
overflow: hidden;
}
</style>

85
src/views/process-inspection/Counting/NPGraph.vue Normal file
View File

@ -0,0 +1,85 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:22:53
* @LastEditors: zwq
* @LastEditTime: 2022-12-01 10:23:34
* @Description: NP图
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<query-form
:page-name="'NP图'"
:data-form="dataForm"
@getDataList="getDataList"
@rawData="rawData"
@exportHandle="exportHandle"
/>
<el-row :gutter="6" v-if="chartVisible">
<el-col :span="24">
<chart-line
ref="CGraph"
:chartLineName="'CGraph'"
:yName="'缺陷数'"
:title="chartTitle"
:data-list="dataList.list"
></chart-line>
</el-col>
</el-row>
</el-card>
</template>
<script>
import queryForm from "../query-form";
import processPage from "@/mixins/process-page";
import chartLine from "../charts/echart-3line.vue";
export default {
mixins: [processPage],
data() {
return {
urlOptions: {
exportUrl: "/basic/unit/export",
},
chartVisible: false,
chartTitle: "NP图",
};
},
components: {
queryForm,
chartLine,
},
methods: {
// 获取数据列表
getDataList() {
this.$http
.post("/processInspection/NPGraphTest")
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
this.dataList = [];
this.rightList = [];
return this.$message.error(res.msg);
}
this.dataList = res.data;
this.chartVisible = true;
this.$nextTick(() => {
this.$refs.CGraph.initChartLine();
});
})
.catch(() => {});
},
rawData() {
console.log("原始数据");
},
},
};
</script>
<style scoped>
.rightDiv {
padding: 8px 16px;
font-size: 16px;
background-color: #fdfdfd;
border-bottom: 1px solid #f5f5f5;
overflow: hidden;
}
</style>

85
src/views/process-inspection/Counting/PGraph.vue Normal file
View File

@ -0,0 +1,85 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:22:53
* @LastEditors: zwq
* @LastEditTime: 2022-12-01 10:23:38
* @Description: P图
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<query-form
:page-name="'NP图'"
:data-form="dataForm"
@getDataList="getDataList"
@rawData="rawData"
@exportHandle="exportHandle"
/>
<el-row :gutter="6" v-if="chartVisible">
<el-col :span="24">
<chart-line
ref="CGraph"
:chartLineName="'CGraph'"
:yName="'缺陷率'"
:title="chartTitle"
:data-list="dataList.list"
></chart-line>
</el-col>
</el-row>
</el-card>
</template>
<script>
import queryForm from "../query-form";
import processPage from "@/mixins/process-page";
import chartLine from "../charts/echart-3line.vue";
export default {
mixins: [processPage],
data() {
return {
urlOptions: {
exportUrl: "/basic/unit/export",
},
chartVisible: false,
chartTitle: "P图",
};
},
components: {
queryForm,
chartLine,
},
methods: {
// 获取数据列表
getDataList() {
this.$http
.post("/processInspection/PGraphTest")
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
this.dataList = [];
this.rightList = [];
return this.$message.error(res.msg);
}
this.dataList = res.data;
this.chartVisible = true;
this.$nextTick(() => {
this.$refs.CGraph.initChartLine();
});
})
.catch(() => {});
},
rawData() {
console.log("原始数据");
},
},
};
</script>
<style scoped>
.rightDiv {
padding: 8px 16px;
font-size: 16px;
background-color: #fdfdfd;
border-bottom: 1px solid #f5f5f5;
overflow: hidden;
}
</style>

85
src/views/process-inspection/Counting/UGraph.vue Normal file
View File

@ -0,0 +1,85 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:22:53
* @LastEditors: zwq
* @LastEditTime: 2022-12-01 10:23:43
* @Description: U图
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<query-form
:page-name="'U图'"
:data-form="dataForm"
@getDataList="getDataList"
@rawData="rawData"
@exportHandle="exportHandle"
/>
<el-row :gutter="6" v-if="chartVisible">
<el-col :span="24">
<chart-line
ref="CGraph"
:chartLineName="'CGraph'"
:yName="'单位缺陷'"
:title="chartTitle"
:data-list="dataList.list"
></chart-line>
</el-col>
</el-row>
</el-card>
</template>
<script>
import queryForm from "../query-form";
import processPage from "@/mixins/process-page";
import chartLine from "../charts/echart-3line.vue";
export default {
mixins: [processPage],
data() {
return {
urlOptions: {
exportUrl: "/basic/unit/export",
},
chartVisible: false,
chartTitle: "U图",
};
},
components: {
queryForm,
chartLine,
},
methods: {
// 获取数据列表
getDataList() {
this.$http
.post("/processInspection/UGraphTest")
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
this.dataList = [];
this.rightList = [];
return this.$message.error(res.msg);
}
this.dataList = res.data;
this.chartVisible = true;
this.$nextTick(() => {
this.$refs.CGraph.initChartLine();
});
})
.catch(() => {});
},
rawData() {
console.log("原始数据");
},
},
};
</script>
<style scoped>
.rightDiv {
padding: 8px 16px;
font-size: 16px;
background-color: #fdfdfd;
border-bottom: 1px solid #f5f5f5;
overflow: hidden;
}
</style>

172
src/views/process-inspection/Metrological/XMRGraph.vue Normal file
View File

@ -0,0 +1,172 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:23:42
* @LastEditors: zwq
* @LastEditTime: 2022-11-29 16:26:58
* @Description: 单值-移动极差 控制图
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<query-form
:page-name="'单值-移动极差控制图'"
:data-form="dataForm"
@getDataList="getDataList"
@rawData="rawData"
@exportHandle="exportHandle"
/>
<el-row :gutter="6" v-if="chartVisible">
<el-col :span="19">
<chart-line
ref="XMRGraph"
:chartLineName="'XMRGraph'"
:lineIndex='2'
:title="chartTitle"
:y-name1="yName1"
:y-name2="yName2"
:mrGraphEntity="dataList.xmrGraphEntity"
:processCapability="dataList.processCapability"
:rcl="dataList.rcl"
:sl="dataList.sl"
:xbarCL="dataList.xbarCL"
></chart-line>
</el-col>
<el-col :span="5" style="margin-top: 20px;">
<el-card>
<div v-for="item in rightList" :key="item.name" class="rightDiv">
{{ item.name }}<span style="float:right">{{ parseFloat(item.value).toFixed(4) }}</span>
</div>
<el-collapse>
<el-collapse-item title="单值数值" name="0">
<div
v-for="(val, key, index) in this.dataList.xbarCL"
:key="index + 'xbar'"
class="rightDiv"
>
{{ key }}<span style="float:right">{{ val.length?val: parseFloat(val).toFixed(4) }}</span>
</div>
</el-collapse-item>
<el-collapse-item title="移动极差数值" name="1">
<div
v-for="(val, key, index) in this.dataList.rcl"
:key="index + 'rcl'"
class="rightDiv"
>
{{ key }}<span style="float:right">{{ val.length?val: parseFloat(val).toFixed(4) }}</span>
</div>
</el-collapse-item>
<el-collapse-item title="waring:" name="2">
<div v-for="item in waring" :key="item" class="rightDiv">{{ item }}</div>
</el-collapse-item>
</el-collapse>
</el-card>
</el-col>
</el-row>
</el-card>
</template>
<script>
import queryForm from "../query-form";
import processPage from "@/mixins/process-page";
import chartLine from "../charts/echart-2line.vue";
export default {
mixins: [processPage],
data() {
return {
urlOptions: {
exportUrl: "/basic/unit/export",
},
chartVisible: false,
chartTitle: "单值-移动极差控制图",
yName1: "单值",
yName2: "移动极差",
rightList: [],
waring: [],
};
},
components: {
queryForm,
chartLine,
},
methods: {
// 获取数据列表
getDataList() {
this.$http
.post("/processInspection/XMRGraphTest")
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
this.dataList = [];
this.rightList = [];
return this.$message.error(res.msg);
}
this.dataList = res.data;
this.rightList = [];
// this.rightList.push({
// name: "cl(上图)",
// value: res.data.xbarCL.cl,
// });
// this.rightList.push({
// name: "lcl(上图)",
// value: res.data.xbarCL.lcl,
// });
// this.rightList.push({
// name: "ucl(上图)",
// value: res.data.xbarCL.ucl,
// });
Object.keys(res.data.sl).map((key) => {
this.rightList.push({
name: key,
value: res.data.sl[key],
});
});
// this.rightList.push({
// name: "cl(下图)",
// value: res.data.rcl.cl,
// });
// this.rightList.push({
// name: "lcl(下图)",
// value: res.data.rcl.lcl,
// });
// this.rightList.push({
// name: "ucl(下图)",
// value: res.data.rcl.ucl,
// });
Object.keys(res.data.standardDiviation).map((key) => {
this.rightList.push({
name: key,
value: res.data.standardDiviation[key],
});
});
Object.keys(res.data.processCapability).map((key) => {
if (key === "warming") {
this.waring = res.data.processCapability[key];
} else {
this.rightList.push({
name: key,
value: res.data.processCapability[key],
});
}
});
this.chartVisible = true;
this.$nextTick(() => {
this.$refs.XMRGraph.initChartLine();
});
})
.catch(() => {});
},
rawData() {
console.log("原始数据");
},
},
};
</script>
<style scoped>
.rightDiv {
padding: 8px 16px;
font-size: 16px;
background-color: #fdfdfd;
border-bottom: 1px solid #f5f5f5;
overflow: hidden;
}
</style>

184
src/views/process-inspection/Metrological/XbarRGraph.vue Normal file
View File

@ -0,0 +1,184 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:22:12
* @LastEditors: zwq
* @LastEditTime: 2022-12-12 16:40:23
* @Description: 均值极差控制图
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<query-form
ref="queryForm"
:page-name="'均值极差控制图'"
:data-form="dataForm"
@getDataList="getDataList"
@rawData="rawData"
@exportHandle="exportHandle"
/>
<el-row :gutter="6" v-if="chartVisible">
<el-col :span="19">
<chart-line
ref="chartRef"
:chartLineName="'XbarRGraph'"
:lineIndex="0"
:title="chartTitle"
:y-name1="yName1"
:y-name2="yName2"
:mrGraphEntity="dataList.mrGraphEntity"
:processCapability="dataList.processCapability"
:rcl="dataList.rcl"
:sl="dataList.sl"
:xbarCL="dataList.xbarCL"
></chart-line>
</el-col>
<el-col :span="5" style="margin-top: 20px;">
<el-card>
<div v-for="item in rightList" :key="item.name" class="rightDiv">
{{ item.name }}<span style="float:right">{{ parseFloat(item.value).toFixed(4) }}</span>
</div>
<el-collapse>
<el-collapse-item title="均值数值" name="0">
<div
v-for="(val, key, index) in this.dataList.xbarCL"
:key="index + 'xbar'"
class="rightDiv"
>
{{ key
}}<span style="float:right">{{
val.length ? val : parseFloat(val).toFixed(4)
}}</span>
</div>
</el-collapse-item>
<el-collapse-item title="极差数值" name="1">
<div
v-for="(val, key, index) in this.dataList.rcl"
:key="index + 'rcl'"
class="rightDiv"
>
{{ key
}}<span style="float:right">{{
val.length ? val : parseFloat(val).toFixed(4)
}}</span>
</div>
</el-collapse-item>
<el-collapse-item title="waring:" name="2">
<div v-for="item in waring" :key="item" class="rightDiv">{{ item }}</div>
</el-collapse-item>
</el-collapse>
</el-card>
</el-col>
</el-row>
</el-card>
</template>
<script>
import queryForm from "../query-form";
import processPage from "@/mixins/process-page";
import chartLine from "../charts/echart-2line.vue";
export default {
mixins: [processPage],
data() {
return {
urlOptions: {
exportUrl: "/basic/unit/export",
},
chartVisible: false,
chartTitle: "均值极差控制图",
yName1: "均值",
yName2: "极差",
rightList: [],
waring: [],
};
},
components: {
queryForm,
chartLine,
},
created() {
this.$nextTick(() => {
this.$refs.queryForm.getArr();
});
},
methods: {
// 获取数据列表
getDataList() {
this.$http
.post("/processInspection/XbarRGraphTest")
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
this.dataList = [];
this.rightList = [];
return this.$message.error(res.msg);
}
this.dataList = res.data;
this.rightList = [];
// this.rightList.push({
// name: "cl(上图)",
// value: res.data.xbarCL.cl,
// });
// this.rightList.push({
// name: "lcl(上图)",
// value: res.data.xbarCL.lcl,
// });
// this.rightList.push({
// name: "ucl(上图)",
// value: res.data.xbarCL.ucl,
// });
Object.keys(res.data.sl).map((key) => {
this.rightList.push({
name: key,
value: res.data.sl[key],
});
});
// this.rightList.push({
// name: "cl(下图)",
// value: res.data.rcl.cl,
// });
// this.rightList.push({
// name: "lcl(下图)",
// value: res.data.rcl.lcl,
// });
// this.rightList.push({
// name: "ucl(下图)",
// value: res.data.rcl.ucl,
// });
Object.keys(res.data.standardDiviation).map((key) => {
this.rightList.push({
name: key,
value: res.data.standardDiviation[key],
});
});
Object.keys(res.data.processCapability).map((key) => {
if (key === "warming") {
this.waring = res.data.processCapability[key];
} else {
this.rightList.push({
name: key,
value: res.data.processCapability[key],
});
}
});
this.chartVisible = true;
this.$nextTick(() => {
this.$refs.chartRef.initChartLine();
});
})
.catch(() => {});
},
rawData() {
console.log("原始数据");
},
},
};
</script>
<style scoped>
.rightDiv {
padding: 8px 16px;
font-size: 16px;
background-color: #fdfdfd;
border-bottom: 1px solid #f5f5f5;
overflow: hidden;
}
</style>

172
src/views/process-inspection/Metrological/XbarSGraph.vue Normal file
View File

@ -0,0 +1,172 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:22:53
* @LastEditors: zwq
* @LastEditTime: 2022-11-29 16:26:47
* @Description: 均值标准差控制图
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<query-form
:page-name="'均值标准差控制图'"
:data-form="dataForm"
@getDataList="getDataList"
@rawData="rawData"
@exportHandle="exportHandle"
/>
<el-row :gutter="6" v-if="chartVisible">
<el-col :span="19">
<chart-line
ref="chart1Ref"
:chartLineName="'XbarSGraph'"
:lineIndex='1'
:title="chartTitle"
:y-name1="yName1"
:y-name2="yName2"
:mrGraphEntity="dataList.msdGraphEntity"
:processCapability="dataList.processCapability"
:rcl="dataList.scl"
:sl="dataList.sl"
:xbarCL="dataList.xbarCL"
></chart-line>
</el-col>
<el-col :span="5" style="margin-top: 20px;">
<el-card>
<div v-for="item in rightList" :key="item.name" class="rightDiv">
{{ item.name }}<span style="float:right">{{ parseFloat(item.value).toFixed(4) }}</span>
</div>
<el-collapse>
<el-collapse-item title="均值数值" name="0">
<div
v-for="(val, key, index) in this.dataList.xbarCL"
:key="index + 'xbar'"
class="rightDiv"
>
{{ key }}<span style="float:right">{{ val.length?val: parseFloat(val).toFixed(4) }}</span>
</div>
</el-collapse-item>
<el-collapse-item title="标准差数值" name="1">
<div
v-for="(val, key, index) in this.dataList.scl"
:key="index + 'scl'"
class="rightDiv"
>
{{ key }}<span style="float:right">{{ val.length?val: parseFloat(val).toFixed(4) }}</span>
</div>
</el-collapse-item>
<el-collapse-item title="waring:" name="2">
<div v-for="item in waring" :key="item" class="rightDiv">{{ item }}</div>
</el-collapse-item>
</el-collapse>
</el-card>
</el-col>
</el-row>
</el-card>
</template>
<script>
import queryForm from "../query-form";
import processPage from "@/mixins/process-page";
import chartLine from "../charts/echart-2line.vue";
export default {
mixins: [processPage],
data() {
return {
urlOptions: {
exportUrl: "/basic/unit/export",
},
chartVisible: false,
chartTitle: "均值标准差控制图",
yName1: "均值",
yName2: "标准差",
rightList: [],
waring: [],
};
},
components: {
queryForm,
chartLine,
},
methods: {
// 获取数据列表
getDataList() {
this.$http
.post("/processInspection/XbarSGraphTest")
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
this.dataList = [];
this.rightList = [];
return this.$message.error(res.msg);
}
this.dataList = res.data;
this.rightList = [];
// this.rightList.push({
// name: "cl(上图)",
// value: res.data.xbarCL.cl,
// });
// this.rightList.push({
// name: "lcl(上图)",
// value: res.data.xbarCL.lcl,
// });
// this.rightList.push({
// name: "ucl(上图)",
// value: res.data.xbarCL.ucl,
// });
Object.keys(res.data.sl).map((key) => {
this.rightList.push({
name: key,
value: res.data.sl[key],
});
});
// this.rightList.push({
// name: "cl(下图)",
// value: res.data.rcl.cl,
// });
// this.rightList.push({
// name: "lcl(下图)",
// value: res.data.rcl.lcl,
// });
// this.rightList.push({
// name: "ucl(下图)",
// value: res.data.rcl.ucl,
// });
Object.keys(res.data.standardDiviation).map((key) => {
this.rightList.push({
name: key,
value: res.data.standardDiviation[key],
});
});
Object.keys(res.data.processCapability).map((key) => {
if (key === "warming") {
this.waring = res.data.processCapability[key];
} else {
this.rightList.push({
name: key,
value: res.data.processCapability[key],
});
}
});
this.chartVisible = true;
this.$nextTick(() => {
this.$refs.chart1Ref.initChartLine();
});
})
.catch(() => {});
},
rawData() {
console.log("原始数据");
},
},
};
</script>
<style scoped>
.rightDiv {
padding: 8px 16px;
font-size: 16px;
background-color: #fdfdfd;
border-bottom: 1px solid #f5f5f5;
overflow: hidden;
}
</style>

618
src/views/process-inspection/charts/echart-2line.vue Normal file
View File

@ -0,0 +1,618 @@
<template>
<div class="mod-demo-echarts">
<div :id="chartLineName" class="chart-box"></div>
</div>
</template>
<script>
import * as echarts from "echarts";
//import testdata from './testdata'
export default {
props: {
title: {
type: String,
},
chartLineName: {
type:String,
default: 'echartLine',
},
mrGraphEntity: {
type: Object,
default: () => {
return {};
},
},
processCapability: {
type: Object,
default: () => {
return {};
},
},
rcl: {
type: Object,
default: () => {
return {};
},
},
sl: {
type: Object,
default: () => {
return {};
},
},
xbarCL: {
type: Object,
default: () => {
return {};
},
},
yName1: {
type: String,
},
yName2: {
type: String,
},
lineIndex: {
type: Number,
default: 0
}
},
data() {
return {
ruleList: [
"违反规则一：控制图上有 1 个点位于三倍标准差以外",
"违反规则二：连续 9 点落在中心线的用一侧",
"违反规则三：连续 6 点递增或者递减",
"违反规则四：连续 14 点中 相邻点 交替上下",
"违反规则五：连续 3 点中 有 2 点 落在中心线同一侧，B区以外",
"违反规则六：连续 5 点中 有 4点 落在中心线同一侧，C区以外",
"违反规则七：连续 15 点 落在中心线两侧的C区内",
"违反规则八：连续 8 点 落在中心线两侧，且无一点在C区内",
"违反规则九：有 1 点落在规格线以外",
"违反规则十：CPK小于目标值",
],
upLine:[{name:'xbar',
rules:'xbarUnsatisfiedRules'},{name:'xbar',
rules:'xbarUnsatisfiedRules'},{name:'x',
rules:'xUnsatisfiedRules'}],
lowLine:[{name:'r',
rules:'rUnsatisfiedRules'},{name:'s',
rules:'sUnsatisfiedRules'},{name:'rs',
rules:'rsUnsatisfiedRules'}]
//testdata
};
},
mounted() {},
activated() {
// 由于给echart添加了resize事件, 在组件激活时需要重新resize绘画一次, 否则出现空白bug
if (this.chartLine1) {
this.chartLine1.resize();
}
},
methods: {
// 折线图
initChartLine() {
const rclUcl = this.rcl.ucl;
var option = {
title: {
text: this.title,
},
tooltip: {
// 悬浮提示框
trigger: "axis",
boundaryGap: false,
axisPointer: {
type: "cross",
label: {
backgroundColor: "#6a7985",
},
},
formatter: (e) => {
let alarmInfo = ''
e[0].data.sRule.forEach(item=>{
alarmInfo += this.ruleList[item - 1]+'<br/>'
})
return `
点位坐标: ${e[0].data.position}<br/>
${e[0].marker} 数值: ${e[0].data.value}<br/>
${e[0].marker} 规格: ${e[0].data.sl}<br/>
${e[0].marker} 异常信息:<br/> ${alarmInfo || "无"}
`;
},
},
toolbox: {
feature: {
dataView: { show: true, readOnly: false },
magicType: { show: true, type: ["line", "bar"] },
restore: { show: true },
saveAsImage: { show: true },
},
},
color: ["#f8f106", "#fe7576", "#a9b0d3", "#476fd4"],
//多个图，就有多个grid,排序默认0、1、2....
grid: [
//0降雨
{ x: "7%", y: "7%", height: "40%", left: "10%" },
//1水位流量
{ x: "7%", y2: "7%", height: "35%", left: "10%", bottom: "15%" },
],
legend: {
data: [this.yName1, this.yName2],
},
xAxis: [
{
show: false, //隐藏了x轴
type: "category",
gridIndex: 0, //对应前面grid的索引位置（第一个）
axisTick: {
alignWithLabel: true,
},
axisLabel: {
//interval:showNum, //x轴显示的数量，我这里是动态算的
},
},
{
type: "category",
gridIndex: 1, //对应前面grid的索引位置（第二个）
axisTick: {
alignWithLabel: true,
},
axisLabel: {
//interval:showNum,
},
},
],
yAxis: [
{
type: "value",
gridIndex: 1,
nameLocation: "middle",
name: this.yName2,
max: function(value) {
if (rclUcl > value.max + 1) {
return rclUcl + 0.5;
} else {
return value.max + 1;
}
},
splitLine: { show: false },
nameTextStyle: {
padding: 25,
},
position: "left",
axisLine: {
show: true,
lineStyle: {
//color: colors[2]
},
},
axisTick: {
show: true,
},
axisLabel: {
formatter: "{value}",
},
},
{
type: "value",
gridIndex: 0,
name: this.yName1,
min: function(value) {
return value.min - 1;
},
max: function(value) {
return value.max + 1;
},
splitLine: { show: false },
nameTextStyle: {
padding: 25,
},
nameLocation: "middle",
position: "left",
//nameLocation: 'start',//y轴name的位置
//inverse: true,
axisLine: {
show: true,
lineStyle: {
//color: colors[1]
},
},
axisTick: {
show: true,
},
axisLabel: {
formatter: "{value}",
textStyle: {
fontSize: 12, //y轴坐标轴上的字体大小
},
},
},
],
visualMap: [
{
// 折线颜色修改
type: "piecewise",
show: false,
dimension: 0,
seriesIndex: 0,
pieces: [],
inRange: {
// 在选中范围外 的视觉元素，这里设置在正常范围内的图形颜色
color: "blue",
},
outOfRange: {
// 在选中范围外 的视觉元素，这里设置在正常范围内的图形颜色
color: "blue",
},
},
{
// 折线颜色修改
type: "piecewise",
show: false,
dimension: 0,
seriesIndex: 1,
pieces: [],
inRange: {
// 在选中范围外 的视觉元素，这里设置在正常范围内的图形颜色
color: "blue",
},
outOfRange: {
// 在选中范围外 的视觉元素，这里设置在正常范围内的图形颜色
color: "blue",
},
},
],
dataZoom: [
// 轴放大
{
type: "inside",
start: 0,
end: 100,
},
{
start: 0,
end: 100,
},
{
type: "inside",
xAxisIndex: [0, 1],
start: 0,
end: 100,
},
{
show: true,
yAxisIndex: 0,
realtime: true,
left: 6,
start: 0,
end: 100,
},
{
show: true,
yAxisIndex: 1,
realtime: true,
left: 6,
start: 0,
end: 100,
},
],
series: [
{
name: this.yName1,
xAxisIndex: 0,
yAxisIndex: 1,
type: "line",
smooth: true,
symbol: "emptyDiamond", // 设定为实心点
symbolSize: 10,
lineStyle: {
// color: '#5470C6', // 这里不能设置颜色，不然会以这个为准，设置的范围变色将不起作用
width: 1,
},
markLine: {
// 最大值最小值均值线
symbol: "none",
label: {
normal: {
show: true,
position: "end",
formatter: "{name|{b}}--{c}",
rich: {
name: {
color: "blue",
fontSize: 16,
fontWeight: 400,
},
},
textStyle: {
color: "black", //标注线终点文字颜色
fontSize: 14,
fontWeight: 400,
},
},
},
data: [
{
lineStyle: {
color: "#990000",
type: "solid",
width: 3,
},
name: "ucl",
yAxis: this.xbarCL.ucl,
},
{
lineStyle: {
color: "#990000",
type: [5, 10],
width: 3,
dashOffset: 5,
},
name: "cl",
yAxis: this.xbarCL.cl,
},
{
lineStyle: {
color: "#990000",
type: "solid",
width: 3,
},
name: "lcl",
yAxis: this.xbarCL.lcl,
},
{
lineStyle: {
color: "#009900",
type: "solid",
width: 3,
},
name: "usl",
yAxis: this.sl.usl,
},
{
lineStyle: {
color: "#009900",
type: "solid",
width: 3,
},
name: "sl",
yAxis: this.sl.sl,
},
{
lineStyle: {
color: "#009900",
width: 3,
type: "solid",
},
name: "lsl",
yAxis: this.sl.lsl,
},
],
},
markPoint: {
// 标记
data: [],
symbolSize: 50, // 标记的大小
label: {
// 标记单位
fontSize: 10,
formatter: "{c}", // 单位
},
},
markArea: {
// 以y轴分割的区域
silent: false,
data: [
[
{
name: "",
itemStyle: {
color: "#fb512c",
opacity: 0.5,
},
yAxis: this.xbarCL.la[0],
},
{
yAxis: this.xbarCL.la[1],
},
],
[
{
name: "",
itemStyle: {
color: "#ffcc33",
opacity: 0.5,
},
yAxis: this.xbarCL.lb[0],
},
{
yAxis: this.xbarCL.lb[1],
},
],
[
{
name: "",
itemStyle: {
color: "#52b854",
opacity: 0.5,
},
yAxis: this.xbarCL.lc[0],
},
{
yAxis: this.xbarCL.uc[1],
},
],
[
{
name: "",
itemStyle: {
color: "#ffcc33",
opacity: 0.5,
},
yAxis: this.xbarCL.ub[0],
},
{
yAxis: this.xbarCL.ub[1],
},
],
[
{
name: "",
itemStyle: {
color: "#fb512c",
opacity: 0.5,
},
yAxis: this.xbarCL.ua[0],
},
{
yAxis: this.xbarCL.ua[1],
},
],
],
},
// areaStyle: {},
data: this.mrGraphEntity.list?.map((item) => {
const obj = {
position: item.position,
value: item[this.upLine[this.lineIndex].name],
sRule: item[this.upLine[this.lineIndex].rules],
sl:`ucl-${this.xbarCL.ucl.toFixed(2)} cl-${this.xbarCL.cl.toFixed(2)} lcl-${this.xbarCL.lcl.toFixed(2)} `
};
return obj;
}),
},
{
name: this.yName2,
type: "line",
xAxisIndex: 1,
yAxisIndex: 0,
type: "line",
smooth: true,
symbol: "emptyDiamond", // 设定为实心点
symbolSize: 10,
lineStyle: {
// color: '#5470C6', // 这里不能设置颜色，不然会以这个为准，设置的范围变色将不起作用
width: 1,
},
markLine: {
// 最大值最小值均值线
symbol: "none",
label: {
normal: {
show: true,
position: "end",
formatter: "{name|{b}}--{c}",
rich: {
name: {
color: "blue",
fontSize: 16,
fontWeight: 400,
},
},
textStyle: {
color: "black", //标注线终点文字颜色
fontSize: 14,
fontWeight: 400,
},
},
},
data: [
{
lineStyle: {
color: "#990000",
type: "solid",
width: 3,
},
name: "ucl",
yAxis: this.rcl.ucl,
},
{
lineStyle: {
color: "#990000",
width: 3,
type: [5, 10],
dashOffset: 5,
},
name: "cl",
yAxis: this.rcl.cl,
},
{
lineStyle: {
color: "#990000",
width: 3,
type: "solid",
},
name: "lcl",
yAxis: this.rcl.lcl,
},
],
},
markPoint: {
// 标记
data: [],
symbolSize: 50, // 标记的大小
label: {
// 标记单位
fontSize: 10,
formatter: "{c}", // 单位
},
},
// areaStyle: {},
data: this.mrGraphEntity.list?.map((item) => {
const obj = {
position: item.position,
value: item[this.lowLine[this.lineIndex].name],
sRule: item[this.lowLine[this.lineIndex].rules],
sl:`ucl-${this.rcl.ucl.toFixed(2)} cl-${this.rcl.cl.toFixed(2)} lcl-${this.rcl.lcl.toFixed(2)} `
};
return obj;
}),
},
],
};
this.mrGraphEntity.list?.forEach((item, index) => {
if (item[this.lowLine[this.lineIndex].rules].length) {
option.visualMap[1].pieces.push({
gte: index,
lt: index + 1,
color: "red",
});
option.series[1].markPoint.data.push({
value: item[this.lowLine[this.lineIndex].name],
coord: [index, item[this.lowLine[this.lineIndex].name]],
});
}
});
this.mrGraphEntity.list?.forEach((item, index) => {
if (item[this.upLine[this.lineIndex].rules].length) {
option.visualMap[0].pieces.push({
gte: index,
lt: index + 1,
color: "red",
});
option.series[0].markPoint.data.push({
value: item[this.upLine[this.lineIndex].name],
coord: [index, item[this.upLine[this.lineIndex].name]],
});
}
});
this.chartLine1 = echarts.init(document.getElementById(this.chartLineName));
this.chartLine1.setOption(option);
window.addEventListener("resize", () => {
this.chartLine1.resize();
});
},
},
};
</script>
<style lang="scss">
.mod-demo-echarts {
.chart-box {
min-height: 700px;
margin-top: 20px;
}
}
</style>

239
src/views/process-inspection/charts/echart-3line.vue Normal file
View File

@ -0,0 +1,239 @@
<template>
<div class="mod-demo-echarts">
<div :id="chartLineName" class="chart-box"></div>
</div>
</template>
<script>
import * as echarts from "echarts";
//import testdata from './testdata'
export default {
props: {
title: {
type: String,
},
chartLineName: {
type: String,
default: "echartLine",
},
yName: {
type: String,
},
dataList: {
type: Array,
default: () => {
return [];
},
},
},
data() {
return {
ruleList: [
"违反规则一：控制图上有 1 个点位于三倍标准差以外",
"违反规则二：连续 9 点落在中心线的用一侧",
"违反规则三：连续 6 点递增或者递减",
"违反规则四：连续 14 点中 相邻点 交替上下",
"违反规则五：连续 3 点中 有 2 点 落在中心线同一侧，B区以外",
"违反规则六：连续 5 点中 有 4点 落在中心线同一侧，C区以外",
"违反规则七：连续 15 点 落在中心线两侧的C区内",
"违反规则八：连续 8 点 落在中心线两侧，且无一点在C区内",
"违反规则九：有 1 点落在规格线以外",
"违反规则十：CPK小于目标值",
],
//testdata
};
},
mounted() {},
activated() {
// 由于给echart添加了resize事件, 在组件激活时需要重新resize绘画一次, 否则出现空白bug
if (this.chartLine) {
this.chartLine.resize();
}
},
methods: {
// 折线图
initChartLine() {
var option = {
title: {
text: this.title,
},
legend: {
data: [this.title, "LCL", "CL", "UCL"],
},
tooltip: {
// 悬浮提示框
trigger: "axis",
boundaryGap: false,
axisPointer: {
type: "cross",
label: {
backgroundColor: "#6a7985",
},
},
formatter: (e) => {
return `
点位坐标: ${e[0].data.position}<br/>
${e[0].marker} 数值: ${e[0].data.value}<br/>
${e[0].marker} 规格: ${e[0].data.sl}<br/>
${e[0].marker} 名称:${e[0].data.name}
`;
},
},
toolbox: {
feature: {
dataView: { show: true, readOnly: false },
magicType: { show: true, type: ["line", "bar"] },
restore: { show: true },
saveAsImage: { show: true },
},
},
grid: {
// 折线图内边距
left: "3%",
right: "4%",
bottom: "7%",
containLabel: true,
},
xAxis: {
type: "category",
boundaryGap: false,
},
yAxis: {
type: "value",
name: this.yName,
axisLine: {
show: true,
lineStyle: {
//color: colors[2]
},
},
axisTick: {
show: true,
},
axisLabel: {
formatter: "{value}",
},
},
dataZoom: [
// 轴放大
{
show: true,
realtime: true,
start: 0,
end: 100,
xAxisIndex: 0,
},
{
type: "inside",
realtime: true,
start: 0,
end: 100,
xAxisIndex: 0,
},
],
series: [
{
name: this.title,
type: "line",
lineStyle: {
color: "#5470c6",
},
markArea: {
// 以y轴分割的区域
silent: false,
data: [
],
},
data: this.dataList.map((item) => {
const obj = {
position: item.position,
value: item.value,
name: item.name,
sl:`ucl-${item.controlLimit.ucl.toFixed(2)} cl-${item.controlLimit.cl.toFixed(2)} lcl-${item.controlLimit.lcl.toFixed(2)} `
};
return obj;
}),
},
{
name: "LCL",
type: "line",
step: "middle",
showSymbol: false,
lineStyle: {
color: "#91cc75",
},
endLabel: {
formatter: "LCL",
show: true,
},
data: this.dataList.map((item) => {
const obj = {
position: item.position,
value: item.controlLimit.lcl,
name: item.name,
};
return obj;
}),
},
{
name: "CL",
type: "line",
step: "middle",
showSymbol: false,
lineStyle: {
color: "#ee6666",
},
endLabel: {
formatter: "CL",
show: true,
},
data: this.dataList.map((item) => {
const obj = {
position: item.position,
value: item.controlLimit.cl,
name: item.name,
};
return obj;
}),
},
{
name: "UCL",
type: "line",
step: "middle",
showSymbol: false,
lineStyle: {
color: "#fac858",
},
endLabel: {
formatter: "UCL",
show: true,
},
data: this.dataList.map((item) => {
const obj = {
position: item.position,
value: item.controlLimit.ucl,
name: item.name,
};
return obj;
}),
},
],
};
this.chartLine = echarts.init(document.getElementById(this.chartLineName));
this.chartLine.setOption(option);
window.addEventListener("resize", () => {
this.chartLine.resize();
});
},
},
};
</script>
<style lang="scss">
.mod-demo-echarts {
.chart-box {
min-height: 700px;
margin-top: 20px;
}
}
</style>

274
src/views/process-inspection/components/detail-table.vue Normal file
View File

@ -0,0 +1,274 @@
<!--
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-12-13 13:43:23
* @Description:
-->
<template>
<div>
<div style="margin-left:20px">
<el-button size="small" type="primary" @click="addSample()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
添加样本组
</el-button>
<el-button size="small" type="primary" @click="Submit()">
提交
</el-button>
</div>
<el-table
:data="dataList"
border
:stripe="true"
:header-cell-style="{
background: '#eef1f6',
color: '#606266',
height: '56px',
}"
:height="'80vh'"
v-loading="dataListLoading"
style="width: 100%;"
>
<el-table-column
v-for="item in tableProps"
:label="item.label"
:key="item.prop"
align="center"
>
<template slot-scope="scope">
<span v-if="scope.$index > 6">
<el-checkbox
v-if="item.fType === 2"
v-model="scope.row[item.prop]"
true-label="1"
false-label="0"
/>
<el-input
v-else
v-model="scope.row[item.prop]"
size="small"
clearable
:readonly="
item.label === '取样时间' || item.label === '样本号' || item.label === '批次号'
"
:placeholder="item.label"
/>
</span>
<span v-else>{{ scope.row[item.prop] }}</span>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
export default {
props: {
featuresList: {
type: Array,
default: () => {
[];
},
},
workingProcedureName: {
type: String,
},
inspectionSheetId: {
type: String,
},
numberOfGroupedSamples: {
type: Number,
default: 1,
},
batchNum: {
type: String,
},
},
data() {
return {
dataListLoading: false,
dataList: [],
tableProps: [],
sampleNum: 1,
};
},
methods: {
init() {
this.dataList.splice(0, this.dataList.length);
this.dataList = [
{
sampleNumber: "工序",
},
{
sampleNumber: "特性类型",
},
{
sampleNumber: "规格下限",
},
{
sampleNumber: "规格上限",
},
{
sampleNumber: "抽样数量",
},
{
sampleNumber: "参数规格",
},
{
sampleNumber: "频率",
},
];
this.tableProps = [
{
prop: "sampleNumber",
label: "样本号",
},
{
prop: "sampleTime",
label: "取样时间",
},
{
prop: "batchNum",
label: "批次号",
},
];
this.featuresList.forEach((item) => {
let obj = {
prop: item.name,
label: item.name,
fType: item.type,
};
this.tableProps.push(obj);
this.dataList[0][item.name] = this.workingProcedureName;
this.dataList[1][item.name] = { 1: "计量型", 2: "计数型" }[item.type];
this.dataList[2][item.name] = item.lsl;
this.dataList[3][item.name] = item.usl;
this.dataList[4][item.name] = item.sampleSize;
this.dataList[5][item.name] = item.specifications;
this.dataList[6][item.name] = item.samplingFrequency;
});
this.getInfluxdb();
this.dataListLoading = false;
this.$nextTick(() => {});
},
getInfluxdb() {
this.$http
.post(
`/processInspection/inspectionSheet/getFluxParamList?inspectionSheetId=${this.inspectionSheetId}`
)
.then((res) => {
res.data.forEach((item) => {
item.sampleTime = this.formatDateTime(item.sampleTime);
// item.events.forEach((item1) => {
// item[item1.argName] = item1.argValue;
// });
Object.assign(item, JSON.parse(item.jsonData));
this.dataList.push(item);
});
this.dataList.concat(res.data);
})
.catch(() => {});
},
addSample() {
let arr = [];
for (let i = 1; i <= parseInt(this.numberOfGroupedSamples); i++) {
let sampleNum = "";
if (i < 10) {
sampleNum = this.getSampleNum("0" + i);
} else {
sampleNum = this.getSampleNum(i);
}
let obj = {
inspectionSheetId: this.inspectionSheetId,
workingProcedureName: this.workingProcedureName,
sampleNumber: sampleNum,
sampleTime: new Date(),
batchNum: this.batchNum,
events: [],
};
this.featuresList.forEach((item) => {
let obj1 = {
time: new Date(),
inspectionSheetId: this.inspectionSheetId,
sampleNumber: sampleNum,
transationId: "",
};
if (item.type === 1) {
obj1.argName = item.name;
obj1.argValue = "";
} else {
obj1.argName = item.name;
obj1.argValue = 1;
}
obj.events.push(obj1);
});
// obj.jsonData = JSON.stringify(obj.jsonData);
arr.push(obj);
}
this.$http
.post("/processInspection/inspectionSheet/saveFluxParamList2", arr)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.$nextTick(() => {
this.$emit("refreshDataForm", this.inspectionSheetId);
});
})
.catch(() => {});
},
Submit() {
let arr = JSON.parse(JSON.stringify(this.dataList.slice(7)));
arr.forEach((item) => {
(item.workingProcedureName = this.workingProcedureName),
(item.sampleTime = new Date(item.sampleTime));
item.events=[]
this.featuresList.forEach((item1) => {
let obj1 = {
time: new Date(item.sampleTime),
inspectionSheetId: this.inspectionSheetId,
sampleNumber: item.sampleNumber,
transationId: "",
};
obj1.argName = item1.name;
obj1.argValue = item[item1.name];
item.events.push(obj1);
});
});
this.$http
.post("/processInspection/inspectionSheet/saveFluxParamList2", arr)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.init();
})
.catch(() => {});
},
getSampleNum(num) {
this.sampleNum = Math.ceil(this.dataList.slice(7).length / this.numberOfGroupedSamples) + 1;
return `00${this.sampleNum}${num}`;
},
formatDateTime(val) {
let date = "";
if (val) {
date = new Date(val);
} else {
date = new Date();
}
let y = date.getFullYear();
let MM = date.getMonth() + 1;
MM = MM < 10 ? "0" + MM : MM;
let d = date.getDate();
d = d < 10 ? "0" + d : d;
let h = date.getHours();
h = h < 10 ? "0" + h : h;
let m = date.getMinutes();
m = m < 10 ? "0" + m : m;
let s = date.getSeconds();
s = s < 10 ? "0" + s : s;
return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
},
},
};
</script>

83
src/views/process-inspection/components/features-table.vue Normal file
View File

@ -0,0 +1,83 @@
<!--
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-12-09 08:59:32
* @Description:
-->
<template>
<el-table
:data="dataList"
:stripe="true"
:header-cell-style="{
background: '#eef1f6',
color: '#606266',
height: '56px',
}"
v-loading="dataListLoading"
style="width: 100%;"
>
<el-table-column type="index" header-align="center" align="center" label="序号" width="50">
</el-table-column>
<el-table-column prop="workingProcedureName" align="center" label="工序"> </el-table-column>
<el-table-column prop="name" align="center" label="特性"> </el-table-column>
<el-table-column prop="defectLevel" align="center" label="缺陷等级">
<template slot-scope="scope">
<span>{{
{ 1: '致命缺陷',2: '严重缺陷',3: '轻微缺陷' }[
scope.row.defectLevel
]
}}</span>
</template> </el-table-column>
<el-table-column prop="type" align="center" label="特性类型">
<template slot-scope="scope">
<span>{{
{ 1: "计量型", 2: "计数型"}[
scope.row.type
]
}}</span>
</template></el-table-column>
<el-table-column prop="measureToolName" align="center" label="量具"> </el-table-column>
<el-table-column prop="usl" align="center" label="USL"> </el-table-column>
<el-table-column prop="sl" align="center" label="SL"> </el-table-column>
<el-table-column prop="lsl" align="center" label="LSL"> </el-table-column>
<el-table-column prop="black1" align="center" label="记录数量"> </el-table-column>
<el-table-column prop="black2" align="center" label="最大值"> </el-table-column>
<el-table-column prop="black3" align="center" label="最小值"> </el-table-column>
<el-table-column prop="black4" align="center" label="均值"> </el-table-column>
<el-table-column prop="black5" align="center" label="检验结果"> </el-table-column>
<el-table-column prop="black6" align="center" label="缺陷数量"> </el-table-column>
</el-table>
</template>
<script>
export default {
props: {
featuresList: {
type: Array,
default: () => {
[];
},
},
workingProcedureName: {
type: String,
},
},
data() {
return {
dataListLoading: false,
dataList: [],
};
},
methods: {
init() {
this.featuresList.forEach((item) => {
item.workingProcedureName = this.workingProcedureName;
});
this.dataList = JSON.parse(JSON.stringify(this.featuresList));
this.dataListLoading = false;
this.$nextTick(() => {});
},
},
};
</script>

432
src/views/process-inspection/components/generalOperation-add.vue Normal file
View File

@ -0,0 +1,432 @@
<!--
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-12-12 11:32:04
* @Description:
-->
<template>
<el-drawer :visible.sync="visible" size="90%" class="drawerClass" :before-close="handleClose">
<template slot="title">
<h3 style="margin:10px 20px">{{ !dataForm.id ? "登记" : "修改" }}</h3>
</template>
<el-collapse value="1" @change="handleChange">
<el-collapse-item name="1">
<template slot="title">
<h3 style="margin-left:20px">检验信息</h3>
</template>
<el-row :gutter="6">
<el-form
:model="dataForm"
:rules="dataRule"
ref="dataForm"
:disabled="!dataForm.id ? false : true"
@keyup.enter.native="dataFormSubmit()"
label-width="100px"
>
<el-col :span="6">
<el-form-item label="检验站点" prop="inspectionSite">
<el-input v-model="dataForm.inspectionSite" placeholder="检验站点"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="开单时间" prop="createTime">
<el-date-picker
v-model="dataForm.createTime"
type="datetime"
readonly
format="yyyy-MM-dd hh:mm:ss"
value-format="yyyy-MM-dd hh:mm:ss"
placeholder="选择日期时间"
:style="{ width: '100%' }"
>
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="订单号" prop="orderNumber">
<el-input v-model="dataForm.orderNumber" placeholder="订单号"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="批次号" prop="batchNumber">
<el-input v-model="dataForm.batchNumber" placeholder="批次号"></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="产品" prop="productId">
<el-select
v-model="dataForm.productId"
@change="getWorkingprocedureByProductId"
placeholder="请选择产品"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="item in optionArr.arr0"
:key="item.id"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="检验阶段" prop="inspectionStage">
<el-select
v-model="dataForm.inspectionStage"
:style="{ width: '100%' }"
@change="$forceUpdate()"
clearable
placeholder="请选择检验阶段"
>
<el-option
v-for="item in inspectionStageArr"
:key="item.name"
:label="item.name"
:value="item.value"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="工序" prop="workingProcedureId">
<el-select
v-model="dataForm.workingProcedureId"
@change="$forceUpdate()"
placeholder="请选择工序"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="item in optionArr.arr4"
:key="item.workingProcedureId"
:label="item.workingProcedureName"
:value="item.workingProcedureId"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="机台号" prop="machineId">
<el-select
v-model="dataForm.machineId"
placeholder="请选择机台号"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="item in optionArr.arr1"
:key="item.id"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="分组样本数" prop="numberOfGroupedSamples">
<el-input
v-model="dataForm.numberOfGroupedSamples"
placeholder="分组样本数"
disabled
></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="样本大小" prop="numberOfSamples">
<el-input
v-model="dataForm.numberOfSamples"
placeholder="样本大小"
disabled
></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="缺陷数量" prop="numberOfDefects">
<el-input
v-model="dataForm.numberOfDefects"
placeholder="缺陷数量"
disabled
></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="不良数量" prop="defectiveQuantity">
<el-input
v-model="dataForm.defectiveQuantity"
placeholder="不良数量"
disabled
></el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="班次" prop="shiftId">
<el-select
v-model="dataForm.shiftId"
placeholder="请选择班次"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="item in optionArr.arr2"
:key="item.id"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="生产人" prop="producer">
<el-select
:style="{ width: '100%' }"
v-model="dataForm.producer"
placeholder="请选择生产人"
>
<el-option
v-for="item in optionArr.arr3"
:key="item.id"
:label="item.realName"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="检验人" prop="inspector">
<el-select
:style="{ width: '100%' }"
v-model="dataForm.inspector"
placeholder="请选择检验人"
>
<el-option
v-for="item in optionArr.arr3"
:key="item.id"
:label="item.realName"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-form>
</el-row>
<el-row v-if="!dataForm.id">
<span style="margin-left:20px">
<el-button size="medium" type="primary" @click="dataFormSubmit()">开单</el-button>
<el-button size="medium" @click="visible = false">关闭</el-button>
</span>
</el-row>
</el-collapse-item>
<el-collapse-item name="2" v-if="dataForm.id">
<template slot="title">
<h3 style="margin-left:20px">特性信息</h3>
</template>
<features-table
v-if="featuresTableVisible"
:features-list="featuresList"
:workingProcedureName="workingProcedureName"
ref="featuresTable"
></features-table>
</el-collapse-item>
</el-collapse>
<div v-if="dataForm.id">
<el-divider content-position="left"><h3 style="font-size:15px">详情</h3></el-divider>
<detail-table
v-loading="detailLoading"
:inspectionSheetId="dataForm.id"
:batchNum="dataForm.batchNumber"
:numberOfGroupedSamples="dataForm.numberOfGroupedSamples"
:features-list="featuresList"
:workingProcedureName="workingProcedureName"
ref="detailTable"
@refreshDataForm="init"
></detail-table>
</div>
</el-drawer>
</template>
<script>
import basicAdd from "@/mixins/basic-add";
import featuresTable from "./features-table";
import detailTable from "./detail-table";
export default {
mixins: [basicAdd],
props: {
optionArr: {
type: Object,
default: () => {
{
}
},
},
},
data() {
return {
urlOptions: {
infoURL: "/processInspection/inspectionSheet",
},
inspectionStageArr: [],
dataForm: {
id: "",
inspectionSite: "",
createTime: new Date(),
orderNumber: "",
batchNumber: "",
productId: "",
inspectionStage: "",
workingProcedureId: "",
machineId: "",
shiftId: "",
numberOfGroupedSamples: 0,
numberOfSamples: "",
numberOfDefects: "",
defectiveQuantity: "",
producer: "",
inspector: "",
},
featuresTableVisible: false,
featuresList: [],
workingProcedureName: "",
detailLoading: false,
setData: true,
dataRule: {
productId: [{ required: true, message: "产品不能为空", trigger: "change" }],
inspectionStage: [{ required: true, message: "检验阶段不能为空", trigger: "change" }],
workingProcedureId: [{ required: true, message: "工序不能为空", trigger: "change" }],
},
};
},
components: {
featuresTable,
detailTable,
},
methods: {
getWorkingprocedureByProductId(val) {
this.dataForm.inspectionStage = "";
this.dataForm.workingProcedureId = "";
this.getWorkingprocedureArr(val);
},
getWorkingprocedureArr(val) {
if (val) {
const obj = this.optionArr.arr0.find((item) => {
return item.id === val;
});
const obj1 = { 1: "进货检验", 2: "过程检验", 3: "成品检验", 4: "出货检验" };
const inspectionStage = obj.inspectionStage.split(",");
this.inspectionStageArr = [];
inspectionStage.forEach((item) => {
this.inspectionStageArr.push({
value: item,
name: obj1[item],
});
});
this.$http
.get(`/basic/productWorkingprocedureRelation/getWorkingprocedureByProductId/${val}`)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.$set(this.optionArr, "arr4", res.data);
if (this.dataForm.id) {
this.workingProcedureName = this.optionArr.arr4.find((item) => {
return item.workingProcedureId === this.dataForm.workingProcedureId;
}).workingProcedureName;
this.$nextTick(() => {
this.$refs.detailTable.init();
});
this.detailLoading = false;
}
})
.catch(() => {});
} else {
this.inspectionStageArr = [];
this.$set(this.optionArr, "arr4", []);
}
},
setDataForm() {
this.detailLoading = true;
const obj = {
inspectionStage: this.dataForm.inspectionStage,
productId: this.dataForm.productId,
workingProcedureId: this.dataForm.workingProcedureId,
};
this.$http
.post("/processInspection/inspectionSheet/getInspectionSheetFeaturesList", obj)
.then(({ data: res }) => {
if (res.code !== 0) {
this.featuresList = [];
return this.$message.error(res.msg);
}
this.featuresList = res.data;
})
.catch(() => {});
this.dataForm.inspectionStage = String(this.dataForm.inspectionStage);
this.getWorkingprocedureArr(this.dataForm.productId);
},
handleChange(val) {
if (val.includes("2")) {
this.featuresTableVisible = true;
this.$nextTick(() => {
this.$refs.featuresTable.init();
});
}
},
// 表单提交
dataFormSubmit() {
this.$refs["dataForm"].validate((valid) => {
if (!valid) {
return false;
}
this.$http[!this.dataForm.id ? "post" : "put"](
"/processInspection/inspectionSheet",
this.dataForm
)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.$message({
message: this.$t("prompt.success"),
type: "success",
duration: 500,
onClose: () => {
this.init(res.data);
},
});
})
.catch(() => {});
});
},
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
this.inspectionStageArr = [];
this.$set(this.optionArr, "arr4", []);
done();
this.$emit("refreshDataList");
})
.catch((_) => {});
},
},
};
</script>
<style scoped>
.drawerClass >>> .el-drawer__header {
margin-bottom: 0;
padding: 0;
}
</style>

306
src/views/process-inspection/generalOperation.vue Normal file
View File

@ -0,0 +1,306 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:44:29
* @LastEditors: zwq
* @LastEditTime: 2022-12-09 11:16:58
* @Description:
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<el-row :gutter="6" style="background-color:#e6f7ff;margin:-20px;padding-top:10px;margin-bottom:0">
<el-form ref="dataForm" :model="dataForm" :rules="rules" size="small" label-width="80px">
<el-col :span="6">
<el-form-item label="检验时间" prop="time">
<el-date-picker
type="daterange"
v-model="time"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
:style="{ width: '100%' }"
start-placeholder="开始日期"
end-placeholder="结束日期"
range-separator="-"
clearable
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="检验站点" prop="inspectionSite">
<el-input
size="small"
v-model="dataForm.inspectionSite"
clearable
placeholder="请输入检验站点"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="产品" prop="productId">
<el-select
v-model="dataForm.productId"
@change="getWorkingprocedureByProductId"
placeholder="请选择产品"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="(item, index) in optionArr.arr0"
:key="index"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="工序" prop="workingProcedureId">
<el-select
v-model="dataForm.workingProcedureId"
placeholder="请选择工序"
filterable
clearable
@change="$forceUpdate()"
:style="{ width: '100%' }"
>
<el-option
v-for="(item, index) in optionArr.arr4"
:key="index"
:label="item.workingProcedureName"
:value="item.workingProcedureId"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="机台号" prop="machineId">
<el-select
v-model="dataForm.machineId"
placeholder="请选择机台号"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="(item, index) in optionArr.arr1"
:key="index"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="批次号" prop="batchNumber">
<el-input
size="small"
v-model="dataForm.batchNumber"
clearable
placeholder="请输入批次号"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="检验单号" prop="id">
<el-input size="small" v-model="dataForm.id" clearable placeholder="请输入检验单号" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="订单号" prop="orderNumber">
<el-input
size="small"
v-model="dataForm.orderNumber"
clearable
placeholder="请输入订单号"
/>
</el-form-item>
</el-col>
<el-col :span="12" :offset="12">
<el-form-item style="float:right;padding-right:20px">
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
登记
</el-button>
<el-button size="small" type="primary" @click="exportHandle('通用作业')">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-col>
</el-form>
</el-row>
<el-table
:data="dataList"
:stripe="true"
:header-cell-style="{
background: '#eef1f6',
color: '#606266',
height: '56px',
}"
v-loading="dataListLoading"
style="width: 100%;"
>
<el-table-column prop="id" align="center" label="检验单号"> </el-table-column>
<el-table-column prop="batchNumber" align="center" label="批次号"> </el-table-column>
<el-table-column prop="inspectionStage" align="center" label="检验阶段">
<template slot-scope="scope">
<span>{{
{ 1: "进货检验", 2: "过程检验", 3: "成品检验", 4: "出货检验" }[
scope.row.inspectionStage
]
}}</span>
</template>
</el-table-column>
<el-table-column prop="productName" align="center" label="产品名称"> </el-table-column>
<el-table-column prop="machineName" align="center" label="机台"> </el-table-column>
<el-table-column prop="workingProcedureName" align="center" label="工序"> </el-table-column>
<el-table-column prop="createTime" align="center" label="检验时间"> </el-table-column>
<el-table-column prop="shiftName" align="center" label="班次"> </el-table-column>
<el-table-column prop="numberOfSamples" align="center" label="抽样数量"> </el-table-column>
<el-table-column prop="numberOfDefects" align="center" label="缺陷数量"> </el-table-column>
<el-table-column prop="defectiveQuantity" align="center" label="不良数量"> </el-table-column>
<el-table-column prop="remark" align="center" label="备注"> </el-table-column>
<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
<template slot-scope="scope">
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">
<el-tooltip class="item" effect="dark" content="修改" placement="top">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-编辑"></use></svg>
</el-tooltip>
</el-button>
<el-button
type="text"
style="color:red"
size="small"
@click="deleteHandle(scope.row.id, scope.row.id)"
>
<el-tooltip class="item" effect="dark" content="删除" placement="top">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-删除"></use></svg>
</el-tooltip>
</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="pageSize"
:total="totalPage"
layout="total, sizes, prev, pager, next, jumper"
>
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update
:optionArr="optionArr"
v-if="addOrUpdateVisible"
ref="addOrUpdate"
@refreshDataList="getDataList"
></add-or-update>
</el-card>
</template>
<script>
import processPage from "@/mixins/process-page";
import AddOrUpdate from './components/generalOperation-add'
export default {
mixins: [processPage],
data() {
return {
urlOptions: {
getDataListURL: "/processInspection/inspectionSheet/page",
deleteURL: "/processInspection/inspectionSheet",
exportUrl: "/processInspection/inspectionSheet/export",
},
optionArrUrl: [
"/basic/product/page",
"/basic/machine/page",
"/basic/shift/page",
"/sys/user/page",
],
optionArr: {},
time: [],
rules: {},
};
},
components: {
AddOrUpdate,
},
created() {},
activated() {
this.getArr();
},
methods: {
getArr() {
this.optionArrUrl.forEach((item, index) => {
this.$http
.get(item, {
params: {
page: 1,
limit: 500,
},
})
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.$set(this.optionArr, `arr${index}`, res.data.list);
})
.catch(() => {});
});
},
getWorkingprocedureByProductId(val) {
this.dataForm.workingProcedureId = ''
if (val) {
this.$http
.get(`/basic/productWorkingprocedureRelation/getWorkingprocedureByProductId/${val}`)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.$set(this.optionArr, "arr4", res.data);
})
.catch(() => {});
}else{
this.$set(this.optionArr, "arr4", []);
}
},
getDataList() {
this.dataListLoading = true;
this.$http
.get(this.urlOptions.getDataListURL, {
params: {
page: this.pageIndex,
limit: this.pageSize,
startTime: this.time && this.time.length > 0 ? this.time[0] : "",
endTime: this.time && this.time.length > 0 ? this.time[1] : "",
...this.dataForm,
},
})
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
this.dataList = [];
this.totalPage = 0;
return this.$message.error(res.msg);
}
this.dataList = res.data.list;
this.totalPage = res.data.total;
})
.catch(() => {
this.dataListLoading = false;
});
},
},
};
</script>
<style></style>

255
src/views/process-inspection/query-form.vue Normal file
View File

@ -0,0 +1,255 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:44:29
* @LastEditors: zwq
* @LastEditTime: 2022-12-12 16:42:27
* @Description:
-->
<template>
<el-row :gutter="6" style="background-color:#e6f7ff;margin:-20px;padding-top:10px;margin-bottom:0">
<el-form ref="dataForm" :model="dataForm" :rules="rules" size="small" label-width="80px">
<el-col :span="6">
<el-form-item label="检验时间" prop="field101">
<el-date-picker
type="daterange"
v-model="dataForm.field101"
format="yyyy-MM-dd"
value-format="yyyy-MM-dd"
:style="{ width: '100%' }"
start-placeholder="开始日期"
end-placeholder="结束日期"
range-separator="-"
clearable
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="6" v-if="false">
<el-form-item label="工厂" prop="field102">
<el-select
v-model="dataForm.field102"
placeholder="请选择工厂"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="(item, index) in field102Options"
:key="index"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="检验类型" prop="field103">
<el-select
v-model="dataForm.field103"
placeholder="请选择检验类型"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="(item, index) in field103Options"
:key="index"
:label="item.label"
:value="item.value"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="产品" prop="productId">
<el-select
v-model="dataForm.productId"
placeholder="请选择产品"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="(item, index) in optionArr.arr0"
:key="index"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="工艺流程" prop="field105">
<el-select
v-model="dataForm.field105"
placeholder="请选择工艺流程"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="(item, index) in optionArr.arr1"
:key="index"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="特性" prop="field106">
<el-select
v-model="dataForm.field106"
placeholder="请选择特性"
filterable
clearable
:style="{ width: '100%' }"
>
<el-option
v-for="(item, index) in optionArr.arr2"
:key="index"
:label="item.name"
:value="item.id"
:disabled="item.disabled"
></el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="样本大小" prop="field111">
<el-input-number
v-model="dataForm.field111"
placeholder="样本大小"
:step="1"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="rawData()">
<svg class="icon-svg"><use xlink:href="#历史记录"></use></svg>
原始数据
</el-button>
<el-button size="small" type="primary" @click="exportHandle()">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-col>
</el-form>
</el-row>
</template>
<script>
export default {
props: {
pageName: {
type: String,
default: () => {
return "";
},
},
dataForm: {
type: Object,
default: () => {
return {};
},
},
},
data() {
return {
optionArrUrl: [
"/basic/product/page",
"/basic/workingProcedure/page",
],
optionArr: {},
rules: {
productId: [
{
required: true,
message: "请选择产品",
trigger: "change",
},
],
field106: [
{
required: true,
message: "请选择特性",
trigger: "change",
},
],
},
field103Options: [
{
label: "进货检验",
value: 1,
},
{
label: "过程检验",
value: 2,
},
{
label: "成品检验",
value: 3,
},
{
label: "出货检验",
value: 4,
},
],
};
},
created(){
},
methods: {
getArr(){
this.optionArrUrl.forEach((item, index) => {
this.$http
.get(item, {
params: {
page: 1,
limit: 500,
},
})
.then(({ data: res }) => {
if (res.code !== 0) {
this.$set(this.optionArr, `arr${index}`, []);
return this.$message.error(res.msg);
}
this.$set(this.optionArr, `arr${index}`, res.data.list);
})
.catch(() => {});
});
this.$http
.post("/processInspection/inspectionSheet/getInspectionSheetFeaturesList")
.then(({ data: res }) => {
if (res.code !== 0) {
this.$set(this.optionArr, 'arr2', []);
return this.$message.error(res.msg);
}
this.$set(this.optionArr, 'arr2', res.data);
})
.catch(() => {});
},
getDataList() {
this.$emit("getDataList");
},
rawData() {
this.$emit("rawData");
},
exportHandle() {
this.$emit("exportHandle", this.pageName);
},
},
};
</script>
<style></style>

66
src/views/quality-planning/components/controlRatio.js Normal file
View File

@ -0,0 +1,66 @@
/*
* @Author: zwq
* @Date: 2022-12-01 15:04:30
* @LastEditors: zwq
* @LastEditTime: 2022-12-01 15:39:48
* @Description:
*/
const dataArr = [
[2, 2.121, 3.76, 1.88, 2.659, 1, 1.88, 0.5642, 0.7979, 1.253, 0, 1.843, 0, 3.267, 0, 2.606, 1.128, 0.8865, 0.853, 0, 3.686, 0, 3.2672],
[3, 1.732, 2.394, 1.023, 1.954, 1.16, 1.187, 0.7236, 0.8862, 1.128, 0, 1.858, 0, 2.586, 0, 2.276, 1.693, 0.5907, 0.888, 0, 4.358, 0, 2.575],
[4, 1.5, 1.88, 0.729, 1.628, 1.092, 0.796, 0.7979, 0.9213, 1.085, 0, 1.808, 0, 2.266, 0, 2.088, 2.059, 0.4857, 0.88, 0, 4.689, 0, 2.282],
[5, 1.342, 1.596, 0.577, 1.427, 1.198, 0.691, 0.8407, 0.94, 1.064, 0, 1.756, 0, 2.089, 0, 1.964, 2.326, 0.4299, 0.864, 0, 4.198, 0, 2.115],
[6, 1.225, 1.41, 0.483, 1.287, 1.135, 0.549, 0.8686, 0.9515, 1.051, 0.026, 0.711, 0.03, 1.97, 0.029, 1.874, 2.534, 0.3946, 0.848, 0, 5.078, 0, 2.004],
[7, 1.134, 1.277, 0.419, 1.182, 1.214, 0.509, 0.8882, 0.9594, 1.042, 0.105, 1.672, 0.118, 1.882, 0.113, 1.806, 2.704, 0.3698, 0.833, 0.205, 5.203, 0.067, 1.924],
[8, 1.061, 1.175, 0.373, 1.099, 1.16, 0.432, 0.9027, 0.965, 1.036, 0.167, 1.638, 0.185, 1.851, 0.179, 1.751, 2.847, 0.3512, 0.82, 0.387, 5.307, 0.136, 1.864],
[9, 1, 1.094, 0.337, 1.032, 1.223, 0.412, 0.9139, 0.9693, 1.032, 0.219, 1.609, 0.239, 1.761, 0.232, 1.707, 2.97, 0.3367, 0.808, 0.546, 5.394, 0.184, 1.816],
[10, 0.949, 1.028, 0.308, 0.975, 1.176, 0.363, 0.9227, 0.9727, 1.028, 0.262, 1.584, 0.284, 1.716, 0.276, 1.669, 3.078, 0.3249, 0.797, 0.687, 5.469, 0.223, 1.777],
[11, 0.905, 0.973, 0.285, 0.927, 0, 0, 0.93, 0.9754, 1.025, 0.299, 1.561, 0.321, 1.679, 0.313, 1.637, 3.173, 0.3152, 0.787, 0.812, 5.534, 0.256, 1.744],
[12, 0.866, 0.925, 0.266, 0.886, 0, 0, 0.9359, 0.9776, 1.023, 0.331, 1.541, 0.354, 1.646, 0.346, 1.61, 3.258, 0.3069, 0.778, 0.924, 5.592, 0.284, 1.716],
[13, 0.832, 0.884, 0.249, 0.85, 0, 0, 0.941, 0.9794, 1.021, 0.359, 1.523, 0.382, 1.618, 0.374, 1.585, 3.336, 0.2998, 0.77, 1.026, 5.646, 0.308, 1.692],
[14, 0.802, 0.848, 0.235, 0.817, 0, 0, 0.9453, 0.981, 1.019, 0.384, 1.507, 0.406, 1.594, 0.399, 1.563, 3.407, 0.2935, 0.762, 1.121, 5.693, 0.329, 1.671],
[15, 0.775, 0.816, 0.223, 0.789, 0, 0, 0.949, 0.9823, 1.018, 0.406, 1.492, 0.428, 1.572, 0.421, 1.544, 3.472, 0.288, 0.755, 1.207, 5.737, 0.348, 1.652],
[16, 0.75, 0.788, 0.212, 0.763, 0, 0, 0.9523, 0.9835, 1.017, 0.427, 1.478, 0.448, 1.552, 0.44, 1.526, 3.532, 0.2831, 0.749, 1.285, 5.779, 0.364, 1.636],
[17, 0.728, 0.762, 0.203, 0.739, 0, 0, 0.9551, 0.9845, 1.016, 0.445, 1.465, 0.466, 1.534, 0.458, 1.511, 3.588, 0.2787, 0.743, 1.359, 5.187, 0.379, 1.621],
[18, 0.707, 0.738, 0.194, 0.718, 0, 0, 0.9576, 0.9854, 1.015, 0.461, 1.454, 0.482, 1.518, 0.475, 1.496, 3.64, 0.2747, 0.738, 1.426, 5.854, 0.392, 1.608],
[19, 0.688, 0.717, 0.187, 0.698, 0, 0, 0.9599, 0.9862, 1.014, 0.477, 1.443, 0.497, 1.503, 0.49, 1.483, 3.689, 0.2711, 0.733, 1.49, 5.888, 0.404, 1.596],
[20, 0.671, 0.697, 0.18, 0.68, 0, 0, 0.9619, 0.9869, 1.013, 0.491, 1.433, 0.51, 1.49, 0.504, 1.47, 3.735, 0.2677, 0.729, 1.548, 5.922, 0.414, 1.586],
[21, 0.655, 0.679, 0.173, 0.663, 0, 0, 0.9638, 0.9876, 1.013, 0.504, 1.424, 0.523, 1.477, 0.516, 1.459, 3.778, 0.2647, 0.724, 1.606, 5.95, 0.425, 1.575],
[22, 0.64, 0.662, 0.167, 0.647, 0, 0, 0.9655, 0.9882, 1.012, 0.516, 1.415, 0.534, 1.466, 0.528, 1.448, 3.819, 0.2618, 0.72, 1.659, 5.979, 0.434, 1.556],
[23, 0.626, 0.647, 0.162, 0.633, 0, 0, 0.967, 0.9887, 1.011, 0.527, 1.407, 0.545, 1.455, 0.539, 1.438, 3.858, 0.2592, 0.716, 1.71, 6.006, 0.443, 1.557],
[24, 0.612, 0.632, 0.157, 0.619, 0, 0, 0.9684, 0.9892, 1.011, 0.538, 1.399, 0.555, 1.445, 0.549, 1.429, 3.895, 0.2567, 0.712, 1.759, 6.031, 0.452, 1.548],
[25, 0.6, 0.619, 0.153, 0.606, 0, 0, 0.9696, 0.9896, 1.011, 0.548, 1.392, 0.565, 1.435, 0.559, 1.42, 3.931, 0.2544, 0.709, 1.804, 6.058, 0.459, 1.541],
]
export function list() {
let arr = []
dataArr.forEach(item => {
const obj = {
name: item[0],
A: item[1],
A1: item[2],
A2: item[3],
A3: item[4],
m3: item[5],
m3A2: item[6],
C2: item[7],
C4: item[8],
'1/C4': item[9],
B1: item[10],
B2: item[11],
B3: item[12],
B4: item[13],
B5: item[14],
B6: item[15],
d2: item[16],
'1/d2': item[17],
d3: item[18],
D1: item[19],
D2: item[20],
D3: item[21],
D4: item[22],
}
arr.push(obj)
})
return arr
}

180
src/views/quality-planning/components/interpretationScheme-add.vue Normal file
View File

@ -0,0 +1,180 @@
<!--
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-09-21 09:22:30
* @Description:
-->
<template>
<el-dialog
:title="!dataForm.id ? '新增' : '修改'"
:close-on-click-modal="false"
:visible.sync="visible"
>
<el-row :gutter="5">
<el-form
:model="dataForm"
:rules="dataRule"
ref="dataForm"
@keyup.enter.native="dataFormSubmit()"
label-width="80px"
>
<el-col :span="12">
<el-form-item label="编码" prop="code">
<el-input
v-model="dataForm.code"
oninput="value=value.replace(/[^\d]/g,'')"
placeholder="编码"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="名称" prop="name">
<el-input v-model="dataForm.name" placeholder="名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="24">
<el-divider content-position="left">监控图形一</el-divider>
<el-checkbox-group v-model="checkList">
<el-checkbox
style="width:100%;font-size:20px;margin:8px 5px"
v-for="item in ruleArr"
:key="item.id"
:label="item.id"
>{{ item.ruleKey.split("x")[0] }}
<el-input
v-show="item.ruleKey.split('x').length >= 2"
v-model="item.ruleValue1"
@blur="changeRule(item)"
style="width:60px"
></el-input>
{{ item.ruleKey.split("x")[1] }}
<el-input
v-show="item.ruleKey.split('x').length >= 3"
v-model="item.ruleValue2"
@blur="changeRule(item)"
style="width:60px"
></el-input>
{{ item.ruleKey.split("x")[2] }}
</el-checkbox>
</el-checkbox-group>
</el-col>
</el-form>
</el-row>
<span slot="footer" class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
<el-button type="primary" @click="dataFormSubmit()">确定</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
data() {
return {
urlOptions: {
submitURL: "/qualityPlanning/myInterpretationScheme/",
infoURL: "/qualityPlanning/myInterpretationScheme",
},
visible: false,
dataForm: {
id: "",
code: "",
name: "",
interpretationSchemeIds: "",
},
ruleArr: [],
checkList: [],
dataRule: {
code: [{ required: true, message: "编码不能为空", trigger: "blur" }],
name: [{ required: true, message: "名称不能为空", trigger: "blur" }],
type: [{ required: true, message: "单位分类不能为空", trigger: "change" }],
},
};
},
methods: {
init(id) {
this.dataForm.id = id || "";
this.checkList = [];
this.ruleArr = [];
this.visible = true;
this.$nextTick(() => {
this.$refs["dataForm"].resetFields();
if (this.dataForm.id) {
this.$http
.get(`${this.urlOptions.infoURL}/${this.dataForm.id}`)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.dataForm = res.data;
})
.catch(() => {});
this.$http
.post(
`/qualityPlanning/interpretationScheme/listByMyInterpretationSchemeId?myInterpretationSchemeId=${this.dataForm.id}`
)
.then(({ data: res }) => {
this.ruleArr = res;
res.forEach((item) => {
if (item.flag === 1) {
this.checkList.push(item.id);
}
});
})
.catch(() => {});
}
});
},
changeRule(item) {
this.$http
.put("/qualityPlanning/interpretationScheme", item)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
})
.catch(() => {});
},
// 表单提交
dataFormSubmit() {
this.$refs["dataForm"].validate((valid) => {
if (!valid) {
return false;
}
this.ruleArr.forEach((item) => {
if (this.checkList.findIndex((item1)=>item1===item.id) !== -1) {
item.flag = 1;
} else {
item.flag = 0;
}
});
this.$http
.put("/qualityPlanning/interpretationScheme/batchUpdate", this.ruleArr)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
})
.catch(() => {});
this.$http[!this.dataForm.id ? "post" : "put"](this.urlOptions.submitURL, this.dataForm)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.$message({
message: this.$t("prompt.success"),
type: "success",
duration: 500,
onClose: () => {
this.visible = false;
this.$emit("refreshDataList");
},
});
})
.catch(() => {});
});
},
},
};
</script>

102
src/views/quality-planning/controlGraph.vue Normal file
View File

@ -0,0 +1,102 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-select
size="small"
v-model="dataForm.type"
placeholder="请选择类型"
style="width:150px"
clearable
>
<el-option
v-for="(item, index) in typeArr"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
:stripe="true"
:header-cell-style="{
background: '#eef1f6',
color: '#606266',
height: '56px'
}"
v-loading="dataListLoading"
style="width: 100%;"
>
<el-table-column
type="index"
header-align="center"
align="center"
label="序号"
width="50"
>
</el-table-column>
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column prop="type" align="center" label="类型">
<template slot-scope="scope">
<span>{{
scope.row.type === '2' ? "计数" : "计量"
}}</span>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="pageSize"
:total="totalPage"
layout="total, sizes, prev, pager, next, jumper"
>
</el-pagination>
</el-card>
</template>
<script>
import basicPage from '@/mixins/basic-page'
export default {
mixins: [basicPage],
data() {
return {
urlOptions: {
getDataListURL: '/qualityPlanning/controlGraph/page',
deleteURL: '/qualityPlanning/controlGraph',
exportUrl: '/qualityPlanning/controlGraph/export'
},
typeArr: [
{
label: "计量",
value: "1",
},
{
label: "计数",
value: "2",
}
],
};
},
components: {
},
methods: {
},
};
</script>

121
src/views/quality-planning/controlRatio.vue Normal file
View File

@ -0,0 +1,121 @@
<!--
* @Author: zwq
* @Date: 2022-12-01 14:52:41
* @LastEditors: zwq
* @LastEditTime: 2022-12-01 16:34:58
* @Description:
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item label="样本大小:">
<el-input size="small" type="number" v-model="dataForm.name" placeholder="请输入样本大小" clearable />
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
:header-cell-style="{
background: '#eef1f6',
color: '#606266',
}"
class="rowClass"
v-loading="dataListLoading"
style="width: 100%;"
>
<el-table-column align="center" prop="name" label="样本大小" fixed="left"> </el-table-column>
<el-table-column align="center" label="均值管制图">
<el-table-column align="center" label="控制限系数">
<el-table-column align="center" prop="A" label="A"> </el-table-column>
<el-table-column align="center" prop="A1" label="A1"> </el-table-column>
<el-table-column align="center" prop="A2" label="A2"> </el-table-column>
<el-table-column align="center" prop="A3" label="A3"> </el-table-column>
</el-table-column>
</el-table-column>
<el-table-column align="center" label="中线系数">
<el-table-column align="center" label="控制限系数">
<el-table-column align="center" prop="m3" label="m3"> </el-table-column>
<el-table-column align="center" prop="m3A2" label="m3A2"> </el-table-column>
</el-table-column>
</el-table-column>
<el-table-column align="center" label="标准差管制图">
<el-table-column align="center" label="中线系数">
<el-table-column align="center" prop="C2" label="C2"> </el-table-column>
<el-table-column align="center" prop="C4" label="C4"> </el-table-column>
<el-table-column align="center" prop="1/C4" label="1/C4"> </el-table-column>
</el-table-column>
<el-table-column align="center" label="控制限系数">
<el-table-column align="center" prop="B1" label="B1"> </el-table-column>
<el-table-column align="center" prop="B2" label="B2"> </el-table-column>
<el-table-column align="center" prop="B3" label="B3"> </el-table-column>
<el-table-column align="center" prop="B4" label="B4"> </el-table-column>
<el-table-column align="center" prop="B5" label="B5"> </el-table-column>
<el-table-column align="center" prop="B6" label="B6"> </el-table-column>
</el-table-column>
</el-table-column>
<el-table-column align="center" label="极差管制图">
<el-table-column align="center" label="中线系数">
<el-table-column align="center" prop="d2" label="d2"> </el-table-column>
<el-table-column align="center" prop="1/d2" label="1/d2"> </el-table-column>
<el-table-column align="center" prop="d3" label="d3"> </el-table-column>
</el-table-column>
<el-table-column align="center" label="控制限系数">
<el-table-column align="center" prop="D1" label="D1"> </el-table-column>
<el-table-column align="center" prop="D2" label="D2"> </el-table-column>
<el-table-column align="center" prop="D3" label="D3"> </el-table-column>
<el-table-column align="center" prop="D4" label="D4"> </el-table-column>
</el-table-column>
</el-table-column>
</el-table>
</el-card>
</template>
<script>
import { list } from "./components/controlRatio";
export default {
data() {
return {
dataList: [],
dataForm: {
name: "",
},
dataListLoading: false,
};
},
components: {},
activated() {
this.getDataList();
},
methods: {
getDataList() {
this.dataListLoading = true;
if(parseInt(this.dataForm.name)>=2&&parseInt(this.dataForm.name)<=25){
this.dataList = list().filter((item,index) => {
return parseInt(this.dataForm.name) === (index+2);
})
}else{
this.dataList = list()
}
this.dataListLoading = false;
},
},
};
</script>
<style scoped>
.rowClass >>> td {
padding: 2px 0;
}
.rowClass >>> th {
padding: 4px 0;
}
</style>

107
src/views/quality-planning/interpretationScheme.vue Normal file
View File

@ -0,0 +1,107 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<query-form
:page-name="'判读方案'"
:data-form="dataForm"
@getDataList="getDataList"
@addOrUpdateHandle="addOrUpdateHandle"
@exportHandle="exportHandle"
/>
<el-table
:data="dataList"
:stripe="true"
:header-cell-style="{
background: '#eef1f6',
color: '#606266',
height: '56px'
}"
v-loading="dataListLoading"
style="width: 100%;"
>
<el-table-column
type="index"
header-align="center"
align="center"
label="序号"
width="50"
>
</el-table-column>
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column
fixed="right"
header-align="center"
align="center"
width="150"
label="操作"
>
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click="addOrUpdateHandle(scope.row.id)"
>
<el-tooltip
class="item"
effect="dark"
content="修改"
placement="top"
>
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-编辑"></use></svg>
</el-tooltip>
</el-button>
<el-button
type="text"
style="color:red"
size="small"
@click="deleteHandle(scope.row.id, scope.row.name)"
>
<el-tooltip class="item" effect="dark" content="删除" placement="top">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-删除"></use></svg>
</el-tooltip>
</el-button>
</template>
</el-table-column>
</el-table>
<el-pagination
@size-change="sizeChangeHandle"
@current-change="currentChangeHandle"
:current-page="pageIndex"
:page-sizes="[10, 20, 50, 100]"
:page-size="pageSize"
:total="totalPage"
layout="total, sizes, prev, pager, next, jumper"
>
</el-pagination>
<!-- 弹窗, 新增 / 修改 -->
<add-or-update
v-if="addOrUpdateVisible"
ref="addOrUpdate"
@refreshDataList="getDataList"
></add-or-update>
</el-card>
</template>
<script>
import AddOrUpdate from './components/interpretationScheme-add'
import queryForm from './query-form'
import basicPage from '@/mixins/basic-page'
export default {
mixins: [basicPage],
data() {
return {
urlOptions: {
getDataListURL: '/qualityPlanning/myInterpretationScheme/page',
deleteURL: '/qualityPlanning/myInterpretationScheme',
exportUrl: '/qualityPlanning/myInterpretationScheme/export'
},
};
},
components: {
AddOrUpdate,
queryForm,
},
methods: {
},
};
</script>

73
src/views/quality-planning/query-form.vue Normal file
View File

@ -0,0 +1,73 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:44:29
* @LastEditors: zwq
* @LastEditTime: 2022-09-16 13:52:21
* @Description:
-->
<template>
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input size="small" v-model="dataForm.name" clearable placeholder="请输入名称查询" />
</el-form-item>
<el-form-item>
<el-input size="small" v-model="dataForm.code" clearable placeholder="请输入编码查询" />
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
新增
</el-button>
<el-button size="small" type="primary" @click="exportHandle()">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-form>
</template>
<script>
export default {
props: {
pageName: {
type: String,
default: () => {
return "";
},
},
dataForm: {
type: Object,
default: () => {
return {};
},
},
},
data() {
return {
};
},
methods: {
getDataList() {
this.$emit("getDataList");
},
addOrUpdateHandle() {
this.$emit("addOrUpdateHandle");
},
exportHandle() {
this.$emit("exportHandle", this.pageName);
},
},
};
</script>
<style></style>

60
src/views/spc-basic/components/flowMethods.js
View File

@ -1,18 +1,23 @@
import { Addon} from '@antv/x6';
import { Addon } from '@antv/x6';
// 拖拽生成四边形
export const startDragToGraph = (graph,data,e) =>{
export const startDragToGraph = (graph, data, e) => {
const node =
graph.createNode({
label: '圆角矩形',
data: {
type: 'defaultYSquare'
},
shape: 'rect',
width: 100, //节点的宽度
height: 60, //节点的高度
attrs: {
label: {
text: data.name,
workingProcedureId: data.id,
fill: 'white',
fill: '#FFFFFF',
fontSize: 14,
textWrap: {
width: -10 ,
width: -10,
height: -10,
ellipsis: true,
},
@ -21,12 +26,13 @@ export const startDragToGraph = (graph,data,e) =>{
stroke: '#000000',
strokeWidth: 1,
fill: '#5bdeff',
rx: 10,
ry: 10,
}
},
ports: ports
})
const dnd = new Addon.Dnd({target:graph})
dnd.start(node,e)
const dnd = new Addon.Dnd({ target: graph })
dnd.start(node, e)
}
//下面是锚点的代码。 知道就行了 我就不一一写了。
export const ports = {
@ -101,3 +107,43 @@ export const ports = {
}
],
}
// 连线 label 设置
export const configEdgeLabel = (labelText, fontColor, fill, stroke) => {
if (!labelText) return { attrs: { labelText: { text: '' }, labelBody: { fill: '', stroke: '' } } }
return {
markup: [
{
tagName: 'rect',
selector: 'labelBody',
},
{
tagName: 'text',
selector: 'labelText',
},
],
attrs: {
labelText: {
text: labelText || '',
fill: fontColor || '#333',
textAnchor: 'middle',
textVerticalAnchor: 'middle',
},
labelBody: {
ref: 'labelText',
refX: -8,
refY: -5,
refWidth: '100%',
refHeight: '100%',
refWidth2: 16,
refHeight2: 10,
stroke: stroke || '#555',
fill: fill || '#fff',
strokeWidth: 2,
rx: 5,
ry: 5,
},
}
}
}

609
src/views/spc-basic/components/processFlow-graph.vue
View File

@ -2,13 +2,16 @@
* @Author: zwq
* @Date: 2022-09-01 15:42:34
* @LastEditors: zwq
* @LastEditTime: 2022-09-09 13:42:48
* @LastEditTime: 2022-12-12 15:44:25
* @Description:
-->
<template>
<el-row :gutter="20">
<el-col :span="3">
<el-card>
<el-card class="cardHeader">
<div slot="header" style="color:#409eff;text-align:center">
工序列表
</div>
<div
v-for="(item, index) in processArr"
:key="index"
@ -18,19 +21,164 @@
>
{{ item.name }}
</div>
<!-- <el-button type="primary">保存</el-button> -->
</el-card>
</el-col>
<el-col :span="21">
<div id="containerChart"></div>
<div v-if="editDrawer" class="edit-main">
<div class="edit-main-title">
<h3>{{ editTitle }}</h3>
<i class="el-icon-close" @click="closeEditForm"></i>
</div>
<div v-if="editTitle === '编辑节点'" class="form-main">
<el-form ref="nodeForm" :model="form" label-width="80px" size="mini">
<el-form-item label="节点文本">
<el-input
v-model="form.labelText"
size="small"
readonly
@input="changeNode('labelText', form.labelText)"
></el-input>
</el-form-item>
<!-- <el-form-item label="字体大小">
<el-input
v-model="form.fontSize"
size="small"
@input="changeNode('fontSize', form.fontSize)"
></el-input>
</el-form-item> -->
<el-form-item label="字体颜色">
<el-color-picker
v-model="form.fontFill"
@change="changeNode('fontFill', form.fontFill)"
></el-color-picker>
</el-form-item>
<el-form-item label="节点背景">
<el-color-picker
v-model="form.fill"
@change="changeNode('fill', form.fill)"
></el-color-picker>
</el-form-item>
<!-- <el-form-item label="边框颜色">
<el-color-picker
v-model="form.stroke"
@change="changeNode('stroke', form.stroke)"
></el-color-picker>
</el-form-item> -->
<div class="see-box">
<h5>预览</h5>
<div
class="see-item"
:style="{
background: form.fill,
color: form.fontFill,
'border-color': form.stroke,
'font-size': form.fontSize + 'px',
}"
>
{{ form.labelText }}
</div>
</div>
</el-form>
</div>
<!-- <div v-if="editTitle === '编辑连线'" class="form-main">
<el-form ref="edgeForm" :model="form" label-width="80px" size="mini">
<el-form-item label="标签内容">
<el-input
v-model="form.label"
size="small"
placeholder="标签文字，空则没有"
@input="
changeEdgeLabel(form.label, labelForm.fontColor, labelForm.fill, labelForm.stroke)
"
></el-input>
<div v-if="form.label" class="label-style">
<p>
字体颜色：<el-color-picker
v-model="labelForm.fontColor"
size="mini"
@change="
changeEdgeLabel(
form.label,
labelForm.fontColor,
labelForm.fill,
labelForm.stroke
)
"
></el-color-picker>
</p>
<p>
背景颜色：<el-color-picker
v-model="labelForm.fill"
size="mini"
@change="
changeEdgeLabel(
form.label,
labelForm.fontColor,
labelForm.fill,
labelForm.stroke
)
"
></el-color-picker>
</p>
<p>
描边颜色：<el-color-picker
v-model="labelForm.stroke"
size="mini"
@change="
changeEdgeLabel(
form.label,
labelForm.fontColor,
labelForm.fill,
labelForm.stroke
)
"
></el-color-picker>
</p>
</div>
</el-form-item>
<el-form-item label="线条颜色">
<el-color-picker
v-model="form.stroke"
size="small"
@change="changeEdgeStroke"
></el-color-picker>
</el-form-item>
<el-form-item label="线条宽度">
<el-input-number
v-model="form.strokeWidth"
size="small"
@change="changeEdgeStrokeWidth"
:min="2"
:step="2"
:max="6"
label="线条宽度"
></el-input-number>
</el-form-item>
<el-form-item label="双向箭头">
<el-switch v-model="form.isArrows" @change="changeEdgeArrows"></el-switch>
</el-form-item>
<el-form-item label="流动线条">
<el-switch v-model="form.isAnit" @change="changeEdgeAnit"></el-switch>
</el-form-item>
</el-form>
</div> -->
<div class="edit-btn">
<el-button type="primary" size="medium" @click="saveChange" style="width:100%"
>保存</el-button
>
<el-button type="danger" size="medium" @click="handlerDel" style="width:100%"
>删除此{{ editTitle === "编辑节点" ? "节点" : "连线" }}</el-button
>
</div>
</div>
</el-col>
</el-row>
</template>
<script>
import { Graph, Shape, FunctionExt } from "@antv/x6";
import { startDragToGraph, ports } from "./flowMethods.js";
import { startDragToGraph, configEdgeLabel } from "./flowMethods.js";
export default {
props: {
productId: {
@ -45,6 +193,14 @@ export default {
graph: "",
type: "grid",
selectCell: "",
editDrawer: false,
editTitle: "",
form: {},
labelForm: {
fontColor: "#333",
fill: "#FFF",
stroke: "#555",
},
connectEdgeType: {
//连线方式
connector: "normal",
@ -68,6 +224,20 @@ export default {
activated() {
this.init();
},
watch: {
value: {
handler: function() {
if (this.graph) {
this.selectCell = "";
this.editDrawer = false;
this.graph.dispose();
this.init();
}
},
deep: true,
immediate: true,
},
},
methods: {
init() {
this.getArr();
@ -101,106 +271,50 @@ export default {
modifiers: ["ctrl", "meta"],
},
grid: this.grid,
connecting: {
// 节点连接
anchor: "center",
connectionPoint: "anchor",
allowBlank: false,
snap: true,
},
createEdge() {
return new Shape.Edge({
attrs: {
line: {
stroke: "#1890ff",
strokeWidth: 1,
targetMarker: {
name: "classic",
size: 8,
},
strokeDasharray: 0, //虚线
style: {
animation: "ant-line 30s infinite linear",
},
},
},
label: {
text: "",
},
connector: _that.connectEdgeType.connector,
router: {
name: _that.connectEdgeType.router.name || "",
},
zIndex: 0,
});
},
});
// 鼠标移入移出节点
this.graph.on(
"node:mouseenter",
FunctionExt.debounce(() => {
const container = document.getElementById("containerChart");
const ports = container.querySelectorAll(".x6-port-body");
this.showPorts(ports, true);
}),
500
);
this.graph.on("node:mouseleave", (e) => {
const container = document.getElementById("containerChart");
const ports = container.querySelectorAll(".x6-port-body");
this.showPorts(ports, false);
});
// // 鼠标移入移出节点
// this.graph.on(
// "node:mouseenter",
// FunctionExt.debounce(() => {
// const container = document.getElementById("containerChart");
// const ports = container.querySelectorAll(".x6-port-body");
// this.showPorts(ports, true);
// }),
// 500
// );
// this.graph.on("node:mouseleave", (e) => {
// const container = document.getElementById("containerChart");
// const ports = container.querySelectorAll(".x6-port-body");
// this.showPorts(ports, false);
// });
//获取放置到画布上节点的位置
this.graph.on("node:added", ({ node }) => {
const { x, y } = node.position();
this.addProcess(node.attrs.label.workingProcedureId, x, y);
});
//这是鼠标抬起节点事件
this.graph.on("node:mouseup", ({ node }) => {
this.graph.on("node:moved", ({ node }) => {
const { x, y } = node.position();
this.updataNode(node.attrs.label.id, x, y);
this.updataNode(node.id, x, y);
});
//这是点击节点事件
this.graph.on("node:click", () => {
const cell = this.graph.getSelectedCells();
console.log(cell);
// 点击编辑
this.graph.on("cell:click", ({ cell }) => {
this.editForm(cell);
});
//这是右键节点事件
this.graph.on("node:contextmenu", (e) => {
console.log(e);
});
this.graph.on("selection:changed", (args) => {
args.added.forEach((cell) => {
this.selectCell = cell;
if (cell.isEdge()) {
cell.isEdge() && cell.attr("line/strokeDasharray", 5); //虚线蚂蚁线
cell.addTools([
{
name: "vertices",
args: {
padding: 4,
attrs: {
strokeWidth: 0.1,
stroke: "#2d8cf0",
fill: "#ffffff",
},
},
},
]);
}
});
args.removed.forEach((cell) => {
cell.isEdge() && cell.attr("line/strokeDasharray", 0); //正常线
cell.removeTools();
});
console.log(this.graph.toJSON());
});
},
showPorts(ports, show) {
for (let i = 0, len = ports.length; i < len; i = i + 1) {
ports[i].style.visibility = show ? "visible" : "hidden";
}
//链接边分离后触发
// this.graph.on("edge:connected", ({ isNew, edge }) => {
// if (isNew) {
// const source = edge.getSourceCell();
// const target = edge.getTargetCell();
// }
// });
},
// 是否展示节点
// showPorts(ports, show) {
// for (let i = 0, len = ports.length; i < len; i = i + 1) {
// ports[i].style.visibility = show ? "visible" : "hidden";
// }
// },
// 拖拽生成正方形或者圆形
startDrag(data, e) {
startDragToGraph(this.graph, data, e);
@ -233,6 +347,7 @@ export default {
}
this.dataList = res.data;
this.setNode();
this.setEdge();
})
.catch(() => {});
},
@ -240,15 +355,19 @@ export default {
let nodes = [];
this.dataList.forEach((item) => {
let obj = {};
obj.x = item.x;
(obj.id = item.id), (obj.x = item.x);
obj.y = item.y;
obj.width = 100;
obj.height = 60;
obj.label = "圆角矩形";
obj.data = {
type: "defaultYSquare",
};
obj.shape = "rect";
obj.attrs = {
label: {
text: item.workingProcedureName,
id: item.id,
fill: "white",
fill: item.fontcolor || "#FFFFFF",
fontSize: 14,
textWrap: {
width: -10,
@ -259,10 +378,11 @@ export default {
body: {
stroke: "#000000",
strokeWidth: 1,
fill: "#5bdeff",
fill: item.backcolor || "#5bdeff",
rx: 10,
ry: 10,
},
};
obj.ports = ports;
nodes.push(obj);
});
const data = {
@ -270,6 +390,22 @@ export default {
};
this.graph.fromJSON(data);
},
setEdge() {
let source, target;
if (this.dataList.length >= 2) {
this.dataList.forEach((item, index) => {
if (index % 2 === 0) {
source = item.id;
} else {
target = item.id;
this.graph.addEdge({
source: source,
target: target,
});
}
});
}
},
updataNode(id, x, y) {
const data = {
id: id,
@ -287,6 +423,7 @@ export default {
type: "success",
duration: 500,
});
this.getList();
})
.catch(() => {});
},
@ -314,18 +451,179 @@ export default {
})
.catch(() => {});
},
// 删除
deleteHandle(id, name) {
this.$confirm(`确定对[名称=${name}]进行删除操作?`, "提示", {
//编辑节点和线
editForm(cell) {
this.selectCell = cell;
console.log(cell);
// 编辑node节点
if (cell.isNode() && cell.data.type && cell.data.type.includes("default")) {
this.editTitle = "编辑节点";
const body = cell.attrs.body || cell.attrs.rect || cell.attrs.polygon || cell.attrs.circle;
this.form = {
labelText: cell.attrs.label.text || "",
fontSize: cell.attrs.label.fontSize || 14,
fontFill: cell.attrs.label.fill || "",
fill: body.fill || "",
stroke: body.stroke || "",
};
return (this.editDrawer = true);
}
// // 编辑线
// if (!cell.isNode() && cell.shape === "edge") {
// this.editTitle = "编辑连线";
// this.form = {
// label: cell.labels && cell.labels[0] ? cell.labels[0].attrs.labelText.text : "",
// stroke: cell.attrs.line.stroke || "",
// strokeWidth: cell.attrs.line.strokeWidth || "",
// isArrows: cell.attrs.line.sourceMarker ? true : false,
// isAnit: cell.attrs.line.strokeDasharray ? true : false,
// };
// // 看是否有label
// const edgeCellLabel = (cell.labels && cell.labels[0] && cell.labels[0].attrs) || false;
// if (this.form.label && edgeCellLabel) {
// this.labelForm = {
// fontColor: edgeCellLabel.labelText.fill || "#333",
// fill: edgeCellLabel.labelBody.fill || "#fff",
// stroke: edgeCellLabel.labelBody.stroke || "#555",
// };
// } else {
// this.labelForm = { fontColor: "#333", fill: "#FFF", stroke: "#555" };
// }
// return (this.editDrawer = true);
// }
},
closeEditForm() {
this.editDrawer = false;
},
// 修改一般节点
changeNode(type, value) {
switch (type) {
case "labelText":
this.selectCell.attr("label/text", value);
break;
case "fontSize":
this.selectCell.attr("label/fontSize", value);
break;
case "fontFill":
this.selectCell.attr("label/fill", value);
break;
case "fill":
this.selectCell.attr("body/fill", value);
break;
case "stroke":
this.selectCell.attr("body/stroke", value);
break;
}
},
// 修改边label属性
changeEdgeLabel(label, fontColor, fill, stroke) {
this.selectCell.setLabels([configEdgeLabel(label, fontColor, fill, stroke)]);
if (!label) this.labelForm = { fontColor: "#333", fill: "#FFF", stroke: "#555" };
},
// 修改边的颜色
changeEdgeStroke(val) {
this.selectCell.attr("line/stroke", val);
},
// 边的宽度
changeEdgeStrokeWidth(val) {
if (this.form.isArrows) {
this.selectCell.attr({
line: {
strokeWidth: val,
sourceMarker: {
width: 12 * (val / 2) || 12,
height: 8 * (val / 2) || 8,
},
targetMarker: {
width: 12 * (val / 2) || 12,
height: 8 * (val / 2) || 8,
},
},
});
} else {
this.selectCell.attr({
line: {
strokeWidth: val,
targetMarker: {
width: 12 * (val / 2) || 12,
height: 8 * (val / 2) || 8,
},
},
});
}
},
// 边的箭头
changeEdgeArrows(val) {
if (val) {
this.selectCell.attr({
line: {
sourceMarker: {
name: "block",
width: 12 * (this.form.strokeWidth / 2) || 12,
height: 8 * (this.form.strokeWidth / 2) || 8,
},
targetMarker: {
name: "block",
width: 12 * (this.form.strokeWidth / 2) || 12,
height: 8 * (this.form.strokeWidth / 2) || 8,
},
},
});
} else {
this.selectCell.attr({
line: {
sourceMarker: "",
targetMarker: {
name: "block",
size: 10 * (this.form.strokeWidth / 2) || 10,
},
},
});
}
},
// 边的添加蚂蚁线
changeEdgeAnit(val) {
if (val) {
this.selectCell.attr({
line: {
strokeDasharray: 5,
style: {
animation: "ant-line 30s infinite linear",
},
},
});
} else {
this.selectCell.attr({
line: {
strokeDasharray: 0,
style: {
animation: "",
},
},
});
}
},
// 删除节点
handlerDel() {
this.$confirm(
`此操作将永久删除此${this.editTitle === "编辑节点" ? "节点" : "连线"}, 是否继续?`,
"提示",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
}
)
.then(() => {
const cells = this.graph.getSelectedCells();
if (cells.length) {
this.$http
.delete("/basic/productWorkingprocedureRelation", { data: [id] })
.delete("/basic/productWorkingprocedureRelation", { data: [cells[0].id] })
.then(({ data }) => {
if (data && data.code === 0) {
this.graph.removeCells(cells);
this.form = {};
this.editDrawer = false;
this.$message({
message: "操作成功",
type: "success",
@ -338,9 +636,33 @@ export default {
this.$message.error(data.msg);
}
});
}
})
.catch(() => {});
}, //清空画布
},
saveChange() {
const cells = this.graph.getSelectedCells();
const data = {
id: cells[0].id,
backcolor: cells[0].attrs.body.fill,
fontcolor: cells[0].attrs.label.fill,
};
this.$http
.put("/basic/productWorkingprocedureRelation", data)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.$message({
message: this.$t("prompt.success"),
type: "success",
duration: 500,
});
this.getList();
})
.catch(() => {});
},
//清空画布
deleteAll() {
this.graph.clearCells();
},
@ -349,16 +671,20 @@ export default {
this.graph.dispose();
},
},
destroyed() {
console.log("销毁画布");
beforeDestroy() {
this.graph.dispose();
},
};
</script>
<style>
#containerChart {
<style lang="scss">
@keyframes ant-line {
to {
stroke-dashoffset: -1000;
}
}
</style>
<style>
.btn {
background-color: #5bdeff;
text-align: center;
@ -368,3 +694,68 @@ export default {
margin-bottom: 10px;
}
</style>
<style lang="scss" scoped="scoped">
.edit-main {
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 280px;
border-left: 1px solid #f2f2f2;
box-shadow: 0 -10px 10px rgba($color: #000000, $alpha: 0.3);
padding: 20px;
background: #fff;
box-sizing: border-box;
.edit-main-title {
display: flex;
justify-content: space-between;
align-items: center;
h3 {
flex: 1;
}
i {
cursor: pointer;
font-size: 20px;
opacity: 0.7;
&:hover {
opacity: 1;
}
}
}
.form-main {
padding: 10px 0;
.label-style {
background: #f2f2f2;
padding: 0 10px;
p {
display: flex;
align-items: center;
font-size: 12px;
}
}
}
.edit-btn {
display: flex;
align-items: center;
}
.see-box {
padding: 10px;
background: #f2f2f2;
h5 {
}
.see-item {
line-height: 60px;
text-align: center;
width: 100px;
height: 60px;
border-radius: 5px;
margin: auto;
border: 2px solid #333;
}
}
}
.el-card ::v-deep .el-card__header {
height: 60px;
}
</style>

44
src/views/spc-basic/components/productList-four-content.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-09-07 16:04:53
* @LastEditTime: 2022-12-13 16:00:33
* @Description:
-->
<template>
@ -20,7 +20,7 @@
border
style="width: 50%;"
>
<el-table-column prop="name"> </el-table-column>
<el-table-column prop="name" align="center"> </el-table-column>
<el-table-column
v-for="(item, index) in workingProcedure"
:key="item.id"
@ -38,7 +38,7 @@
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="特性列表">
<el-tab-pane label="特性列表" align="center">
<el-table
:data="dataList"
:stripe="true"
@ -57,14 +57,14 @@
width="50"
>
</el-table-column>
<el-table-column prop="code" label="编号"> </el-table-column>
<el-table-column prop="name" label="名称"></el-table-column>
<el-table-column prop="type" label="特性类型">
<el-table-column prop="code" align="center" label="编号"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"></el-table-column>
<el-table-column prop="type" align="center" label="特性类型">
<template slot-scope="scope">
<span>{{ scope.row.type === 2 ? "计数" : "计量" }}</span>
</template>
</el-table-column>
<el-table-column prop="defectLevel" label="缺陷等级">
<el-table-column prop="defectLevel" align="center" label="缺陷等级">
<template slot-scope="scope">
<span>{{
scope.row.defectLevel === 1
@ -75,24 +75,24 @@
}}</span>
</template>
</el-table-column>
<el-table-column prop="measureToolName" label="量具"></el-table-column>
<el-table-column prop="isSpc" label="SPC">
<el-table-column prop="measureToolName" align="center" label="量具"></el-table-column>
<el-table-column prop="isSpc" align="center" label="SPC">
<template slot-scope="scope">
<span>{{ scope.row.isSpc === 1 ? "是" : "否" }}</span>
</template>
</el-table-column>
<el-table-column prop="controlGraphName" label="分析图形"></el-table-column>
<el-table-column prop="sampleSize" label="样本大小"></el-table-column>
<el-table-column prop="samplingFrequency" label="抽样频率"></el-table-column>
<el-table-column prop="unitName" label="单位"></el-table-column>
<el-table-column prop="decimalPlaces" label="小数位数"></el-table-column>
<el-table-column prop="specifications" label="规格"></el-table-column>
<el-table-column prop="lsl" label="LSL"></el-table-column>
<el-table-column prop="sl" label="SL"></el-table-column>
<el-table-column prop="usl" label="USL"></el-table-column>
<el-table-column prop="targetCpk" label="目标CPK"></el-table-column>
<el-table-column prop="targetPpk" label="目标PPK"></el-table-column>
<el-table-column prop="remark" label="备注"></el-table-column>
<el-table-column prop="controlGraphName" align="center" label="分析图形"></el-table-column>
<el-table-column prop="sampleSize" align="center" label="样本大小"></el-table-column>
<el-table-column prop="samplingFrequency" align="center" label="抽样频率"></el-table-column>
<el-table-column prop="unitName" align="center" label="单位"></el-table-column>
<el-table-column prop="decimalPlaces" align="center" label="小数位数"></el-table-column>
<el-table-column prop="specifications" align="center" label="规格"></el-table-column>
<el-table-column prop="lsl" align="center" label="LSL"></el-table-column>
<el-table-column prop="sl" align="center" label="SL"></el-table-column>
<el-table-column prop="usl" align="center" label="USL"></el-table-column>
<el-table-column prop="targetCpk" align="center" label="目标CPK"></el-table-column>
<el-table-column prop="targetPpk" align="center" label="目标PPK"></el-table-column>
<el-table-column prop="remark" align="center" label="备注"></el-table-column>
<el-table-column
fixed="right"
header-align="center"
@ -176,7 +176,7 @@ export default {
methods: {
init(index) {
this.dataListLoading = false;
this.inspectionStage = parseInt(index) + 1;
this.inspectionStage = parseInt(index);
this.productFeaturesList.splice(0, this.productFeaturesList.length);
this.$nextTick(() => {
this.getSelection();

38
src/views/spc-basic/components/productList-four-history.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-09-07 16:06:00
* @LastEditTime: 2022-12-01 15:51:44
* @Description:
-->
<template>
@ -19,14 +19,14 @@
>
<el-table-column type="index" header-align="center" align="center" label="序号" width="50">
</el-table-column>
<el-table-column prop="code" label="编号"> </el-table-column>
<el-table-column prop="name" label="名称"></el-table-column>
<el-table-column prop="type" label="特性类型">
<el-table-column prop="code" align="center" label="编号"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"></el-table-column>
<el-table-column prop="type" align="center" label="特性类型">
<template slot-scope="scope">
<span>{{ scope.row.type === 2 ? "计数" : "计量" }}</span>
</template>
</el-table-column>
<el-table-column prop="defectLevel" label="缺陷等级">
<el-table-column prop="defectLevel" align="center" label="缺陷等级">
<template slot-scope="scope">
<span>{{
scope.row.defectLevel === 1
@ -37,24 +37,24 @@
}}</span>
</template>
</el-table-column>
<el-table-column prop="measureToolName" label="量具"></el-table-column>
<el-table-column prop="isSpc" label="SPC">
<el-table-column prop="measureToolName" align="center" label="量具"></el-table-column>
<el-table-column prop="isSpc" align="center" label="SPC">
<template slot-scope="scope">
<span>{{ scope.row.isSpc === 1 ? "是" : "否" }}</span>
</template>
</el-table-column>
<el-table-column prop="controlGraphName" label="分析图形"></el-table-column>
<el-table-column prop="sampleSize" label="样本大小"></el-table-column>
<el-table-column prop="samplingFrequency" label="抽样频率"></el-table-column>
<el-table-column prop="unitName" label="单位"></el-table-column>
<el-table-column prop="decimalPlaces" label="小数位数"></el-table-column>
<el-table-column prop="specifications" label="规格"></el-table-column>
<el-table-column prop="lsl" label="LSL"></el-table-column>
<el-table-column prop="sl" label="SL"></el-table-column>
<el-table-column prop="usl" label="USL"></el-table-column>
<el-table-column prop="targetCpk" label="目标CPK"></el-table-column>
<el-table-column prop="targetPpk" label="目标PPK"></el-table-column>
<el-table-column prop="remark" label="备注"></el-table-column>
<el-table-column prop="controlGraphName" align="center" label="分析图形"></el-table-column>
<el-table-column prop="sampleSize" align="center" label="样本大小"></el-table-column>
<el-table-column prop="samplingFrequency" align="center" label="抽样频率"></el-table-column>
<el-table-column prop="unitName" align="center" label="单位"></el-table-column>
<el-table-column prop="decimalPlaces" align="center" label="小数位数"></el-table-column>
<el-table-column prop="specifications" align="center" label="规格"></el-table-column>
<el-table-column prop="lsl" align="center" label="LSL"></el-table-column>
<el-table-column prop="sl" align="center" label="SL"></el-table-column>
<el-table-column prop="usl" align="center" label="USL"></el-table-column>
<el-table-column prop="targetCpk" align="center" label="目标CPK"></el-table-column>
<el-table-column prop="targetPpk" align="center" label="目标PPK"></el-table-column>
<el-table-column prop="remark" align="center" label="备注"></el-table-column>
</el-table>
<span slot="footer" class="dialog-footer">
<el-button @click="hisVisible = false">关闭</el-button>

6
src/views/spc-basic/components/productList-four.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-09-05 15:25:52
* @LastEditTime: 2022-12-13 16:00:28
* @Description:
-->
<template>
@ -87,12 +87,12 @@ export default {
return this.$message.error(res.msg);
}
this.workingProcedure = res.data;
this.$refs.fourContentRef[0].init(0);
this.$refs.fourContentRef[0].init(this.inspectionStageArr?.[0]);
})
.catch(() => {});
},
tabClick(val) {
this.$refs.fourContentRef[val.index].init(val.index);
this.$refs.fourContentRef[val.index].init(this.inspectionStageArr?.[val.index]);
},
// 表单提交
dataFormSubmit() {

51
src/views/spc-basic/components/productList-three-add.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-08-29 16:49:43
* @LastEditTime: 2022-12-12 15:51:58
* @Description:
-->
<template>
@ -33,6 +33,7 @@
<el-form-item label="特性类型" prop="type">
<el-select
v-model="threeDataForm.type"
@change="numIsblack"
:style="{ width: '100%' }"
filterable
placeholder="请选择特性类型"
@ -50,6 +51,7 @@
<el-col :span="8">
<el-form-item label="缺陷等级" prop="defectLevel">
<el-select
:disabled="threeDataForm.type === 2"
v-model="threeDataForm.defectLevel"
:style="{ width: '100%' }"
filterable
@ -68,6 +70,7 @@
<el-col :span="8">
<el-form-item label="量具" prop="measureToolId">
<el-select
:disabled="threeDataForm.type === 2"
v-model="threeDataForm.measureToolId"
placeholder="请选择单位"
clearable
@ -85,6 +88,7 @@
<el-col :span="8">
<el-form-item label="单位" prop="unitId">
<el-select
:disabled="threeDataForm.type === 2"
v-model="threeDataForm.unitId"
placeholder="请选择单位"
clearable
@ -101,22 +105,38 @@
</el-col>
<el-col :span="8">
<el-form-item label="规格" prop="specifications">
<el-input v-model="threeDataForm.specifications" placeholder="规格"></el-input>
<el-input
:disabled="threeDataForm.type === 2"
v-model="threeDataForm.specifications"
placeholder="规格"
></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="LSL" prop="lsl">
<el-input-number v-model="threeDataForm.lsl" placeholder="LSL"></el-input-number>
<el-input-number
:disabled="threeDataForm.type === 2"
v-model="threeDataForm.lsl"
placeholder="LSL"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="SL" prop="sl">
<el-input-number v-model="threeDataForm.sl" placeholder="SL"></el-input-number>
<el-input-number
:disabled="threeDataForm.type === 2"
v-model="threeDataForm.sl"
placeholder="SL"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="USL" prop="usl">
<el-input-number v-model="threeDataForm.usl" placeholder="USL"></el-input-number>
<el-input-number
:disabled="threeDataForm.type === 2"
v-model="threeDataForm.usl"
placeholder="USL"
></el-input-number>
</el-form-item>
</el-col>
<el-col :span="8">
@ -147,11 +167,11 @@ export default {
defectLevel: "",
measureToolId: "",
unitId: "",
specifications: '',
lsl: '',
sl: '',
usl: '',
remark: ''
specifications: "",
lsl: "",
sl: "",
usl: "",
remark: "",
},
typeArr: [
{
@ -238,6 +258,17 @@ export default {
})
.catch(() => {});
},
numIsblack(val){
if(val===2){
this.threeDataForm.defectLevel= ""
this.threeDataForm.measureToolId= ""
this.threeDataForm.unitId= ""
this.threeDataForm.specifications= ""
this.threeDataForm.lsl= 0
this.threeDataForm.sl= 0
this.threeDataForm.usl= 0
}
},
// 表单提交
dataFormSubmit() {
this.$refs["threeDataForm"].validate((valid) => {

24
src/views/spc-basic/components/productList-three.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-08-29 16:46:06
* @LastEditTime: 2022-12-01 15:52:10
* @Description:
-->
<template>
@ -26,14 +26,14 @@
>
<el-table-column type="index" header-align="center" align="center" label="序号" width="50">
</el-table-column>
<el-table-column prop="code" label="编号"> </el-table-column>
<el-table-column prop="name" label="名称"></el-table-column>
<el-table-column prop="type" label="特性类型">
<el-table-column prop="code" align="center" label="编号"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"></el-table-column>
<el-table-column prop="type" align="center" label="特性类型">
<template slot-scope="scope">
<span>{{ scope.row.type === 2 ? "计数" : "计量" }}</span>
</template>
</el-table-column>
<el-table-column prop="defectLevel" label="缺陷等级">
<el-table-column prop="defectLevel" align="center" label="缺陷等级">
<template slot-scope="scope">
<span>{{
scope.row.defectLevel === 1
@ -44,13 +44,13 @@
}}</span>
</template>
</el-table-column>
<el-table-column prop="measureToolName" label="量具"></el-table-column>
<el-table-column prop="unitName" label="单位"></el-table-column>
<el-table-column prop="specifications" label="规格"></el-table-column>
<el-table-column prop="lsl" label="LSL"></el-table-column>
<el-table-column prop="sl" label="SL"></el-table-column>
<el-table-column prop="usl" label="USL"></el-table-column>
<el-table-column prop="remark" label="备注"></el-table-column>
<el-table-column prop="measureToolName" align="center" label="量具"></el-table-column>
<el-table-column prop="unitName" align="center" label="单位"></el-table-column>
<el-table-column prop="specifications" align="center" label="规格"></el-table-column>
<el-table-column prop="lsl" align="center" label="LSL"></el-table-column>
<el-table-column prop="sl" align="center" label="SL"></el-table-column>
<el-table-column prop="usl" align="center" label="USL"></el-table-column>
<el-table-column prop="remark" align="center" label="备注"></el-table-column>
<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
<template slot-scope="scope">
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">

6
src/views/spc-basic/components/productList-two-table.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-09-07 15:25:36
* @LastEditTime: 2022-12-01 15:52:21
* @Description:
-->
<template>
@ -35,8 +35,8 @@
>
<el-table-column type="index" header-align="center" align="center" label="序号" width="50">
</el-table-column>
<el-table-column prop="workingProcedureName" label="工序名称"> </el-table-column>
<el-table-column prop="workingProcedureCode" label="工序编码"> </el-table-column>
<el-table-column prop="workingProcedureName" align="center" label="工序名称"> </el-table-column>
<el-table-column prop="workingProcedureCode" align="center" label="工序编码"> </el-table-column>
<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
<template slot-scope="scope">
<el-button

14
src/views/spc-basic/components/toolsType-detail.vue
View File

@ -2,7 +2,7 @@
* @Author: zwq
* @Date: 2021-11-18 14:16:25
* @LastEditors: zwq
* @LastEditTime: 2022-08-24 15:06:08
* @LastEditTime: 2022-12-01 15:52:40
* @Description:
-->
<template>
@ -30,12 +30,12 @@
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="code" label="编码"> </el-table-column>
<el-table-column prop="num" label="小数位数"> </el-table-column>
<el-table-column prop="USL" label="USL"> </el-table-column>
<el-table-column prop="SL" label="SL"> </el-table-column>
<el-table-column prop="LSL" label="LSL"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column prop="num" align="center" label="小数位数"> </el-table-column>
<el-table-column prop="USL" align="center" label="USL"> </el-table-column>
<el-table-column prop="SL" align="center" label="SL"> </el-table-column>
<el-table-column prop="LSL" align="center" label="LSL"> </el-table-column>
<el-table-column
fixed="right"
header-align="center"

40
src/views/spc-basic/factoryManage.vue
View File

@ -7,12 +7,26 @@
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
<el-input size="small" v-model="dataForm.name" clearable placeholder="请输入名称查询" />
</el-form-item>
<el-form-item>
<el-input size="small" v-model="dataForm.code" clearable placeholder="请输入编码查询" />
</el-form-item>
<el-form-item>
<el-select
size="small"
v-model="dataForm.paramKey"
v-model="dataForm.type"
placeholder="请选择类型"
style="width:150px"
clearable
placeholder="请输入关键字查询"
/>
>
<el-option
v-for="(item, index) in typeArr"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
@ -50,8 +64,8 @@
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="code" label="编码"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column
type="type"
header-align="center"
@ -65,8 +79,8 @@
</template>
</el-table-column>
<!-- <el-table-column prop="supplier" label="供应商"> </el-table-column> -->
<el-table-column prop="address" label="联系地址"> </el-table-column>
<el-table-column prop="descs" label="描述"> </el-table-column>
<el-table-column prop="address" align="center" label="联系地址"> </el-table-column>
<el-table-column prop="descs" align="center" label="描述"> </el-table-column>
<el-table-column
type="status"
header-align="center"
@ -158,6 +172,16 @@ export default {
statusUrl: '/basic/factory/status',
exportUrl: '/basic/factory/export'
},
typeArr: [
{
label: "内部工厂",
value: "1",
},
{
label: "供应商",
value: "2",
}
],
};
},
components: {

46
src/views/spc-basic/machineManage.vue
View File

@ -1,36 +1,12 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
size="small"
v-model="dataForm.paramKey"
clearable
placeholder="请输入关键字查询"
<query-form
:page-name="'机台管理'"
:data-form="dataForm"
@getDataList="getDataList"
@addOrUpdateHandle="addOrUpdateHandle"
@exportHandle="exportHandle"
/>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
新增
</el-button>
<el-button size="small" type="primary" @click="exportHandle('机台管理')">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
:stripe="true"
@ -50,10 +26,10 @@
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="code" label="编码"> </el-table-column>
<el-table-column prop="platformName" label="站点"> </el-table-column>
<el-table-column prop="remark" label="描述"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column prop="platformName" align="center" label="站点"> </el-table-column>
<el-table-column prop="remark" align="center" label="描述"> </el-table-column>
<el-table-column
type="status"
header-align="center"
@ -140,6 +116,7 @@
<script>
import AddOrUpdate from './components/machineManage-add'
import basicPage from '@/mixins/basic-page'
import queryForm from './query-form'
export default {
mixins: [basicPage],
data() {
@ -154,6 +131,7 @@ export default {
},
components: {
AddOrUpdate,
queryForm,
},
methods: {
},

46
src/views/spc-basic/processDefine.vue
View File

@ -1,36 +1,12 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
size="small"
v-model="dataForm.paramKey"
clearable
placeholder="请输入关键字查询"
<query-form
:page-name="'工序定义'"
:data-form="dataForm"
@getDataList="getDataList"
@addOrUpdateHandle="addOrUpdateHandle"
@exportHandle="exportHandle"
/>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
新增
</el-button>
<el-button size="small" type="primary" @click="exportHandle('工序定义')">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
:stripe="true"
@ -50,10 +26,10 @@
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="code" label="编码"> </el-table-column>
<el-table-column prop="workingProcedureTypeName" label="类型"> </el-table-column>
<el-table-column prop="machineName" label="机台">
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column prop="workingProcedureTypeName" align="center" label="类型"> </el-table-column>
<el-table-column prop="machineName" align="center" label="机台">
<template slot-scope="scope">
<span>{{ scope.row.machineName}}</span>
</template>
@ -164,6 +140,7 @@
import AddOrUpdate from './components/processDefine-add'
import BindMachine from './components/processDefine-machine'
import basicPage from '@/mixins/basic-page'
import queryForm from './query-form'
export default {
mixins: [basicPage],
data() {
@ -179,6 +156,7 @@ export default {
},
components: {
AddOrUpdate,
queryForm,
BindMachine
},
methods: {

839
src/views/spc-basic/processFlow.vue
View File

@ -1,152 +1,781 @@
<!--
* @Author: zwq
* @Date: 2022-08-22 15:53:16
* @Date: 2022-09-01 15:42:34
* @LastEditors: zwq
* @LastEditTime: 2022-09-01 16:42:08
* @LastEditTime: 2022-09-13 11:34:30
* @Description:
-->
<template>
<el-card shadow="never" class="aui-card--fill">
<el-row :gutter="10">
<el-col :span="10">
<el-form
style="background-color:#e6f7ff;padding:10px 20px"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
<el-row :gutter="20">
<el-col :span="3">
<el-card>
<div
v-for="(item, index) in processArr"
:key="index"
class="btn"
:title="item.name"
@mousedown="startDrag(item, $event)"
>
<el-form-item>
<el-input v-model="dataForm.paramKey" clearable placeholder="请输入关键字查询" />
{{ item.name }}
</div>
</el-card>
</el-col>
<el-col :span="21">
<div id="containerChart"></div>
<div v-if="editDrawer" class="edit-main">
<div class="edit-main-title">
<h3>{{ editTitle }}</h3>
<i class="el-icon-close" @click="closeEditForm"></i>
</div>
<div v-if="editTitle === '编辑节点'" class="form-main">
<el-form ref="nodeForm" :model="form" label-width="80px">
<el-form-item label="节点文本">
<el-input
v-model="form.labelText"
size="small"
@input="changeNode('labelText', form.labelText)"
></el-input>
</el-form-item>
<el-form-item>
<el-button @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-form-item label="字体大小">
<el-input
v-model="form.fontSize"
size="small"
@input="changeNode('fontSize', form.fontSize)"
></el-input>
</el-form-item>
<el-form-item label="字体颜色">
<el-color-picker
v-model="form.fontFill"
@change="changeNode('fontFill', form.fontFill)"
></el-color-picker>
</el-form-item>
<el-form-item label="节点背景">
<el-color-picker
v-model="form.fill"
@change="changeNode('fill', form.fill)"
></el-color-picker>
</el-form-item>
<el-form-item label="边框颜色">
<el-color-picker
v-model="form.stroke"
@change="changeNode('stroke', form.stroke)"
></el-color-picker>
</el-form-item>
<div class="see-box">
<h5>预览</h5>
<div
class="see-item"
:style="{
background: form.fill,
color: form.fontFill,
'border-color': form.stroke,
'font-size': form.fontSize + 'px',
}"
>
{{ form.labelText }}
</div>
</div>
</el-form>
</div>
<div v-if="editTitle === '编辑连线'" class="form-main">
<el-form ref="edgeForm" :model="form" label-width="80px">
<el-form-item label="标签内容">
<el-input
v-model="form.label"
size="small"
placeholder="标签文字，空则没有"
@input="
changeEdgeLabel(form.label, labelForm.fontColor, labelForm.fill, labelForm.stroke)
"
></el-input>
<div v-if="form.label" class="label-style">
<p>
字体颜色：<el-color-picker
v-model="labelForm.fontColor"
size="mini"
@change="
changeEdgeLabel(
form.label,
labelForm.fontColor,
labelForm.fill,
labelForm.stroke
)
"
></el-color-picker>
</p>
<p>
背景颜色：<el-color-picker
v-model="labelForm.fill"
size="mini"
@change="
changeEdgeLabel(
form.label,
labelForm.fontColor,
labelForm.fill,
labelForm.stroke
)
"
></el-color-picker>
</p>
<p>
描边颜色：<el-color-picker
v-model="labelForm.stroke"
size="mini"
@change="
changeEdgeLabel(
form.label,
labelForm.fontColor,
labelForm.fill,
labelForm.stroke
)
"
></el-color-picker>
</p>
</div>
</el-form-item>
<el-form-item label="线条颜色">
<el-color-picker
v-model="form.stroke"
size="small"
@change="changeEdgeStroke"
></el-color-picker>
</el-form-item>
<el-form-item label="线条样式">
<el-select
v-model="form.connector"
size="small"
placeholder="请选择"
@change="changeEdgeConnector"
>
<el-option label="直角" value="normal"></el-option>
<el-option label="圆角" value="rounded"></el-option>
<el-option label="平滑" value="smooth"></el-option>
<el-option label="跳线(两线交叉)" value="jumpover"></el-option>
</el-select>
</el-form-item>
<el-form-item label="线条宽度">
<el-input-number
v-model="form.strokeWidth"
size="small"
@change="changeEdgeStrokeWidth"
:min="2"
:step="2"
:max="6"
label="线条宽度"
></el-input-number>
</el-form-item>
<el-form-item label="双向箭头">
<el-switch v-model="form.isArrows" @change="changeEdgeArrows"></el-switch>
</el-form-item>
<el-form-item label="流动线条">
<el-switch v-model="form.isAnit" @change="changeEdgeAnit"></el-switch>
</el-form-item>
<el-form-item label="调整线条">
<el-switch v-model="form.isTools" @change="changeEdgeTools"></el-switch>
</el-form-item>
</el-form>
<el-table
:data="dataList"
height="650"
highlight-current-row
@current-change="handleCurrentChange"
:header-cell-style="{
background: '#eef1f6',
color: '#606266',
height: '56px',
}"
border
v-loading="dataListLoading"
style="width: 100%;"
</div>
<div class="edit-btn">
<el-button type="danger" @click="handlerDel" style="width:100%"
>删除此{{ editTitle === "编辑节点" ? "节点" : "连线" }}</el-button
>
<el-table-column
fixed="left"
type="index"
header-align="center"
align="center"
label="序号"
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称" fixed="left"> </el-table-column>
<el-table-column prop="code" label="编码" fixed="left"> </el-table-column>
</el-table>
</el-col>
<el-col :span="13" :offset="1">
<el-tabs @tab-click="tabClick">
<el-tab-pane label="图形模式">
<process-flow-graph
v-show="graphVisible"
ref="graphRef"
:product-id="productId"
@refreshDataList="getDataList"
></process-flow-graph>
</el-tab-pane>
<el-tab-pane label="表格模式">
<two-step v-show="twoStepVisible" ref="twoStepRef" :product-id="productId"></two-step>
</el-tab-pane>
</el-tabs>
</div>
</div>
</el-col>
</el-row>
</el-card>
</template>
<script>
import processFlowGraph from "./components/processFlow-graph";
import twoStep from "./components/productList-two";
import { Graph, Shape, FunctionExt } from "@antv/x6";
import { startDragToGraph, ports, configEdgeLabel } from "../spc-basic/components/flowMethods.js";
export default {
props: {
productId: {
type: String,
},
},
data() {
return {
dataListLoading: false,
dataList: [],
flowDataList: [],
graphVisible: true,
twoStepVisible: false,
dataForm: {
paramKey: "",
processArr: [],
processId: "",
graph: "",
type: "grid",
selectCell: "",
editDrawer: false,
editTitle: "",
form: {},
labelForm: {
fontColor: "#333",
fill: "#FFF",
stroke: "#555",
},
connectEdgeType: {
//连线方式
connector: "normal",
router: {
name: "",
},
},
grid: {
// 网格设置
size: 20, // 网格大小 10px
visible: true, // 渲染网格背景
type: "mesh",
args: {
color: "#D0D0D0",
thickness: 1, // 网格线宽度/网格点大小
factor: 10,
},
},
productId: "",
paneName: "图形模式",
};
},
components: {
processFlowGraph,
twoStep,
activated() {
this.init();
},
watch: {
value: {
handler: function() {
if (this.graph) {
this.selectCell = "";
this.editDrawer = false;
this.graph.dispose();
this.init();
}
},
deep: true,
immediate: true,
},
created() {
this.getDataList();
this.productId = ''
},
methods: {
getDataList() {
this.dataListLoading = true;
init() {
this.getArr();
this.$nextTick(() => {
this.processId = "";
if (this.productId) {
this.getList();
} else {
this.dataList = [];
}
});
this.graph = new Graph({
container: document.getElementById("containerChart"),
height: 600,
selecting: true,
background: {
color: "#fffbe6", // 设置画布背景颜色
},
snapline: {
enabled: true,
sharp: true,
},
// scroller: {
// enabled: true,
// pageVisible: false,
// pageBreak: false,
// pannable: true,
// },
mousewheel: {
enabled: true,
modifiers: ["ctrl", "meta"],
},
grid: this.grid,
connecting: {
// 节点连接
anchor: "center",
connectionPoint: "anchor",
allowBlank: false,
snap: true,
},
createEdge() {
return new Shape.Edge({
attrs: {
line: {
stroke: "#1890ff",
strokeWidth: 1,
targetMarker: {
name: "classic",
size: 8,
},
strokeDasharray: 0, //虚线
style: {
animation: "ant-line 30s infinite linear",
},
},
},
label: {
text: "",
},
connector: _that.connectEdgeType.connector,
router: {
name: _that.connectEdgeType.router.name || "",
},
zIndex: 0,
});
},
});
// 鼠标移入移出节点
this.graph.on(
"node:mouseenter",
FunctionExt.debounce(() => {
const container = document.getElementById("containerChart");
const ports = container.querySelectorAll(".x6-port-body");
this.showPorts(ports, true);
}),
500
);
this.graph.on("node:mouseleave", (e) => {
const container = document.getElementById("containerChart");
const ports = container.querySelectorAll(".x6-port-body");
this.showPorts(ports, false);
});
//获取放置到画布上节点的位置
this.graph.on("node:added", ({ node }) => {
const { x, y } = node.position();
this.addProcess(node.attrs.label.workingProcedureId, x, y);
});
//这是鼠标抬起节点事件
this.graph.on("node:mouseup", ({ node }) => {
const { x, y } = node.position();
this.updataNode(node.attrs.label.id, x, y);
});
// 点击编辑
this.graph.on('cell:click', ({ cell }) => {
this.editForm(cell)
})
},
showPorts(ports, show) {
for (let i = 0, len = ports.length; i < len; i = i + 1) {
ports[i].style.visibility = show ? "visible" : "hidden";
}
},
// 拖拽生成正方形或者圆形
startDrag(data, e) {
startDragToGraph(this.graph, data, e);
},
getArr() {
this.$http
.get("/basic/product/page", {
.get("/basic/workingProcedure/page", {
params: {
page: 1,
limit: 500,
code: this.dataForm.paramKey,
name: this.dataForm.paramKey,
},
})
.then(({ data: res }) => {
this.dataListLoading = false;
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.processArr = res.data.list;
})
.catch(() => {});
},
getList() {
this.$http
.get(
`/basic/productWorkingprocedureRelation/getWorkingprocedureByProductId/${this.productId}`
)
.then(({ data: res }) => {
if (res.code !== 0) {
this.dataList = [];
return this.$message.error(res.msg);
}
this.dataList = res.data.list;
this.dataList = res.data;
this.setNode();
})
.catch(() => {
this.dataListLoading = false;
});
.catch(() => {});
},
setNode() {
let nodes = [];
this.dataList.forEach((item) => {
let obj = {};
obj.x = item.x;
obj.y = item.y;
obj.width = 100;
obj.height = 60;
obj.label= '圆角矩形',
obj.data= {
type: 'defaultYSquare'
},
obj.shape= 'rect',
obj.attrs = {
label: {
text: item.workingProcedureName,
id: item.id,
fill: "white",
fontSize: 14,
textWrap: {
width: -10,
height: -10,
ellipsis: true,
},
},
body: {
stroke: "#000000",
strokeWidth: 1,
fill: "#5bdeff",
},
};
obj.ports = ports;
nodes.push(obj);
});
const data = {
nodes,
};
this.graph.fromJSON(data);
},
updataNode(id, x, y) {
const data = {
id: id,
x: x,
y: y,
};
this.$http
.put("/basic/productWorkingprocedureRelation", data)
.then(({ data: res }) => {
if (res.code !== 0) {
return this.$message.error(res.msg);
}
this.$message({
message: this.$t("prompt.success"),
type: "success",
duration: 500,
});
})
.catch(() => {});
},
addProcess(workingProcedureId, x, y) {
this.$http
.post("/basic/productWorkingprocedureRelation/save", {
workingProcedureId: workingProcedureId,
productId: this.productId,
x,
y,
})
.then(({ data: res }) => {
if (res.code !== 0) {
this.getList();
return this.$message.error(res.msg);
}
this.$message({
message: this.$t("prompt.success"),
type: "success",
duration: 500,
onClose: () => {
this.getList();
},
});
})
.catch(() => {});
},
//编辑节点和线
editForm(cell){
if(this.selectCell) this.selectCell.removeTools() // 删除修改线的工具
this.selectCell = cell
// 编辑node节点
console.log(cell.data)
if(cell.isNode() && cell.data.type && cell.data.type.includes('default')){
this.editTitle = '编辑节点'
const body = cell.attrs.body || cell.attrs.rect || cell.attrs.polygon || cell.attrs.circle
this.form = {
labelText: cell.attrs.label.text || '',
fontSize: cell.attrs.label.fontSize || 14,
fontFill: cell.attrs.label.fill || '',
fill: body.fill|| '',
stroke: body.stroke || ''
}
return this.editDrawer = true
}
// 编辑线
if(!cell.isNode() && cell.shape === 'edge'){
this.editTitle = '编辑连线'
this.form = {
label: (cell.labels && cell.labels[0]) ? cell.labels[0].attrs.labelText.text : '',
stroke: cell.attrs.line.stroke || '',
connector: 'rounded',
strokeWidth: cell.attrs.line.strokeWidth || '',
isArrows: cell.attrs.line.sourceMarker ? true : false,
isAnit: cell.attrs.line.strokeDasharray ? true : false,
isTools: false
}
// 看是否有label
const edgeCellLabel = cell.labels && cell.labels[0] && cell.labels[0].attrs || false
if(this.form.label && edgeCellLabel){
this.labelForm = {
fontColor: edgeCellLabel.labelText.fill || '#333',
fill: edgeCellLabel.labelBody.fill || '#fff',
stroke: edgeCellLabel.labelBody.stroke || '#555'
}
} else {
this.labelForm = { fontColor: '#333', fill: '#FFF', stroke: '#555' }
}
return this.editDrawer = true
}
},
closeEditForm(){
this.editDrawer = false
if(this.selectCell) this.selectCell.removeTools()
},
// 修改一般节点
changeNode(type, value){
switch (type) {
case 'labelText':
this.selectCell.attr('label/text', value)
break;
case 'fontSize':
this.selectCell.attr('label/fontSize', value)
break;
case 'fontFill':
this.selectCell.attr('label/fill', value)
break;
case 'fill':
this.selectCell.attr('body/fill', value)
break;
case 'stroke':
this.selectCell.attr('body/stroke', value)
break;
}
},
// 修改边label属性
changeEdgeLabel(label, fontColor, fill, stroke){
this.selectCell.setLabels([configEdgeLabel(label, fontColor, fill, stroke)])
if(!label) this.labelForm = { fontColor: '#333', fill: '#FFF', stroke: '#555' }
},
// 修改边的颜色
changeEdgeStroke(val){
this.selectCell.attr('line/stroke', val)
},
// 边的样式
changeEdgeConnector(val){
switch (val) {
case 'normal':
this.selectCell.setConnector(val)
break;
case 'smooth':
this.selectCell.setConnector(val)
break;
case 'rounded':
this.selectCell.setConnector(val, { radius: 20 })
break;
case 'jumpover':
this.selectCell.setConnector(val, { radius: 20 })
break;
}
},
// 边的宽度
changeEdgeStrokeWidth(val){
if(this.form.isArrows){
this.selectCell.attr({
line: {
strokeWidth: val,
sourceMarker: {
width: 12 * (val / 2) || 12,
height: 8 * (val / 2) || 8
},
targetMarker: {
width: 12 * (val / 2) || 12,
height: 8 * (val / 2) || 8
}
}
})
} else {
this.selectCell.attr({
line: {
strokeWidth: val,
targetMarker: {
width: 12 * (val / 2) || 12,
height: 8 * (val / 2) || 8
}
}
})
}
},
// 边的箭头
changeEdgeArrows(val){
if(val){
this.selectCell.attr({
line: {
sourceMarker: {
name: 'block',
width: 12 * (this.form.strokeWidth / 2) || 12,
height: 8 * (this.form.strokeWidth / 2) || 8
},
targetMarker: {
name: 'block',
width: 12 * (this.form.strokeWidth / 2) || 12,
height: 8 * (this.form.strokeWidth / 2) || 8
},
}
})
} else {
this.selectCell.attr({
line: {
sourceMarker: '',
targetMarker: {
name: 'block',
size: 10 * (this.form.strokeWidth / 2) || 10
},
}
})
}
},
// 边的添加蚂蚁线
changeEdgeAnit(val){
if(val){
this.selectCell.attr({
line: {
strokeDasharray: 5,
style: {
animation: 'ant-line 30s infinite linear',
}
}
})
} else {
this.selectCell.attr({
line: {
strokeDasharray: 0,
style: {
animation: '',
}
}
})
}
},
// 给线添加调节工具
changeEdgeTools(val){
if(val) this.selectCell.addTools(['vertices', 'segments'])
else this.selectCell.removeTools()
},
// 删除节点
handlerDel(){
this.$confirm(`此操作将永久删除此${this.editTitle === '编辑节点' ? '节点' : '连线'}, 是否继续?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
const cells = this.graph.getSelectedCells()
if (cells.length) {
this.graph.removeCells(cells)
this.form = {}
this.editDrawer = false
this.$message({type: 'success',message: '删除成功!'})
}
}).catch(() => {})
},
// 删除
deleteHandle(id, name) {
this.$confirm(`确定对[名称=${name}]进行删除操作?`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.$http
.delete("/basic/productWorkingprocedureRelation", { data: [id] })
.then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.getList();
},
tabClick(val) {
this.paneName = val.label;
if (val.label === "图形模式") {
this.twoStepVisible = false;
this.graphVisible = true;
this.$nextTick(() => {
this.$refs.graphRef.init();
});
} else {
this.graphVisible = false;
this.twoStepVisible = true;
this.$nextTick(() => {
this.$refs.twoStepRef.init();
this.$message.error(data.msg);
}
});
}
})
.catch(() => {});
}, //清空画布
deleteAll() {
this.graph.clearCells();
},
handleCurrentChange(val) {
if (val) {
this.productId = val.id;
const obj = {
label: this.paneName,
};
this.tabClick(obj);
}
//销毁画布
GraphDelete() {
this.graph.dispose();
},
},
beforeDestroy() {
this.graph.dispose();
},
};
</script>
<style lang="scss">
@keyframes ant-line {
to {
stroke-dashoffset: -1000
}
}
</style>
<style>
.btn {
background-color: #5bdeff;
text-align: center;
padding: 20px;
color: white;
cursor: move;
margin-bottom: 10px;
}
</style>
<style lang="scss" scoped="scoped">
.edit-main{
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 280px;
border-left: 1px solid #f2f2f2;
box-shadow: 0 -10px 10px rgba($color: #000000, $alpha: 0.3);
padding: 20px;
background: #fff;
box-sizing: border-box;
.edit-main-title{
display: flex;
justify-content: space-between;
align-items: center;
h3{
flex: 1;
}
i{
cursor: pointer;
font-size: 20px;
opacity: 0.7;
&:hover{
opacity: 1;
}
}
}
.form-main{
padding: 20px 0;
.label-style{
background: #f2f2f2;
padding: 0 10px;
p{
display: flex;
align-items: center;
font-size: 12px;
}
}
}
.edit-btn{
}
.see-box{
padding: 20px;
background: #f2f2f2;
h5{
padding-bottom: 10px;
}
.see-item{
padding: 10px 30px;
border: 2px solid #333;
text-align: center;
}
}
}
</style>

42
src/views/spc-basic/processType.vue
View File

@ -1,36 +1,12 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
size="small"
v-model="dataForm.paramKey"
clearable
placeholder="请输入关键字查询"
<query-form
:page-name="'工序类型'"
:data-form="dataForm"
@getDataList="getDataList"
@addOrUpdateHandle="addOrUpdateHandle"
@exportHandle="exportHandle"
/>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
新增
</el-button>
<el-button size="small" type="primary" @click="exportHandle('工序类型')">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
:stripe="true"
@ -50,8 +26,8 @@
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="code" label="编码"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column
type="status"
header-align="center"
@ -133,6 +109,7 @@
<script>
import AddOrUpdate from './components/processType-add'
import basicPage from '@/mixins/basic-page'
import queryForm from './query-form'
export default {
mixins: [basicPage],
data() {
@ -147,6 +124,7 @@ export default {
},
components: {
AddOrUpdate,
queryForm,
},
methods: {
},

140
src/views/spc-basic/productList.vue
View File

@ -7,12 +7,42 @@
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
<el-input size="small" v-model="dataForm.name" clearable placeholder="请输入名称查询" />
</el-form-item>
<el-form-item>
<el-input size="small" v-model="dataForm.code" clearable placeholder="请输入编码查询" />
</el-form-item>
<el-form-item>
<el-select
size="small"
v-model="dataForm.paramKey"
v-model="dataForm.product_type_id"
placeholder="请选择产品类型"
style="width:150px"
clearable
placeholder="请输入关键字查询"
/>
>
<el-option
v-for="(item, index) in productTypeArr"
:key="index"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-select
size="small"
v-model="dataForm.inspection_stage"
placeholder="请选择检验阶段"
style="width:150px"
clearable
>
<el-option
v-for="(item, index) in inspectionStageOptions"
:key="index"
:label="item.label"
:value="item.value"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
@ -37,7 +67,7 @@
:header-cell-style="{
background: '#eef1f6',
color: '#606266',
height: '56px'
height: '56px',
}"
v-loading="dataListLoading"
style="width: 100%;"
@ -51,18 +81,18 @@
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称" fixed="left"> </el-table-column>
<el-table-column prop="code" label="编码" fixed="left"> </el-table-column>
<el-table-column prop="specifications" label="规格"> </el-table-column>
<el-table-column prop="drawing" label="图纸"> </el-table-column>
<el-table-column prop="productType" label="产品类型"> </el-table-column>
<el-table-column prop="descs" label="描述"> </el-table-column>
<el-table-column prop="remark" label="备注"> </el-table-column>
<el-table-column prop="inspectionStandard" label="检验标准"> </el-table-column>
<el-table-column prop="inspectionStage" label="检验阶段">
<el-table-column prop="name" align="center" label="名称" fixed="left"> </el-table-column>
<el-table-column prop="code" align="center" label="编码" fixed="left"> </el-table-column>
<el-table-column prop="specifications" align="center" label="规格"> </el-table-column>
<el-table-column prop="drawing" align="center" label="图纸"> </el-table-column>
<el-table-column prop="productType" align="center" label="产品类型"> </el-table-column>
<el-table-column prop="descs" align="center" label="描述"> </el-table-column>
<el-table-column prop="remark" align="center" label="备注"> </el-table-column>
<el-table-column prop="inspectionStandard" align="center" label="检验标准"> </el-table-column>
<el-table-column prop="inspectionStage" align="center" label="检验阶段">
<template slot-scope="scope">
<div style="pointer-events: none;">
<el-checkbox-group :value ="scope.row.inspectionStage.split(',')">
<el-checkbox-group :value="scope.row.inspectionStage.split(',')">
<el-checkbox label="1">进货检验</el-checkbox>
<el-checkbox label="2">过程检验</el-checkbox>
<el-checkbox label="3">成品检验</el-checkbox>
@ -71,13 +101,7 @@
</div>
</template>
</el-table-column>
<el-table-column
type="status"
header-align="center"
align="center"
label="状态"
width="80"
>
<el-table-column type="status" header-align="center" align="center" label="状态" width="80">
<template slot-scope="scope">
<el-tag :type="scope.row.status === 0 ? 'danger' : 'success'">{{
scope.row.status === 0 ? "不可用" : "可用"
@ -110,25 +134,10 @@
</el-button>
</template>
</el-table-column> -->
<el-table-column
fixed="right"
header-align="center"
align="center"
width="150"
label="操作"
>
<el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
<template slot-scope="scope">
<el-button
type="text"
size="small"
@click="addOrUpdateHandle(scope.row.id)"
>
<el-tooltip
class="item"
effect="dark"
content="修改"
placement="top"
>
<el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">
<el-tooltip class="item" effect="dark" content="修改" placement="top">
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-编辑"></use></svg>
</el-tooltip>
</el-button>
@ -181,24 +190,63 @@
</template>
<script>
import AddOrUpdate from './components/productList-add'
import basicPage from '@/mixins/basic-page'
import AddOrUpdate from "./components/productList-add";
import basicPage from "@/mixins/basic-page";
export default {
mixins: [basicPage],
data() {
return {
urlOptions: {
getDataListURL: '/basic/product/page',
deleteURL: '/basic/product/delete',
statusUrl: '/basic/product/status',
exportUrl: '/basic/product/export'
getDataListURL: "/basic/product/page",
deleteURL: "/basic/product/delete",
statusUrl: "/basic/product/status",
exportUrl: "/basic/product/export",
},
productTypeArr: [],
inspectionStageOptions: [
{
label: "进货检验",
value: "1",
},
{
label: "过程检验",
value: "2",
},
{
label: "成品检验",
value: "3",
},
{
label: "出货检验",
value: "4",
},
],
};
},
components: {
AddOrUpdate,
},
created() {
this.getArr();
},
methods: {
getArr() {
this.$http
.get("/basic/productType/page", {
params: {
page: 1,
limit: 500,
},
})
.then(({ data: res }) => {
if (res.code !== 0) {
this.productTypeArr = [];
return this.$message.error(res.msg);
}
this.productTypeArr = res.data.list;
})
.catch(() => {});
},
},
};
</script>

44
src/views/spc-basic/productType.vue
View File

@ -1,36 +1,12 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
size="small"
v-model="dataForm.paramKey"
clearable
placeholder="请输入关键字查询"
<query-form
:page-name="'产品类型'"
:data-form="dataForm"
@getDataList="getDataList"
@addOrUpdateHandle="addOrUpdateHandle"
@exportHandle="exportHandle"
/>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
新增
</el-button>
<el-button size="small" type="primary" @click="exportHandle('产品类型')">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
:stripe="true"
@ -44,9 +20,9 @@
>
<el-table-column type="index" header-align="center" align="center" label="序号" width="50">
</el-table-column>
<el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="code" label="编码"> </el-table-column>
<el-table-column prop="descs" label="描述"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column prop="descs" align="center" label="描述"> </el-table-column>
<el-table-column type="status" header-align="center" align="center" label="状态" width="80">
<template slot-scope="scope">
<el-tag :type="scope.row.status === 0 ? 'danger' : 'success'">{{
@ -112,6 +88,7 @@
<script>
import AddOrUpdate from "./components/productType-add";
import basicPage from '@/mixins/basic-page'
import queryForm from './query-form'
export default {
mixins: [basicPage],
data() {
@ -126,6 +103,7 @@ export default {
},
components: {
AddOrUpdate,
queryForm,
},
methods: {
},

73
src/views/spc-basic/query-form.vue Normal file
View File

@ -0,0 +1,73 @@
<!--
* @Author: zwq
* @Date: 2022-09-15 10:44:29
* @LastEditors: zwq
* @LastEditTime: 2022-09-16 13:52:21
* @Description:
-->
<template>
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input size="small" v-model="dataForm.name" clearable placeholder="请输入名称查询" />
</el-form-item>
<el-form-item>
<el-input size="small" v-model="dataForm.code" clearable placeholder="请输入编码查询" />
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
新增
</el-button>
<el-button size="small" type="primary" @click="exportHandle()">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-form>
</template>
<script>
export default {
props: {
pageName: {
type: String,
default: () => {
return "";
},
},
dataForm: {
type: Object,
default: () => {
return {};
},
},
},
data() {
return {
};
},
methods: {
getDataList() {
this.$emit("getDataList");
},
addOrUpdateHandle() {
this.$emit("addOrUpdateHandle");
},
exportHandle() {
this.$emit("exportHandle", this.pageName);
},
},
};
</script>
<style></style>

44
src/views/spc-basic/siteManage.vue
View File

@ -1,36 +1,12 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
size="small"
v-model="dataForm.paramKey"
clearable
placeholder="请输入关键字查询"
<query-form
:page-name="'站点管理'"
:data-form="dataForm"
@getDataList="getDataList"
@addOrUpdateHandle="addOrUpdateHandle"
@exportHandle="exportHandle"
/>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
新增
</el-button>
<el-button size="small" type="primary" @click="exportHandle('站点管理')">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
:stripe="true"
@ -50,9 +26,9 @@
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="code" label="编码"> </el-table-column>
<el-table-column prop="platformGroup" label="站点分组"> </el-table-column>
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column prop="platformGroup" align="center" label="站点分组"> </el-table-column>
<el-table-column
type="status"
header-align="center"
@ -139,6 +115,7 @@
<script>
import AddOrUpdate from './components/siteManage-add'
import basicPage from '@/mixins/basic-page'
import queryForm from './query-form'
export default {
mixins: [basicPage],
data() {
@ -153,6 +130,7 @@ export default {
},
components: {
AddOrUpdate,
queryForm,
},
methods: {
},

44
src/views/spc-basic/toolsType.vue
View File

@ -1,36 +1,12 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
size="small"
v-model="dataForm.paramKey"
clearable
placeholder="请输入关键字查询"
<query-form
:page-name="'量具管理'"
:data-form="dataForm"
@getDataList="getDataList"
@addOrUpdateHandle="addOrUpdateHandle"
@exportHandle="exportHandle"
/>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
新增
</el-button>
<el-button size="small" type="primary" @click="exportHandle('量具管理')">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
:stripe="true"
@ -50,9 +26,9 @@
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="code" label="编码"> </el-table-column>
<el-table-column prop="type" label="测量类型">
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column prop="type" align="center" label="测量类型">
<template slot-scope="scope">
<span>{{
scope.row.type === '2' ? "计数" : "计量"
@ -167,6 +143,7 @@
import AddOrUpdate from './components/toolsType-add'
import Detail from './components/toolsType-detail'
import basicPage from '@/mixins/basic-page'
import queryForm from './query-form'
export default {
mixins: [basicPage],
data() {
@ -182,6 +159,7 @@ export default {
},
components: {
AddOrUpdate,
queryForm,
Detail
},
methods: {

44
src/views/spc-basic/unitList.vue
View File

@ -1,36 +1,12 @@
<template>
<el-card shadow="never" class="aui-card--fill">
<el-form
style="display: flex; align-items: center; justify-content: right;"
:inline="true"
:model="dataForm"
@keyup.enter.native="getDataList()"
>
<el-form-item>
<el-input
size="small"
v-model="dataForm.paramKey"
clearable
placeholder="请输入关键字查询"
<query-form
:page-name="'计量单位'"
:data-form="dataForm"
@getDataList="getDataList"
@addOrUpdateHandle="addOrUpdateHandle"
@exportHandle="exportHandle"
/>
</el-form-item>
<el-form-item>
<el-button size="small" @click="getDataList()">
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
查询
</el-button>
<el-button size="small" type="primary" @click="addOrUpdateHandle()">
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
新增
</el-button>
<el-button size="small" type="primary" @click="exportHandle('计量单位管理')">
<svg class="icon-svg">
<use xlink:href="#导出"></use>
</svg>
导出
</el-button>
</el-form-item>
</el-form>
<el-table
:data="dataList"
:stripe="true"
@ -50,9 +26,9 @@
width="50"
>
</el-table-column>
<el-table-column prop="name" label="名称"> </el-table-column>
<el-table-column prop="code" label="编码"> </el-table-column>
<el-table-column prop="type" label="类型">
<el-table-column prop="name" align="center" label="名称"> </el-table-column>
<el-table-column prop="code" align="center" label="编码"> </el-table-column>
<el-table-column prop="type" align="center" label="类型">
<template slot-scope="scope">
<span>{{
scope.row.type === 2 ? "不可计数" : "可计数"
@ -144,6 +120,7 @@
<script>
import AddOrUpdate from './components/unitList-add'
import queryForm from './query-form'
import basicPage from '@/mixins/basic-page'
export default {
mixins: [basicPage],
@ -159,6 +136,7 @@ export default {
},
components: {
AddOrUpdate,
queryForm,
},
methods: {
},

248
src/views/spc-chart/echart-2line.vue Normal file
View File

@ -0,0 +1,248 @@
<template>
<div class="mod-demo-echarts">
<el-row :gutter="20">
<el-col :span="24">
<el-card>
<div id="chart2Line" class="chart-box"></div>
</el-card>
</el-col>
</el-row>
</div>
</template>
<script>
import * as echarts from "echarts";
//import testdata from './testdata'
export default {
data() {
return {
//testdata
};
},
mounted() {
this.initChartLine();
},
activated() {
// 由于给echart添加了resize事件, 在组件激活时需要重新resize绘画一次, 否则出现空白bug
if (this.chart2Line) {
this.chart2Line.resize();
}
},
methods: {
// 折线图
initChartLine() {
var option = {
title: {
text: "2折线图",
},
tooltip: {
trigger: "axis",
axisPointer: {
type: "cross",
crossStyle: {
color: "#999",
},
},
},
toolbox: {
feature: {
dataView: { show: true, readOnly: false },
magicType: { show: true, type: ["line", "bar"] },
restore: { show: true },
saveAsImage: { show: true },
},
},
color: ["#f8f106", "#fe7576", "#a9b0d3", "#476fd4"],
//多个图，就有多个grid,排序默认0、1、2....
grid: [
//0降雨
{ x: "7%", y: "7%", height: "35%", left: "10%" },
//1水位流量
{ x: "7%", y2: "7%", height: "35%", left: "10%", bottom: "15%" },
],
legend: {
data: ["降水量", "测试"],
},
xAxis: [
{
show: false, //隐藏了x轴
type: "category",
gridIndex: 0, //对应前面grid的索引位置（第一个）
axisTick: {
alignWithLabel: true,
},
axisLabel: {
//interval:showNum, //x轴显示的数量，我这里是动态算的
},
data: [
"1月",
"2月",
"3月",
"4月",
"5月",
"6月",
"7月",
"8月",
"9月",
"10月",
"11月",
"12月",
],
},
{
type: "category",
gridIndex: 1, //对应前面grid的索引位置（第二个）
axisTick: {
alignWithLabel: true,
},
axisLabel: {
//interval:showNum,
},
data: [
"1月",
"2月",
"3月",
"4月",
"5月",
"6月",
"7月",
"8月",
"9月",
"10月",
"11月",
"12月",
],
},
],
//y轴，不管有几个x轴，几个y轴，或者图，只要找到他对应的grid图的序号索引就可以精准匹配
yAxis: [
{
type: "value",
gridIndex: 1,
nameLocation: "middle",
name: "降水量",
splitLine: { show: false },
nameTextStyle: {
padding: 25,
},
position: "left",
axisLine: {
show: true,
lineStyle: {
//color: colors[2]
},
},
axisTick: {
show: true,
},
axisLabel: {
formatter: "{value}",
},
},
{
type: "value",
gridIndex: 0,
name: "测试",
splitLine: { show: false },
nameTextStyle: {
padding: 25,
},
nameLocation: "middle",
position: "left",
//nameLocation: 'start',//y轴name的位置
//inverse: true,
axisLine: {
show: true,
lineStyle: {
//color: colors[1]
},
},
axisTick: {
show: true,
},
axisLabel: {
formatter: "{value}",
textStyle: {
fontSize: 12, //y轴坐标轴上的字体大小
},
},
},
],
dataZoom: [
// 轴放大
{
type: 'inside',
start: 0,
end: 100
},
{
start: 0,
end: 100
},
{
type: 'inside',
xAxisIndex: [0,1],
start: 0,
end: 100
},
{
show: true,
yAxisIndex: 0,
realtime: true,
left: 6,
start: 0,
end: 100
},
{
show: true,
yAxisIndex: 1,
realtime: true,
left: 6,
start: 0,
end: 100
},
],
series: [
{
name: "降水量",
type: "line",
xAxisIndex: 0,
yAxisIndex: 1,
data: [2.6, 5.9, 9.0, 26.4, 28.7, 70.7, 175.6, 182.2, 48.7, 18.8, 6.0, 2.3],
},
{
name: "测试",
type: "line",
xAxisIndex: 1,
yAxisIndex: 0,
data: [2.0, 2.2, 3.3, 4.5, 6.3, 10.2, 20.3, 23.4, 23.0, 16.5, 12.0, 6.2],
},
],
};
this.chart2Line = echarts.init(document.getElementById("chart2Line"));
this.chart2Line.setOption(option);
window.addEventListener("resize", () => {
this.chart2Line.resize();
});
},
},
};
</script>
<style lang="scss">
.mod-demo-echarts {
> .el-row {
margin-top: -10px;
margin-bottom: -10px;
.el-col {
padding-top: 10px;
padding-bottom: 10px;
}
}
.chart-box {
min-height: 400px;
}
}
</style>

0
src/views/spc/echart-3line.vue → src/views/spc-chart/echart-3line.vue
View File

0
src/views/spc/echart-line.vue → src/views/spc-chart/echart-line.vue
View File

0
src/views/spc/test3data.js → src/views/spc-chart/test3data.js
View File

0
src/views/spc/testdata.js → src/views/spc-chart/testdata.js
View File