更新
This commit is contained in:
311
package-lock.json
generated
311
package-lock.json
generated
@@ -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,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",
|
||||
|
||||
@@ -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
1
src/icons/svg/08质量.svg
Normal 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>
|
||||
|
After Width: | Height: | Size: 780 B |
1
src/icons/svg/控制中心.svg
Normal file
1
src/icons/svg/控制中心.svg
Normal 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>
|
||||
|
After Width: | Height: | Size: 784 B |
1
src/icons/svg/方案管理.svg
Normal file
1
src/icons/svg/方案管理.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 9.0 KiB |
@@ -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,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 {
|
||||
|
||||
@@ -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
152
src/mixins/process-page.js
Normal 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(() => {});
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -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
|
||||
|
||||
@@ -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 } },
|
||||
]
|
||||
}
|
||||
|
||||
|
||||
@@ -15,15 +15,19 @@
|
||||
</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' })">
|
||||
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-log"></use></svg>
|
||||
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-log"></use></svg>
|
||||
<span slot="title">产品列表</span>
|
||||
</el-menu-item>
|
||||
</el-submenu>
|
||||
@@ -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>
|
||||
|
||||
@@ -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: ''
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
@@ -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
85
src/views/process-inspection/Counting/CGraph.vue
Normal 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
85
src/views/process-inspection/Counting/NPGraph.vue
Normal 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
85
src/views/process-inspection/Counting/PGraph.vue
Normal 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
85
src/views/process-inspection/Counting/UGraph.vue
Normal 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
172
src/views/process-inspection/Metrological/XMRGraph.vue
Normal 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
184
src/views/process-inspection/Metrological/XbarRGraph.vue
Normal 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
172
src/views/process-inspection/Metrological/XbarSGraph.vue
Normal 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
618
src/views/process-inspection/charts/echart-2line.vue
Normal 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
239
src/views/process-inspection/charts/echart-3line.vue
Normal 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
274
src/views/process-inspection/components/detail-table.vue
Normal 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
83
src/views/process-inspection/components/features-table.vue
Normal 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
432
src/views/process-inspection/components/generalOperation-add.vue
Normal 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
306
src/views/process-inspection/generalOperation.vue
Normal 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
255
src/views/process-inspection/query-form.vue
Normal 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
66
src/views/quality-planning/components/controlRatio.js
Normal 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
|
||||
}
|
||||
@@ -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
102
src/views/quality-planning/controlGraph.vue
Normal 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
121
src/views/quality-planning/controlRatio.vue
Normal 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
107
src/views/quality-planning/interpretationScheme.vue
Normal 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
73
src/views/quality-planning/query-form.vue
Normal 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>
|
||||
@@ -1,103 +1,149 @@
|
||||
import { Addon} from '@antv/x6';
|
||||
import { Addon } from '@antv/x6';
|
||||
// 拖拽生成四边形
|
||||
export const startDragToGraph = (graph,data,e) =>{
|
||||
const node =
|
||||
export const startDragToGraph = (graph, data, e) => {
|
||||
const node =
|
||||
graph.createNode({
|
||||
width: 100, //节点的宽度
|
||||
height: 60, //节点的高度
|
||||
attrs: {
|
||||
label: {
|
||||
text: data.name,
|
||||
workingProcedureId: data.id,
|
||||
fill: 'white',
|
||||
fontSize: 14,
|
||||
textWrap: {
|
||||
width: -10 ,
|
||||
height: -10,
|
||||
ellipsis: true,
|
||||
},
|
||||
label: '圆角矩形',
|
||||
data: {
|
||||
type: 'defaultYSquare'
|
||||
},
|
||||
body: {
|
||||
stroke: '#000000',
|
||||
strokeWidth: 1,
|
||||
fill: '#5bdeff',
|
||||
}
|
||||
},
|
||||
ports: ports
|
||||
})
|
||||
const dnd = new Addon.Dnd({target:graph})
|
||||
dnd.start(node,e)
|
||||
shape: 'rect',
|
||||
width: 100, //节点的宽度
|
||||
height: 60, //节点的高度
|
||||
attrs: {
|
||||
label: {
|
||||
text: data.name,
|
||||
workingProcedureId: data.id,
|
||||
fill: '#FFFFFF',
|
||||
fontSize: 14,
|
||||
textWrap: {
|
||||
width: -10,
|
||||
height: -10,
|
||||
ellipsis: true,
|
||||
},
|
||||
},
|
||||
body: {
|
||||
stroke: '#000000',
|
||||
strokeWidth: 1,
|
||||
fill: '#5bdeff',
|
||||
rx: 10,
|
||||
ry: 10,
|
||||
}
|
||||
},
|
||||
})
|
||||
const dnd = new Addon.Dnd({ target: graph })
|
||||
dnd.start(node, e)
|
||||
}
|
||||
//下面是锚点的代码。 知道就行了 我就不一一写了。
|
||||
export const ports = {
|
||||
groups: {
|
||||
// 输入链接桩群组定义
|
||||
top: {
|
||||
position: 'top',
|
||||
attrs: {
|
||||
circle: {
|
||||
r: 4,
|
||||
magnet: true,
|
||||
stroke: '#2D8CF0',
|
||||
strokeWidth: 2,
|
||||
fill: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
// 输出链接桩群组定义
|
||||
bottom: {
|
||||
position: 'bottom',
|
||||
attrs: {
|
||||
circle: {
|
||||
r: 4,
|
||||
magnet: true,
|
||||
stroke: '#2D8CF0',
|
||||
strokeWidth: 2,
|
||||
fill: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
left: {
|
||||
position: 'left',
|
||||
attrs: {
|
||||
circle: {
|
||||
r: 4,
|
||||
magnet: true,
|
||||
stroke: '#2D8CF0',
|
||||
strokeWidth: 2,
|
||||
fill: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
right: {
|
||||
position: 'right',
|
||||
attrs: {
|
||||
circle: {
|
||||
r: 4,
|
||||
magnet: true,
|
||||
stroke: '#2D8CF0',
|
||||
strokeWidth: 2,
|
||||
fill: '#fff',
|
||||
},
|
||||
groups: {
|
||||
// 输入链接桩群组定义
|
||||
top: {
|
||||
position: 'top',
|
||||
attrs: {
|
||||
circle: {
|
||||
r: 4,
|
||||
magnet: true,
|
||||
stroke: '#2D8CF0',
|
||||
strokeWidth: 2,
|
||||
fill: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
items: [
|
||||
// 输出链接桩群组定义
|
||||
bottom: {
|
||||
position: 'bottom',
|
||||
attrs: {
|
||||
circle: {
|
||||
r: 4,
|
||||
magnet: true,
|
||||
stroke: '#2D8CF0',
|
||||
strokeWidth: 2,
|
||||
fill: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
left: {
|
||||
position: 'left',
|
||||
attrs: {
|
||||
circle: {
|
||||
r: 4,
|
||||
magnet: true,
|
||||
stroke: '#2D8CF0',
|
||||
strokeWidth: 2,
|
||||
fill: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
right: {
|
||||
position: 'right',
|
||||
attrs: {
|
||||
circle: {
|
||||
r: 4,
|
||||
magnet: true,
|
||||
stroke: '#2D8CF0',
|
||||
strokeWidth: 2,
|
||||
fill: '#fff',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
items: [
|
||||
{
|
||||
id: 'port1',
|
||||
group: 'top',
|
||||
},
|
||||
{
|
||||
id: 'port2',
|
||||
group: 'bottom',
|
||||
},
|
||||
{
|
||||
id: 'port3',
|
||||
group: 'left',
|
||||
},
|
||||
{
|
||||
id: 'port4',
|
||||
group: 'right',
|
||||
}
|
||||
],
|
||||
}
|
||||
|
||||
|
||||
// 连线 label 设置
|
||||
export const configEdgeLabel = (labelText, fontColor, fill, stroke) => {
|
||||
if (!labelText) return { attrs: { labelText: { text: '' }, labelBody: { fill: '', stroke: '' } } }
|
||||
return {
|
||||
markup: [
|
||||
{
|
||||
id: 'port1',
|
||||
group: 'top',
|
||||
tagName: 'rect',
|
||||
selector: 'labelBody',
|
||||
},
|
||||
{
|
||||
id: 'port2',
|
||||
group: 'bottom',
|
||||
tagName: 'text',
|
||||
selector: 'labelText',
|
||||
},
|
||||
{
|
||||
id: 'port3',
|
||||
group: 'left',
|
||||
},
|
||||
{
|
||||
id: 'port4',
|
||||
group: 'right',
|
||||
}
|
||||
],
|
||||
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,
|
||||
},
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -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("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());
|
||||
// 点击编辑
|
||||
this.graph.on("cell:click", ({ cell }) => {
|
||||
this.editForm(cell);
|
||||
});
|
||||
//链接边分离后触发
|
||||
// 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";
|
||||
}
|
||||
},
|
||||
// 是否展示节点
|
||||
// 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,33 +451,218 @@ export default {
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
// 删除
|
||||
deleteHandle(id, name) {
|
||||
this.$confirm(`确定对[名称=${name}]进行删除操作?`, "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
})
|
||||
//编辑节点和线
|
||||
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(() => {
|
||||
this.$http
|
||||
.delete("/basic/productWorkingprocedureRelation", { data: [id] })
|
||||
.then(({ data }) => {
|
||||
if (data && data.code === 0) {
|
||||
this.$message({
|
||||
message: "操作成功",
|
||||
type: "success",
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.getList();
|
||||
},
|
||||
});
|
||||
} else {
|
||||
this.$message.error(data.msg);
|
||||
}
|
||||
});
|
||||
const cells = this.graph.getSelectedCells();
|
||||
if (cells.length) {
|
||||
this.$http
|
||||
.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",
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.getList();
|
||||
},
|
||||
});
|
||||
} else {
|
||||
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>
|
||||
|
||||
@@ -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();
|
||||
|
||||
@@ -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>
|
||||
|
||||
@@ -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() {
|
||||
|
||||
@@ -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) => {
|
||||
|
||||
@@ -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)">
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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"
|
||||
|
||||
@@ -7,20 +7,34 @@
|
||||
@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()">
|
||||
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
|
||||
<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>
|
||||
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
|
||||
新增
|
||||
</el-button>
|
||||
<el-button size="small" type="primary" @click="exportHandle('工厂管理')">
|
||||
@@ -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: {
|
||||
|
||||
@@ -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="请输入关键字查询"
|
||||
/>
|
||||
</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>
|
||||
<query-form
|
||||
:page-name="'机台管理'"
|
||||
:data-form="dataForm"
|
||||
@getDataList="getDataList"
|
||||
@addOrUpdateHandle="addOrUpdateHandle"
|
||||
@exportHandle="exportHandle"
|
||||
/>
|
||||
<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: {
|
||||
},
|
||||
|
||||
@@ -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="请输入关键字查询"
|
||||
/>
|
||||
</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>
|
||||
<query-form
|
||||
:page-name="'工序定义'"
|
||||
:data-form="dataForm"
|
||||
@getDataList="getDataList"
|
||||
@addOrUpdateHandle="addOrUpdateHandle"
|
||||
@exportHandle="exportHandle"
|
||||
/>
|
||||
<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: {
|
||||
|
||||
@@ -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="请输入关键字查询" />
|
||||
</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>
|
||||
</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%;"
|
||||
>
|
||||
<el-table-column
|
||||
fixed="left"
|
||||
type="index"
|
||||
header-align="center"
|
||||
align="center"
|
||||
label="序号"
|
||||
width="50"
|
||||
{{ 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 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>
|
||||
</div>
|
||||
<div class="edit-btn">
|
||||
<el-button type="danger" @click="handlerDel" style="width:100%"
|
||||
>删除此{{ editTitle === "编辑节点" ? "节点" : "连线" }}</el-button
|
||||
>
|
||||
</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>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-card>
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</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();
|
||||
},
|
||||
created() {
|
||||
this.getDataList();
|
||||
this.productId = ''
|
||||
watch: {
|
||||
value: {
|
||||
handler: function() {
|
||||
if (this.graph) {
|
||||
this.selectCell = "";
|
||||
this.editDrawer = false;
|
||||
this.graph.dispose();
|
||||
this.init();
|
||||
}
|
||||
},
|
||||
deep: true,
|
||||
immediate: true,
|
||||
},
|
||||
},
|
||||
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(() => {});
|
||||
},
|
||||
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();
|
||||
});
|
||||
}
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
if (val) {
|
||||
this.productId = val.id;
|
||||
const obj = {
|
||||
label: this.paneName,
|
||||
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",
|
||||
},
|
||||
};
|
||||
this.tabClick(obj);
|
||||
}
|
||||
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();
|
||||
},
|
||||
});
|
||||
} else {
|
||||
this.$message.error(data.msg);
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
}, //清空画布
|
||||
deleteAll() {
|
||||
this.graph.clearCells();
|
||||
},
|
||||
//销毁画布
|
||||
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>
|
||||
|
||||
@@ -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="请输入关键字查询"
|
||||
/>
|
||||
</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>
|
||||
<query-form
|
||||
:page-name="'工序类型'"
|
||||
:data-form="dataForm"
|
||||
@getDataList="getDataList"
|
||||
@addOrUpdateHandle="addOrUpdateHandle"
|
||||
@exportHandle="exportHandle"
|
||||
/>
|
||||
<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: {
|
||||
},
|
||||
|
||||
@@ -7,20 +7,50 @@
|
||||
@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()">
|
||||
<svg class="icon-svg"><use xlink:href="#icon-sousuo"></use></svg>
|
||||
<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>
|
||||
<svg class="icon-svg"><use xlink:href="#icon-新建"></use></svg>
|
||||
新增
|
||||
</el-button>
|
||||
<el-button size="small" type="primary" @click="exportHandle('产品列表')">
|
||||
@@ -37,7 +67,7 @@
|
||||
:header-cell-style="{
|
||||
background: '#eef1f6',
|
||||
color: '#606266',
|
||||
height: '56px'
|
||||
height: '56px',
|
||||
}"
|
||||
v-loading="dataListLoading"
|
||||
style="width: 100%;"
|
||||
@@ -51,33 +81,27 @@
|
||||
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 label="1">进货检验</el-checkbox>
|
||||
<el-checkbox label="2">过程检验</el-checkbox>
|
||||
<el-checkbox label="3">成品检验</el-checkbox>
|
||||
<el-checkbox label="4">出货检验</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
<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>
|
||||
<el-checkbox label="4">出货检验</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</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,26 +134,11 @@
|
||||
</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"
|
||||
>
|
||||
<svg class="icon-svg aui-sidebar__menu-icon"><use xlink:href="#icon-编辑"></use></svg>
|
||||
<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-popover placement="top" width="160" trigger="click" :ref="`popover-${scope.row.id}`">
|
||||
@@ -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>
|
||||
</script>
|
||||
|
||||
@@ -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="请输入关键字查询"
|
||||
/>
|
||||
</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>
|
||||
<query-form
|
||||
:page-name="'产品类型'"
|
||||
:data-form="dataForm"
|
||||
@getDataList="getDataList"
|
||||
@addOrUpdateHandle="addOrUpdateHandle"
|
||||
@exportHandle="exportHandle"
|
||||
/>
|
||||
<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
73
src/views/spc-basic/query-form.vue
Normal 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>
|
||||
@@ -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="请输入关键字查询"
|
||||
/>
|
||||
</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>
|
||||
<query-form
|
||||
:page-name="'站点管理'"
|
||||
:data-form="dataForm"
|
||||
@getDataList="getDataList"
|
||||
@addOrUpdateHandle="addOrUpdateHandle"
|
||||
@exportHandle="exportHandle"
|
||||
/>
|
||||
<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: {
|
||||
},
|
||||
|
||||
@@ -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="请输入关键字查询"
|
||||
/>
|
||||
</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>
|
||||
<query-form
|
||||
:page-name="'量具管理'"
|
||||
:data-form="dataForm"
|
||||
@getDataList="getDataList"
|
||||
@addOrUpdateHandle="addOrUpdateHandle"
|
||||
@exportHandle="exportHandle"
|
||||
/>
|
||||
<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: {
|
||||
|
||||
@@ -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="请输入关键字查询"
|
||||
/>
|
||||
</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>
|
||||
<query-form
|
||||
:page-name="'计量单位'"
|
||||
:data-form="dataForm"
|
||||
@getDataList="getDataList"
|
||||
@addOrUpdateHandle="addOrUpdateHandle"
|
||||
@exportHandle="exportHandle"
|
||||
/>
|
||||
<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
248
src/views/spc-chart/echart-2line.vue
Normal 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>
|
||||
Reference in New Issue
Block a user