Browse Source

[新增] 工作区组件

develop
徐振升 5 years ago
parent
commit
dd6308529a
  1. 427
      package-lock.json
  2. 1
      package.json
  3. 2
      src/app/ui/collection-tools/collection-tools.component.html
  4. 23
      src/app/ui/ui.module.ts
  5. 0
      src/app/working-area/working-area.component.html
  6. 0
      src/app/working-area/working-area.component.scss
  7. 25
      src/app/working-area/working-area.component.spec.ts
  8. 124
      src/app/working-area/working-area.component.ts

427
package-lock.json generated

@ -2704,6 +2704,356 @@
} }
} }
}, },
"@pixi/accessibility": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/accessibility/-/accessibility-5.3.2.tgz",
"integrity": "sha512-L56/Yr/gXyjs5Pgww6djg+nzBcMhi0ywmdXVZ2NEvlIk8spZwZHp9xb3t1xQvl7nXkIcdEvwBDBtgAPrwPJTRg==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/app": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/app/-/app-5.3.2.tgz",
"integrity": "sha512-jsLVe01q0QvxWv1dJql1lgl+vMqVb5YCbgxlbGHKkV3hYGmWaOd1fd31U+IMfiLgy5CgrRyoORjGuUf+HhYP3g==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2"
}
},
"@pixi/constants": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/constants/-/constants-5.3.2.tgz",
"integrity": "sha512-wJGPCNHF8LyWIStUujLlEg63Gkt7NzOO7E3O0jWYuikmYvBzi4dYWTGg9Ws9OULPwSbM9/Cu9l1zjJUWMCytYg=="
},
"@pixi/core": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/core/-/core-5.3.2.tgz",
"integrity": "sha512-BMd8gag7bcXWASfAkMER9lP43/5jVrjM+DhnqKv/KBK/G4wtSr+LJZJqBcNr6tox3Lquh8P5oGtVu0tAuHOXHA==",
"requires": {
"@pixi/constants": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/runner": "5.3.2",
"@pixi/settings": "5.3.2",
"@pixi/ticker": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/display": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/display/-/display-5.3.2.tgz",
"integrity": "sha512-a/VnecfB6Pt9shOuZ19cUBO+6+esG/DUGacwHdkO9czue1h8kmD01vrXai6vXwVGj8bmGi/Pm8Zq7tSLO/hWLw==",
"requires": {
"@pixi/math": "5.3.2",
"@pixi/settings": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/extract": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/extract/-/extract-5.3.2.tgz",
"integrity": "sha512-JPjOQ0eSfugiOdXmR7lPt1w2JdgBYzzdKqnAG5j2kWnfi7UDViyUKWbLRlns6POhyK4Qmw7Iulqy0M71HCzYxw==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/filter-alpha": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/filter-alpha/-/filter-alpha-5.3.2.tgz",
"integrity": "sha512-TzLvngPA6jUXQ071GJzC6Pz37tBxuBgzhdw+lUqrVuf0AdSbz3tXrb9+rPmTI4F1JtYPI8SaTwwOmPhiZ0BAqw==",
"requires": {
"@pixi/core": "5.3.2"
}
},
"@pixi/filter-blur": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/filter-blur/-/filter-blur-5.3.2.tgz",
"integrity": "sha512-Lzb2TMAPA1ODoRbQOrb7R0TJDy+dEC9rZo44/xbR4zfk7Ewu0LWpSumKcsLnZcB31oc/fwhdaJK00qqdaGwelQ==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/settings": "5.3.2"
}
},
"@pixi/filter-color-matrix": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/filter-color-matrix/-/filter-color-matrix-5.3.2.tgz",
"integrity": "sha512-dESNx44C/27IXfkIYQnxfgQbqlWrhVkaM9lprYQH8Ou57QE+uoJ4dwrYaUCanVVjRSHbDNg8uXxZozjFb9NkLw==",
"requires": {
"@pixi/core": "5.3.2"
}
},
"@pixi/filter-displacement": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/filter-displacement/-/filter-displacement-5.3.2.tgz",
"integrity": "sha512-mo6N/99dgfkDKcHo2K2Kck/DOel1YWiTd6vdI0WZ7iJbBHAf8exU3dUnePjM+Z3Xj05W7YzL9S2nHupPuTC1bA==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/math": "5.3.2"
}
},
"@pixi/filter-fxaa": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/filter-fxaa/-/filter-fxaa-5.3.2.tgz",
"integrity": "sha512-uZTi402jTgj01QiKNZ+kTuoFzu7qn4fXmKVlMBHA493TUE7l+8ffPjdsIdJXZL6QQ5s9PAJ9Coaxl9cM/1oDOA==",
"requires": {
"@pixi/core": "5.3.2"
}
},
"@pixi/filter-noise": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/filter-noise/-/filter-noise-5.3.2.tgz",
"integrity": "sha512-DmbggbTuo6Sa/HTA3JxezgW32UsZYvTnp2pcM7Nf3EqebD0+ahpVK6CtiZM9js7NMtUttfJgOCGYy8AZ6SjDfg==",
"requires": {
"@pixi/core": "5.3.2"
}
},
"@pixi/graphics": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/graphics/-/graphics-5.3.2.tgz",
"integrity": "sha512-K3F8qVDHqnK7X1WoP87h8QtK7nLi5EiJA044L0nObho1PUSbVi6mzJqBBWtcFnGraHGT5IgbFEDB3PXnXnY4mA==",
"requires": {
"@pixi/constants": "5.3.2",
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/sprite": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/interaction": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/interaction/-/interaction-5.3.2.tgz",
"integrity": "sha512-fOFfNQUBJ0vCRq5dmrunIt3W63QnP3z8qvILnDNX2oP8SotCEtTuZreHeGKEVBQhrMCi5hoJgDCA9R8ca2o6AQ==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/ticker": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/loaders": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/loaders/-/loaders-5.3.2.tgz",
"integrity": "sha512-w8wBdI587g7SLIAXNtncEAZxgohekGrP9rS44q1aotfo1ongiftTy77lYLWGSpYfyyWXcY+v6R1Qc40buNrGVA==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/utils": "5.3.2",
"resource-loader": "^3.0.1"
}
},
"@pixi/math": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/math/-/math-5.3.2.tgz",
"integrity": "sha512-vddmG9pn6sfTs2V5BLn/1Jvk+6jReaHNdxZG5HzgvEMvFTTBB8VbfMg+Lg1GocWt198nnoq8NyP7O+PaqQPlig=="
},
"@pixi/mesh": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/mesh/-/mesh-5.3.2.tgz",
"integrity": "sha512-tz4FaaxCYTidOjobGEIBoNiHCeHt9G8T9j0hJqCO4HmYWEu22eMwrrudv0Q8lEJYT743AJEk8XFn4v8wWrEFQA==",
"requires": {
"@pixi/constants": "5.3.2",
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/settings": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/mesh-extras": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/mesh-extras/-/mesh-extras-5.3.2.tgz",
"integrity": "sha512-K3JSGA9vvSMFBB68hvmYolf9tg5ZFc3cVDODGdz5c+aoC5hR8neJeCRtJCbZ820vLM/hknaqz0nOAG8aJAm5yQ==",
"requires": {
"@pixi/constants": "5.3.2",
"@pixi/core": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/mesh": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/mixin-cache-as-bitmap": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/mixin-cache-as-bitmap/-/mixin-cache-as-bitmap-5.3.2.tgz",
"integrity": "sha512-MST8irfUjFbbFLzCqkUbLcBusI24iQE2Wbu/nx3RNJ5Fd7b661YCYqFM6TZ/y4LHqmEKcWrPK/6PAAicX9Teeg==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/settings": "5.3.2",
"@pixi/sprite": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/mixin-get-child-by-name": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/mixin-get-child-by-name/-/mixin-get-child-by-name-5.3.2.tgz",
"integrity": "sha512-i21BtVtYu71nKMShfRnCf1VXaPCAGV2Cm203lp3SxkVyFvyHl4ex1bpzhKK0la4X7UK6gQIV8XHUAGqT4mzAiw==",
"requires": {
"@pixi/display": "5.3.2"
}
},
"@pixi/mixin-get-global-position": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/mixin-get-global-position/-/mixin-get-global-position-5.3.2.tgz",
"integrity": "sha512-IhdjMiGlYwabYpYs5GpOVKUCWYiz1ejK2Cj8Sddjzgb5T1puSOwvxnziolZeLodfshw+NX7FINeHwx6bbUV3cA==",
"requires": {
"@pixi/display": "5.3.2",
"@pixi/math": "5.3.2"
}
},
"@pixi/particles": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/particles/-/particles-5.3.2.tgz",
"integrity": "sha512-RiFJ7ORTGIVHdboXUEJCLP1sS7lmTumv7QJBj5xYxM/RwRb0d2SrU+U3XcfNCXC3VVk48EiDBo4DdfQR1oPYLA==",
"requires": {
"@pixi/constants": "5.3.2",
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/polyfill": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/polyfill/-/polyfill-5.3.2.tgz",
"integrity": "sha512-KXRlW1KEPfbxdrgxggFblSu7Nm7BTm9AH9kIO4+zGcyFsX1fVuq/PMlX60oekZTeJkpGlrJqQ219dW4kgG4spg==",
"requires": {
"es6-promise-polyfill": "^1.2.0",
"object-assign": "^4.1.1"
}
},
"@pixi/prepare": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/prepare/-/prepare-5.3.2.tgz",
"integrity": "sha512-ffNLm3zVWDd2YCvJcKgCLgi1xokMXqkUUhBzoulIS3BRiHuda9RE0gDzVP3twj9jPx6HZmewSu2Qp7m8L6TfcA==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/graphics": "5.3.2",
"@pixi/settings": "5.3.2",
"@pixi/text": "5.3.2",
"@pixi/ticker": "5.3.2"
}
},
"@pixi/runner": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/runner/-/runner-5.3.2.tgz",
"integrity": "sha512-otRRrob5ooExmvEI2m1WtIpPuAqaN2a2qofyVI9LOKqWIbzgdG4URQI3LmpUHOxyHZLPCJxxBEf+rf8Yxn/xnQ=="
},
"@pixi/settings": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/settings/-/settings-5.3.2.tgz",
"integrity": "sha512-XuLyLBtvDu7UspzI9PmMtyfTh8F7pihC9NLaVv2VV8wyAeLO7wdjZN8JrIMiuqibzd7bJ93yoK1Xz0CsGfKz9g==",
"requires": {
"ismobilejs": "^1.1.0"
}
},
"@pixi/sprite": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/sprite/-/sprite-5.3.2.tgz",
"integrity": "sha512-DKacTS+TzCDptW4N7jkL+2m7Xz3IeEv0C3JDffJaFk9R4WR7iUzNkXF2tUQfci5aBKobK0djFh7iFORPB6r0tg==",
"requires": {
"@pixi/constants": "5.3.2",
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/settings": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/sprite-animated": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/sprite-animated/-/sprite-animated-5.3.2.tgz",
"integrity": "sha512-TO+Vi2KAL5EAUygmxjV6vKImCV6FTMNErC44/3VCzHSylW/ZBChk0zuImQOG8qB0+gFcSSWRZEIhP34hS6dMhQ==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/sprite": "5.3.2",
"@pixi/ticker": "5.3.2"
}
},
"@pixi/sprite-tiling": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/sprite-tiling/-/sprite-tiling-5.3.2.tgz",
"integrity": "sha512-lS+xNjF43mLxo/bsJpRH9iIYdrSRzQ54vH1Yss9X/p2O57ISwBFaIzfYJAKFkQLumGLEeUg9hj7qcfJJRMOOYA==",
"requires": {
"@pixi/constants": "5.3.2",
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/sprite": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/spritesheet": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/spritesheet/-/spritesheet-5.3.2.tgz",
"integrity": "sha512-FgOKJW0d/4wYCEJTyAfHRSZ972gZ50QtUTyy1GQIYKkZAwiLVnXkpVj7jBumaL9BbOt8AyCWIXsMk47C1DLcpg==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/loaders": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/text": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/text/-/text-5.3.2.tgz",
"integrity": "sha512-NGGxN4LbkUqhQ0j19WwCjE3ELFPZBlDX8U85Z1xZbK1pOcI/k6k8h30+vsI4PRUMfNYo5s1NiOgEoZqflEMuog==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/settings": "5.3.2",
"@pixi/sprite": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/text-bitmap": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/text-bitmap/-/text-bitmap-5.3.2.tgz",
"integrity": "sha512-dbHzkjPp2BcbtK3fKlouJ2DanSOj1VWuutDIM1wTNqu9WsjjrT8n6STEQ2qn0Uzna0xypBaEKbin4o2dtTonWg==",
"requires": {
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/loaders": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/mesh": "5.3.2",
"@pixi/settings": "5.3.2",
"@pixi/text": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"@pixi/ticker": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/ticker/-/ticker-5.3.2.tgz",
"integrity": "sha512-5fc3A3XZbHpX8ho07ryTz5sLHx29ZlhRppmkR/fyzN8MTTFwERxyNjfb8SOfsm2xMmf3mQdjdWjZ0ClbhSSjzQ==",
"requires": {
"@pixi/settings": "5.3.2"
}
},
"@pixi/utils": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/@pixi/utils/-/utils-5.3.2.tgz",
"integrity": "sha512-/xt+05/U0ucvwSNZv+jT+/U+RYS+JCZu6r9tInQfIngZtKlemZbHinW9V641YqFVsfsLrsqZalL9hnhtJhXVHA==",
"requires": {
"@pixi/constants": "5.3.2",
"@pixi/settings": "5.3.2",
"earcut": "^2.1.5",
"eventemitter3": "^3.1.0",
"url": "^0.11.0"
},
"dependencies": {
"eventemitter3": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-3.1.2.tgz",
"integrity": "sha512-tvtQIeLVHjDkJYnzf2dgVMxfuSGJeM/7UCG17TT4EumTfNtF+0nebF/4zWOIkCreAbtNqhGEboB6BWrwqNaw4Q=="
}
}
},
"@protobufjs/aspromise": { "@protobufjs/aspromise": {
"version": "1.1.2", "version": "1.1.2",
"resolved": "https://registry.npm.taobao.org/@protobufjs/aspromise/download/@protobufjs/aspromise-1.1.2.tgz", "resolved": "https://registry.npm.taobao.org/@protobufjs/aspromise/download/@protobufjs/aspromise-1.1.2.tgz",
@ -7241,6 +7591,11 @@
"integrity": "sha1-TrIVlMlyvEBVPSduUQU5FD21Pgo=", "integrity": "sha1-TrIVlMlyvEBVPSduUQU5FD21Pgo=",
"dev": true "dev": true
}, },
"es6-promise-polyfill": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/es6-promise-polyfill/-/es6-promise-polyfill-1.2.0.tgz",
"integrity": "sha1-84kl8jyz4+jObNqP93T867sJDN4="
},
"es6-promisify": { "es6-promisify": {
"version": "5.0.0", "version": "5.0.0",
"resolved": "https://registry.npm.taobao.org/es6-promisify/download/es6-promisify-5.0.0.tgz", "resolved": "https://registry.npm.taobao.org/es6-promisify/download/es6-promisify-5.0.0.tgz",
@ -9489,6 +9844,11 @@
"integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=", "integrity": "sha1-6PvzdNxVb/iUehDcsFctYz8s+hA=",
"dev": true "dev": true
}, },
"ismobilejs": {
"version": "1.1.1",
"resolved": "https://registry.npmjs.org/ismobilejs/-/ismobilejs-1.1.1.tgz",
"integrity": "sha512-VaFW53yt8QO61k2WJui0dHf4SlL8lxBofUuUmwBo0ljPk0Drz2TiuDW4jo3wDcv41qy/SxrJ+VAzJ/qYqsmzRw=="
},
"isobject": { "isobject": {
"version": "3.0.1", "version": "3.0.1",
"resolved": "https://registry.npm.taobao.org/isobject/download/isobject-3.0.1.tgz", "resolved": "https://registry.npm.taobao.org/isobject/download/isobject-3.0.1.tgz",
@ -11176,6 +11536,11 @@
} }
} }
}, },
"mini-signals": {
"version": "1.2.0",
"resolved": "https://registry.npmjs.org/mini-signals/-/mini-signals-1.2.0.tgz",
"integrity": "sha1-RbCAE8X65RokqhqTXNMXye1yHXQ="
},
"minimalistic-assert": { "minimalistic-assert": {
"version": "1.0.1", "version": "1.0.1",
"resolved": "https://registry.npm.taobao.org/minimalistic-assert/download/minimalistic-assert-1.0.1.tgz", "resolved": "https://registry.npm.taobao.org/minimalistic-assert/download/minimalistic-assert-1.0.1.tgz",
@ -12167,6 +12532,11 @@
"json-parse-better-errors": "^1.0.1" "json-parse-better-errors": "^1.0.1"
} }
}, },
"parse-uri": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/parse-uri/-/parse-uri-1.0.0.tgz",
"integrity": "sha1-KHLcwi8aeXrN4Vg9igrClVLdrCA="
},
"parse5": { "parse5": {
"version": "4.0.0", "version": "4.0.0",
"resolved": "https://registry.npm.taobao.org/parse5/download/parse5-4.0.0.tgz?cache=0&sync_timestamp=1573036762880&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fparse5%2Fdownload%2Fparse5-4.0.0.tgz", "resolved": "https://registry.npm.taobao.org/parse5/download/parse5-4.0.0.tgz?cache=0&sync_timestamp=1573036762880&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fparse5%2Fdownload%2Fparse5-4.0.0.tgz",
@ -12319,6 +12689,47 @@
"pinkie": "^2.0.0" "pinkie": "^2.0.0"
} }
}, },
"pixi.js": {
"version": "5.3.2",
"resolved": "https://registry.npmjs.org/pixi.js/-/pixi.js-5.3.2.tgz",
"integrity": "sha512-j0lqv/njYveGJgWgtLW2BjuiGtWyPKAVq5aFs3lxWcEnxmVk7OX2BI3jRlkYB3v+gBXm2SPzQswblMsShHvyLQ==",
"requires": {
"@pixi/accessibility": "5.3.2",
"@pixi/app": "5.3.2",
"@pixi/constants": "5.3.2",
"@pixi/core": "5.3.2",
"@pixi/display": "5.3.2",
"@pixi/extract": "5.3.2",
"@pixi/filter-alpha": "5.3.2",
"@pixi/filter-blur": "5.3.2",
"@pixi/filter-color-matrix": "5.3.2",
"@pixi/filter-displacement": "5.3.2",
"@pixi/filter-fxaa": "5.3.2",
"@pixi/filter-noise": "5.3.2",
"@pixi/graphics": "5.3.2",
"@pixi/interaction": "5.3.2",
"@pixi/loaders": "5.3.2",
"@pixi/math": "5.3.2",
"@pixi/mesh": "5.3.2",
"@pixi/mesh-extras": "5.3.2",
"@pixi/mixin-cache-as-bitmap": "5.3.2",
"@pixi/mixin-get-child-by-name": "5.3.2",
"@pixi/mixin-get-global-position": "5.3.2",
"@pixi/particles": "5.3.2",
"@pixi/polyfill": "5.3.2",
"@pixi/prepare": "5.3.2",
"@pixi/runner": "5.3.2",
"@pixi/settings": "5.3.2",
"@pixi/sprite": "5.3.2",
"@pixi/sprite-animated": "5.3.2",
"@pixi/sprite-tiling": "5.3.2",
"@pixi/spritesheet": "5.3.2",
"@pixi/text": "5.3.2",
"@pixi/text-bitmap": "5.3.2",
"@pixi/ticker": "5.3.2",
"@pixi/utils": "5.3.2"
}
},
"pkg-dir": { "pkg-dir": {
"version": "3.0.0", "version": "3.0.0",
"resolved": "https://registry.npm.taobao.org/pkg-dir/download/pkg-dir-3.0.0.tgz", "resolved": "https://registry.npm.taobao.org/pkg-dir/download/pkg-dir-3.0.0.tgz",
@ -13293,8 +13704,7 @@
"querystring": { "querystring": {
"version": "0.2.0", "version": "0.2.0",
"resolved": "https://registry.npm.taobao.org/querystring/download/querystring-0.2.0.tgz", "resolved": "https://registry.npm.taobao.org/querystring/download/querystring-0.2.0.tgz",
"integrity": "sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA=", "integrity": "sha1-sgmEkgO7Jd+CDadW50cAWHhSFiA="
"dev": true
}, },
"querystring-es3": { "querystring-es3": {
"version": "0.2.1", "version": "0.2.1",
@ -13656,6 +14066,15 @@
"integrity": "sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo=", "integrity": "sha1-LGN/53yJOv0qZj/iGqkIAGjiBSo=",
"dev": true "dev": true
}, },
"resource-loader": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/resource-loader/-/resource-loader-3.0.1.tgz",
"integrity": "sha512-fBuCRbEHdLCI1eglzQhUv9Rrdcmqkydr1r6uHE2cYHvRBrcLXeSmbE/qI/urFt8rPr/IGxir3BUwM5kUK8XoyA==",
"requires": {
"mini-signals": "^1.2.0",
"parse-uri": "^1.0.0"
}
},
"restore-cursor": { "restore-cursor": {
"version": "3.1.0", "version": "3.1.0",
"resolved": "https://registry.npm.taobao.org/restore-cursor/download/restore-cursor-3.1.0.tgz", "resolved": "https://registry.npm.taobao.org/restore-cursor/download/restore-cursor-3.1.0.tgz",
@ -15693,7 +16112,6 @@
"version": "0.11.0", "version": "0.11.0",
"resolved": "https://registry.npm.taobao.org/url/download/url-0.11.0.tgz", "resolved": "https://registry.npm.taobao.org/url/download/url-0.11.0.tgz",
"integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=", "integrity": "sha1-ODjpfPxgUh63PFJajlW/3Z4uKPE=",
"dev": true,
"requires": { "requires": {
"punycode": "1.3.2", "punycode": "1.3.2",
"querystring": "0.2.0" "querystring": "0.2.0"
@ -15702,8 +16120,7 @@
"punycode": { "punycode": {
"version": "1.3.2", "version": "1.3.2",
"resolved": "https://registry.npm.taobao.org/punycode/download/punycode-1.3.2.tgz", "resolved": "https://registry.npm.taobao.org/punycode/download/punycode-1.3.2.tgz",
"integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0=", "integrity": "sha1-llOgNvt8HuQjQvIyXM7v6jkmxI0="
"dev": true
} }
} }
}, },

1
package.json

@ -34,6 +34,7 @@
"ngx-cookie-service": "^3.0.2", "ngx-cookie-service": "^3.0.2",
"ngx-echarts": "^4.2.2", "ngx-echarts": "^4.2.2",
"ngx-perfect-scrollbar": "^8.0.0", "ngx-perfect-scrollbar": "^8.0.0",
"pixi.js": "^5.3.2",
"rxjs": "~6.5.4", "rxjs": "~6.5.4",
"swiper": "^5.3.6", "swiper": "^5.3.6",
"tslib": "^1.10.0", "tslib": "^1.10.0",

2
src/app/ui/collection-tools/collection-tools.component.html

@ -20,7 +20,7 @@
<mat-drawer-content class='functionalDomainRight'> <mat-drawer-content class='functionalDomainRight'>
<div class="h5Unity"> <div class="h5Unity">
<!-- H5Canvas --> <!-- H5Canvas -->
<app-working-area></app-working-area>
</div> </div>
<div class="rightAttribute"> <div class="rightAttribute">

23
src/app/ui/ui.module.ts

@ -56,24 +56,24 @@ import { PersonaldataComponent } from '../pages/personaldata/personaldata.compon
import { UserdataComponent, EditUser } from './userdata/userdata.component'; import { UserdataComponent, EditUser } from './userdata/userdata.component';
import { ChangepasswordComponent } from './changepassword/changepassword.component'; import { ChangepasswordComponent } from './changepassword/changepassword.component';
import { OrganizationComponent, CreateOrganization, EditOrganization } from './organization/organization.component'; import { OrganizationComponent, CreateOrganization, EditOrganization } from './organization/organization.component';
import { UnittypeComponent,DialogOverviewExampleDialog,editorialUnit } from './unittype/unittype.component'; import { UnittypeComponent, DialogOverviewExampleDialog, editorialUnit } from './unittype/unittype.component';
import { AuthorityComponent, CreateAuthority } from './authority/authority.component'; import { AuthorityComponent, CreateAuthority } from './authority/authority.component';
import { RoleComponent, CreateRole, EditRole, SharePower } from './role/role.component'; import { RoleComponent, CreateRole, EditRole, SharePower } from './role/role.component';
import { UsermanagementComponent,CreateNewUser,EditNewUser,allRoles,seeInformation } from './usermanagement/usermanagement.component'; import { UsermanagementComponent, CreateNewUser, EditNewUser, allRoles, seeInformation } from './usermanagement/usermanagement.component';
import { IsnoPipe } from '../pipes/boolean.pipe'; import { IsnoPipe } from '../pipes/boolean.pipe';
import {ConfirmpswDirective} from './changepassword/equal-validator.directive' import {ConfirmpswDirective} from './changepassword/equal-validator.directive';
import { TimePipe } from '../pipes/time.pipe'; import { TimePipe } from '../pipes/time.pipe';
import { NavmenusComponent, CreateMenus, EditMenus } from './navmenus/navmenus.component'; import { NavmenusComponent, CreateMenus, EditMenus } from './navmenus/navmenus.component';
import { FireProtectionElementsComponent, Establish, EditingFireControl } from './fire-protection-elements/fire-protection-elements.component'; import { FireProtectionElementsComponent, Establish, EditingFireControl } from './fire-protection-elements/fire-protection-elements.component';
import { FireFightingTemplateComponent, NewFireFighting, EditFireClassification } from './fire-fighting-template/fire-fighting-template.component'; import { FireFightingTemplateComponent, NewFireFighting, EditFireClassification } from './fire-fighting-template/fire-fighting-template.component';
import { MaterialBankComponent,attributeComponent,addAttributeComponent,editAttribute } from './material-bank/material-bank.component'; import { MaterialBankComponent, attributeComponent, addAttributeComponent, editAttribute } from './material-bank/material-bank.component';
import { UnitInformationComponent } from './unit-information/unit-information.component'; import { UnitInformationComponent } from './unit-information/unit-information.component';
import { AddMatLibrary } from './material-bank/addmatlibrary.component'; import { AddMatLibrary } from './material-bank/addmatlibrary.component';
import { EditMatLibrary } from './material-bank/editmatlibrary.component'; import { EditMatLibrary } from './material-bank/editmatlibrary.component';
import { AddOriginalCopy } from './material-bank/addoriginalcopy.component'; import { AddOriginalCopy } from './material-bank/addoriginalcopy.component';
import { FileUploadModule } from 'ng2-file-upload' import { FileUploadModule } from 'ng2-file-upload';
import { EditOriginalCopy } from './material-bank/editoriginalcopy.component'; import { EditOriginalCopy } from './material-bank/editoriginalcopy.component';
import { SelectOriginalCopy } from './material-bank/selectoriginalcopy.component'; import { SelectOriginalCopy } from './material-bank/selectoriginalcopy.component';
import { EditUnitInfo } from './unit-information/editunitinfo.component'; import { EditUnitInfo } from './unit-information/editunitinfo.component';
@ -85,20 +85,21 @@ import { PlanComponent } from './plan/plan.component';
import { AllaroundComponent } from './allaround/allaround.component'; import { AllaroundComponent } from './allaround/allaround.component';
import { FireFightingDeviceComponent } from './fire-fighting-device/fire-fighting-device.component'; import { FireFightingDeviceComponent } from './fire-fighting-device/fire-fighting-device.component';
import { KeySiteComponent } from './key-site/key-site.component'; import { KeySiteComponent } from './key-site/key-site.component';
import { FunctionDivisionComponent,addPartition,addPartitionAttribute } from './function-division/function-division.component'; import { FunctionDivisionComponent, addPartition, addPartitionAttribute } from './function-division/function-division.component';
import { RealisticPictureComponent,previewImg,addRealPicture,editRealPicture } from './realistic-picture/realistic-picture.component'; import { RealisticPictureComponent, previewImg, addRealPicture, editRealPicture } from './realistic-picture/realistic-picture.component';
import { UploadingCADComponent,readFile,editFile } from './uploading-cad/uploading-cad.component'; import { UploadingCADComponent, readFile, editFile } from './uploading-cad/uploading-cad.component';
import { AddHouseInfo } from './basicinfo/addhouseinfo.component'; import { AddHouseInfo } from './basicinfo/addhouseinfo.component';
import { ImgDetails } from './allaround/imgdetails.component'; import { ImgDetails } from './allaround/imgdetails.component';
import { ImagesData,previewBigImg } from './fire-fighting-device/imagesdata.component'; import { ImagesData, previewBigImg } from './fire-fighting-device/imagesdata.component';
import { ImgsDataDetail } from './fire-fighting-device/addGrouping.component'; import { ImgsDataDetail } from './fire-fighting-device/addGrouping.component';
import { KeySiteImgs } from './key-site/keysiteimgs.component'; import { KeySiteImgs } from './key-site/keysiteimgs.component';
import { KeyImgDetail } from './key-site/keyimgdetail.component'; import { KeyImgDetail } from './key-site/keyimgdetail.component';
import { LookMaster } from './basicinfo/lookmaster.component'; import { LookMaster } from './basicinfo/lookmaster.component';
import { CollectionToolsComponent } from './collection-tools/collection-tools.component'; import { CollectionToolsComponent } from './collection-tools/collection-tools.component';
import { WorkingAreaComponent } from '../working-area/working-area.component';
@NgModule({ @NgModule({
declarations: [UiComponent, CardComponent, StepperComponent, TabgroupComponent, ProgressComponent, SnackbarComponent,PersonaldataComponent, UserdataComponent, ChangepasswordComponent, OrganizationComponent, UnittypeComponent, AuthorityComponent, RoleComponent, UsermanagementComponent,IsnoPipe,ConfirmpswDirective,DialogOverviewExampleDialog,CreateAuthority,CreateRole,EditRole,TimePipe,CreateNewUser,EditNewUser,allRoles,SharePower,CreateOrganization,EditOrganization,seeInformation,EditUser,editorialUnit,FireProtectionElementsComponent,Establish,EditingFireControl,FireFightingTemplateComponent, NavmenusComponent,CreateMenus,EditMenus,NewFireFighting,EditFireClassification, MaterialBankComponent, UnitInformationComponent,AddMatLibrary,EditMatLibrary,attributeComponent,AddOriginalCopy,addAttributeComponent,editAttribute,EditOriginalCopy,SelectOriginalCopy,EditUnitInfo,AddUnitInfo,AddGroups,EditGroup, BasicinfoComponent, PlanComponent, AllaroundComponent, FireFightingDeviceComponent, KeySiteComponent, FunctionDivisionComponent, RealisticPictureComponent, UploadingCADComponent,AddHouseInfo,ImgDetails,ImagesData,ImgsDataDetail,KeySiteImgs,KeyImgDetail,addPartition,addPartitionAttribute,previewImg,addRealPicture,editRealPicture,readFile,editFile,LookMaster,previewBigImg, CollectionToolsComponent declarations: [UiComponent, CardComponent, StepperComponent, TabgroupComponent, ProgressComponent, SnackbarComponent, PersonaldataComponent, UserdataComponent, ChangepasswordComponent, OrganizationComponent, UnittypeComponent, AuthorityComponent, RoleComponent, UsermanagementComponent, IsnoPipe, ConfirmpswDirective, DialogOverviewExampleDialog, CreateAuthority, CreateRole, EditRole, TimePipe, CreateNewUser, EditNewUser, allRoles, SharePower, CreateOrganization, EditOrganization, seeInformation, EditUser, editorialUnit, FireProtectionElementsComponent, Establish, EditingFireControl, FireFightingTemplateComponent, NavmenusComponent, CreateMenus, EditMenus, NewFireFighting, EditFireClassification, MaterialBankComponent, UnitInformationComponent, AddMatLibrary, EditMatLibrary, attributeComponent, AddOriginalCopy, addAttributeComponent, editAttribute, EditOriginalCopy, SelectOriginalCopy, EditUnitInfo, AddUnitInfo, AddGroups, EditGroup, BasicinfoComponent, PlanComponent, AllaroundComponent, FireFightingDeviceComponent, KeySiteComponent, FunctionDivisionComponent, RealisticPictureComponent, UploadingCADComponent, AddHouseInfo, ImgDetails, ImagesData, ImgsDataDetail, KeySiteImgs, KeyImgDetail, addPartition, addPartitionAttribute, previewImg, addRealPicture, editRealPicture, readFile, editFile, LookMaster, previewBigImg, CollectionToolsComponent, WorkingAreaComponent
], ],
imports: [ imports: [
@ -146,7 +147,7 @@ import { CollectionToolsComponent } from './collection-tools/collection-tools.co
MatTreeModule, MatTreeModule,
PortalModule, PortalModule,
ScrollingModule, ScrollingModule,
ReactiveFormsModule, ReactiveFormsModule,
FormsModule, FormsModule,
PaginatorModule, PaginatorModule,

0
src/app/working-area/working-area.component.html

0
src/app/working-area/working-area.component.scss

25
src/app/working-area/working-area.component.spec.ts

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { WorkingAreaComponent } from './working-area.component';
describe('WorkingAreaComponent', () => {
let component: WorkingAreaComponent;
let fixture: ComponentFixture<WorkingAreaComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ WorkingAreaComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(WorkingAreaComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

124
src/app/working-area/working-area.component.ts

@ -0,0 +1,124 @@
import { Component, OnInit, ElementRef } from '@angular/core';
import * as PIXI from 'pixi.js';
@Component({
selector: 'app-working-area',
templateUrl: './working-area.component.html',
styleUrls: ['./working-area.component.scss']
})
export class WorkingAreaComponent implements OnInit {
constructor(private element: ElementRef) { }
// 画布程序
app = new PIXI.Application({
width: window.innerWidth, // default: 800
height: window.innerHeight, // default: 600
antialias: true, // default: false
transparent: false, // default: false
resolution: 1, // default: 1
backgroundColor: 0x1099bb
});
// 加载器
loader = PIXI.Loader.shared;
// 背景
background = new PIXI.Container();
ngOnInit(): void {
this.element.nativeElement.appendChild(this.app.view);
this.app.stage.addChild(this.background);
this.createBackgroundImage('assets/images/caiji.jpg');
this.app.ticker.add((delta) => {
// Read mouse points, this could be done also in mousemove/touchmove update. For simplicity it is done here for now.
// When implementing this properly, make sure to implement touchmove as interaction plugins mouse might not update on certain devices.
const mouseposition = this.app.renderer.plugins.interaction.mouse.global;
});
}
// 测试按钮
testButton() {
this.createSprite('assets/images/avatar.jpg');
this.setIcon();
}
setIcon() {
const defaultIcon = 'url(\'assets/images/avatar.jpg\'),auto';
this.app.renderer.plugins.interaction.cursorStyles.default = defaultIcon;
}
// 加载资源
LoadAsset(name: string, path: string) {
this.loader.onProgress.add(() => {
console.log(this.loader.progress);
}); // called once per loaded/errored file
this.loader.onError.add(() => { }); // called once per errored file
this.loader.onLoad.add(() => { }); // called once per loaded file
this.loader.onComplete.add(() => {
alert('aaaaaaaa');
}); // called once when the queued resources all load.
this.loader.add(name, path);
}
createSprite(source: string, width: number = 64, height: number = 64, alpha: number = 1): PIXI.Sprite {
const sprite = PIXI.Sprite.from(source);
sprite.width = width;
sprite.height = height;
sprite.x = 500,
sprite.y = 500,
sprite.alpha = alpha;
sprite.anchor.set(0.5);
sprite.interactive = true;
sprite
.on('pointerdown', this.onDragStart)
.on('pointerup', this.onDragEnd)
.on('pointerupoutside', this.onDragEnd)
.on('pointermove', this.onDragMove);
this.app.stage.addChild(sprite);
return sprite;
}
// 拖动开始
onDragStart(event) {
event.currentTarget.data = event.data;
event.currentTarget.alpha = 0.5;
event.currentTarget.dragging = true;
}
// 拖动结束
onDragEnd(event) {
event.currentTarget.alpha = 1;
event.currentTarget.dragging = false;
event.currentTarget.data = null;
}
// 拖动移动
onDragMove(event) {
if (event.currentTarget.dragging) {
const newPosition = event.currentTarget.data.getLocalPosition(event.currentTarget.parent);
event.currentTarget.x = newPosition.x;
event.currentTarget.y = newPosition.y;
}
}
// 加载精灵图
SetupSprite(name: string) {
const sprite = new PIXI.Sprite(
this.loader.resources[name].texture
);
}
// 画圆
DrawCircle(x: number, y: number): void {
const circle = new PIXI.Graphics();
circle.beginFill(0x5cafe2);
circle.drawCircle(0, 0, 80);
circle.x = x;
circle.y = y;
this.app.stage.addChild(circle);
}
// 改变背景颜色
BackgroundChanged(backgroundColor: number): void {
this.app.renderer.backgroundColor = backgroundColor;
}
// 创建背景图片
createBackgroundImage(source: string): PIXI.Sprite {
return this.createSprite(source, 500, 500, 1);
}
}
Loading…
Cancel
Save