初始化
This commit is contained in:
commit
94a63bbcaa
4
.gitignore
vendored
Normal file
4
.gitignore
vendored
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
node_modules/
|
||||||
|
dist/
|
||||||
|
https/
|
||||||
|
.git/
|
||||||
92
README.md
Normal file
92
README.md
Normal file
@ -0,0 +1,92 @@
|
|||||||
|
# web
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## Getting started
|
||||||
|
|
||||||
|
To make it easy for you to get started with GitLab, here's a list of recommended next steps.
|
||||||
|
|
||||||
|
Already a pro? Just edit this README.md and make it your own. Want to make it easy? [Use the template at the bottom](#editing-this-readme)!
|
||||||
|
|
||||||
|
## Add your files
|
||||||
|
|
||||||
|
- [ ] [Create](https://docs.gitlab.com/ee/user/project/repository/web_editor.html#create-a-file) or [upload](https://docs.gitlab.com/ee/user/project/repository/web_editor.html#upload-a-file) files
|
||||||
|
- [ ] [Add files using the command line](https://docs.gitlab.com/ee/gitlab-basics/add-file.html#add-a-file-using-the-command-line) or push an existing Git repository with the following command:
|
||||||
|
|
||||||
|
```
|
||||||
|
cd existing_repo
|
||||||
|
git remote add origin http://bf3e40369d68/dianwutong_frontend/web.git
|
||||||
|
git branch -M main
|
||||||
|
git push -uf origin main
|
||||||
|
```
|
||||||
|
|
||||||
|
## Integrate with your tools
|
||||||
|
|
||||||
|
- [ ] [Set up project integrations](http://bf3e40369d68/dianwutong_frontend/web/-/settings/integrations)
|
||||||
|
|
||||||
|
## Collaborate with your team
|
||||||
|
|
||||||
|
- [ ] [Invite team members and collaborators](https://docs.gitlab.com/ee/user/project/members/)
|
||||||
|
- [ ] [Create a new merge request](https://docs.gitlab.com/ee/user/project/merge_requests/creating_merge_requests.html)
|
||||||
|
- [ ] [Automatically close issues from merge requests](https://docs.gitlab.com/ee/user/project/issues/managing_issues.html#closing-issues-automatically)
|
||||||
|
- [ ] [Enable merge request approvals](https://docs.gitlab.com/ee/user/project/merge_requests/approvals/)
|
||||||
|
- [ ] [Set auto-merge](https://docs.gitlab.com/ee/user/project/merge_requests/merge_when_pipeline_succeeds.html)
|
||||||
|
|
||||||
|
## Test and Deploy
|
||||||
|
|
||||||
|
Use the built-in continuous integration in GitLab.
|
||||||
|
|
||||||
|
- [ ] [Get started with GitLab CI/CD](https://docs.gitlab.com/ee/ci/quick_start/index.html)
|
||||||
|
- [ ] [Analyze your code for known vulnerabilities with Static Application Security Testing(SAST)](https://docs.gitlab.com/ee/user/application_security/sast/)
|
||||||
|
- [ ] [Deploy to Kubernetes, Amazon EC2, or Amazon ECS using Auto Deploy](https://docs.gitlab.com/ee/topics/autodevops/requirements.html)
|
||||||
|
- [ ] [Use pull-based deployments for improved Kubernetes management](https://docs.gitlab.com/ee/user/clusters/agent/)
|
||||||
|
- [ ] [Set up protected environments](https://docs.gitlab.com/ee/ci/environments/protected_environments.html)
|
||||||
|
|
||||||
|
***
|
||||||
|
|
||||||
|
# Editing this README
|
||||||
|
|
||||||
|
When you're ready to make this README your own, just edit this file and use the handy template below (or feel free to structure it however you want - this is just a starting point!). Thank you to [makeareadme.com](https://www.makeareadme.com/) for this template.
|
||||||
|
|
||||||
|
## Suggestions for a good README
|
||||||
|
Every project is different, so consider which of these sections apply to yours. The sections used in the template are suggestions for most open source projects. Also keep in mind that while a README can be too long and detailed, too long is better than too short. If you think your README is too long, consider utilizing another form of documentation rather than cutting out information.
|
||||||
|
|
||||||
|
## Name
|
||||||
|
Choose a self-explaining name for your project.
|
||||||
|
|
||||||
|
## Description
|
||||||
|
Let people know what your project can do specifically. Provide context and add a link to any reference visitors might be unfamiliar with. A list of Features or a Background subsection can also be added here. If there are alternatives to your project, this is a good place to list differentiating factors.
|
||||||
|
|
||||||
|
## Badges
|
||||||
|
On some READMEs, you may see small images that convey metadata, such as whether or not all the tests are passing for the project. You can use Shields to add some to your README. Many services also have instructions for adding a badge.
|
||||||
|
|
||||||
|
## Visuals
|
||||||
|
Depending on what you are making, it can be a good idea to include screenshots or even a video (you'll frequently see GIFs rather than actual videos). Tools like ttygif can help, but check out Asciinema for a more sophisticated method.
|
||||||
|
|
||||||
|
## Installation
|
||||||
|
Within a particular ecosystem, there may be a common way of installing things, such as using Yarn, NuGet, or Homebrew. However, consider the possibility that whoever is reading your README is a novice and would like more guidance. Listing specific steps helps remove ambiguity and gets people to using your project as quickly as possible. If it only runs in a specific context like a particular programming language version or operating system or has dependencies that have to be installed manually, also add a Requirements subsection.
|
||||||
|
|
||||||
|
## Usage
|
||||||
|
Use examples liberally, and show the expected output if you can. It's helpful to have inline the smallest example of usage that you can demonstrate, while providing links to more sophisticated examples if they are too long to reasonably include in the README.
|
||||||
|
|
||||||
|
## Support
|
||||||
|
Tell people where they can go to for help. It can be any combination of an issue tracker, a chat room, an email address, etc.
|
||||||
|
|
||||||
|
## Roadmap
|
||||||
|
If you have ideas for releases in the future, it is a good idea to list them in the README.
|
||||||
|
|
||||||
|
## Contributing
|
||||||
|
State if you are open to contributions and what your requirements are for accepting them.
|
||||||
|
|
||||||
|
For people who want to make changes to your project, it's helpful to have some documentation on how to get started. Perhaps there is a script that they should run or some environment variables that they need to set. Make these steps explicit. These instructions could also be useful to your future self.
|
||||||
|
|
||||||
|
You can also document commands to lint the code or run tests. These steps help to ensure high code quality and reduce the likelihood that the changes inadvertently break something. Having instructions for running tests is especially helpful if it requires external setup, such as starting a Selenium server for testing in a browser.
|
||||||
|
|
||||||
|
## Authors and acknowledgment
|
||||||
|
Show your appreciation to those who have contributed to the project.
|
||||||
|
|
||||||
|
## License
|
||||||
|
For open source projects, say how it is licensed.
|
||||||
|
|
||||||
|
## Project status
|
||||||
|
If you have run out of energy or time for your project, put a note at the top of the README saying that development has slowed down or stopped completely. Someone may choose to fork your project or volunteer to step in as a maintainer or owner, allowing your project to keep going. You can also make an explicit request for maintainers.
|
||||||
12049
dwt-account/webpack-account/package-lock.json
generated
Normal file
12049
dwt-account/webpack-account/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
40
dwt-account/webpack-account/package.json
Normal file
40
dwt-account/webpack-account/package.json
Normal file
@ -0,0 +1,40 @@
|
|||||||
|
{
|
||||||
|
"name": "webpack-account",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"description": "",
|
||||||
|
"main": "login.js",
|
||||||
|
"scripts": {
|
||||||
|
"test": "echo \"Error: no test specified\" && exit 1",
|
||||||
|
"start": "set NODE_ENV=development&&webpack-dev-server --hot",
|
||||||
|
"release": "set NODE_ENV=production&&webpack",
|
||||||
|
"releaseTest": "set NODE_ENV=test&&webpack"
|
||||||
|
},
|
||||||
|
"author": "",
|
||||||
|
"license": "ISC",
|
||||||
|
"dependencies": {
|
||||||
|
"install": "^0.10.2",
|
||||||
|
"jquery": "^3.2.1",
|
||||||
|
"npm": "^5.6.0",
|
||||||
|
"rxjs": "^5.5.6",
|
||||||
|
"webpack": "^3.1.0"
|
||||||
|
},
|
||||||
|
"devDependencies": {
|
||||||
|
"babel-core": "^6.26.0",
|
||||||
|
"babel-loader": "^7.1.2",
|
||||||
|
"babel-preset-es2015": "^6.24.1",
|
||||||
|
"css-loader": "^0.28.10",
|
||||||
|
"es6-promise-promise": "^1.0.0",
|
||||||
|
"extract-text-webpack-plugin": "^3.0.2",
|
||||||
|
"file-loader": "^1.1.6",
|
||||||
|
"happypack": "^4.0.0",
|
||||||
|
"html-webpack-layout-plugin": "0.0.2",
|
||||||
|
"html-webpack-plugin": "^2.30.1",
|
||||||
|
"node-sass": "^4.7.2",
|
||||||
|
"sass-loader": "^6.0.7",
|
||||||
|
"style-loader": "^0.19.1",
|
||||||
|
"uglifyjs-webpack-plugin": "^1.1.6",
|
||||||
|
"url-loader": "^0.6.2",
|
||||||
|
"webpack-dev-server": "^2.9.7",
|
||||||
|
"webpack-visualizer-plugin": "^0.1.11"
|
||||||
|
}
|
||||||
|
}
|
||||||
53
dwt-account/webpack-account/releaseHandlePlugin.js
Normal file
53
dwt-account/webpack-account/releaseHandlePlugin.js
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
function ReleaseHandlePlugin(options) {
|
||||||
|
this.env = options.env;
|
||||||
|
}
|
||||||
|
|
||||||
|
ReleaseHandlePlugin.prototype.apply = function (complier) {
|
||||||
|
complier.plugin('compilation', compilation => {
|
||||||
|
|
||||||
|
compilation.plugin('optimize-modules', modules => {
|
||||||
|
modules.forEach(mod => {
|
||||||
|
|
||||||
|
try {
|
||||||
|
if (this.env === 'test') {
|
||||||
|
// mod._source._value = mod._source._value.replace(/api.dianwutong.com/g, 'api.test.dianwutong.com');
|
||||||
|
mod._source._value = mod._source._value.replace(/account.dianwutong.com(:\d+)?/g, 'account.dianwutong.com');
|
||||||
|
mod._source._value = mod._source._value.replace(/ems.dianwutong.com(:\d+)?/g, 'ems.dianwutong.com');
|
||||||
|
mod._source._value = mod._source._value.replace(/edp.dianwutong.com(:\d+)?/g, 'edp.dianwutong.com');
|
||||||
|
} else if (this.env === 'production') {
|
||||||
|
mod._source._value = mod._source._value.replace(/api.dianwutong.com/g, 'api.saas.dianwutong.com');
|
||||||
|
mod._source._value = mod._source._value.replace(/account.dianwutong.com(:\d+)?/g, 'account.saas.dianwutong.com');
|
||||||
|
mod._source._value = mod._source._value.replace(/edp.dianwutong.com(:\d+)?/g, 'edp.saas.dianwutong.com');
|
||||||
|
}
|
||||||
|
console.log("替换成功")
|
||||||
|
} catch (error) {
|
||||||
|
console.error("替换失败")
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
compilation.plugin(
|
||||||
|
'html-webpack-plugin-before-html-processing',
|
||||||
|
(data, cb) => {
|
||||||
|
let html = data.html;
|
||||||
|
html = html.replace('<script type="text/javascript" src="build/dev/vendor.dll.js"></script>','');
|
||||||
|
|
||||||
|
if(this.env === 'test'){
|
||||||
|
html = html.replace(/account.dianwutong.com(:\d+)?/g, 'account.test.dianwutong.com')
|
||||||
|
}else if(this.env === 'production'){
|
||||||
|
html = html.replace(/account.dianwutong.com(:\d+)?/g, 'account.saas.dianwutong.com')
|
||||||
|
}
|
||||||
|
|
||||||
|
data.html = html;
|
||||||
|
|
||||||
|
cb(null, data)
|
||||||
|
}
|
||||||
|
)
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
module.exports = ReleaseHandlePlugin;
|
||||||
2457
dwt-account/webpack-account/src/js/common/ui.js
Normal file
2457
dwt-account/webpack-account/src/js/common/ui.js
Normal file
File diff suppressed because it is too large
Load Diff
291
dwt-account/webpack-account/src/js/login/app.js
Normal file
291
dwt-account/webpack-account/src/js/login/app.js
Normal file
@ -0,0 +1,291 @@
|
|||||||
|
let $ = require('jquery');
|
||||||
|
import { http } from '../utils/http.util';
|
||||||
|
import { appUtil } from '../utils/app.util';
|
||||||
|
import { cookie } from '../utils/cookie.util';
|
||||||
|
|
||||||
|
require('../../scss/login.scss');
|
||||||
|
|
||||||
|
const app = {
|
||||||
|
init: {},
|
||||||
|
bind: {},
|
||||||
|
checkIn: {},
|
||||||
|
}
|
||||||
|
|
||||||
|
app.init = function () {
|
||||||
|
this.bind();
|
||||||
|
this.canJump('ems');
|
||||||
|
// 如果记住密码了
|
||||||
|
let hasRemember = cookie.get('__rem');
|
||||||
|
if (hasRemember) {
|
||||||
|
let str = this.decodeString(hasRemember);
|
||||||
|
let splits = str.split(',./');
|
||||||
|
$("#username").val(splits[0]);
|
||||||
|
$("#password").val(splits[1]);
|
||||||
|
$("#remember").attr('checked', 'checked');
|
||||||
|
}else {
|
||||||
|
// 2018/9/3 update by guoyuanyuan
|
||||||
|
// 没有记住密码时，清空页面密码和账号
|
||||||
|
$('#username').val('');
|
||||||
|
$('#password').val('');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
app.bind = function () {
|
||||||
|
$('#login').click(this.checkIn);
|
||||||
|
// $('#experience').click(this.experience);
|
||||||
|
}
|
||||||
|
|
||||||
|
app.checkIn = function () {
|
||||||
|
|
||||||
|
// Modify start 2018/8/30 14:12 kangzhi
|
||||||
|
// 将输入的用户名和密码的首尾空格去掉
|
||||||
|
let username = $('#username').val().trim();
|
||||||
|
let password = $('#password').val().trim();
|
||||||
|
// Modify end 2018/8/30 14:12 kangzhi
|
||||||
|
|
||||||
|
if (!username) {
|
||||||
|
$("#tips").text('* 请填写用户名');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!password) {
|
||||||
|
$("#tips").text('* 请填写密码');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
$("#tips").text('');
|
||||||
|
http.post('/admin/rest/user/login', {
|
||||||
|
userName: username,
|
||||||
|
password: password
|
||||||
|
}).subscribe(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
// 如果点击了记住密码
|
||||||
|
let isRemember = $("#remember").is(":checked");
|
||||||
|
if (isRemember) {
|
||||||
|
let str = username + ',./' + password;
|
||||||
|
let code = app.encodeString(str);
|
||||||
|
cookie.set('__rem', code, 30);
|
||||||
|
} else if (!isRemember) {
|
||||||
|
// 如果不记住了 就清空掉原来记住的
|
||||||
|
cookie.set('__rem', null, -1);
|
||||||
|
}
|
||||||
|
const userType = parseInt(res.body.userType);
|
||||||
|
|
||||||
|
let url = '';
|
||||||
|
if (userType === 2 || userType === 1) {
|
||||||
|
// 如果是员工的话
|
||||||
|
url = '/ems/rest/employee/role';
|
||||||
|
} else if (userType === 3) {
|
||||||
|
// 如果是客户
|
||||||
|
url = '/ems/rest/customer/token';
|
||||||
|
} else if(userType == 5){
|
||||||
|
// 体验账号
|
||||||
|
window.location.href = "http://edp.dianwutong.com:8081/frame.html";
|
||||||
|
return;
|
||||||
|
|
||||||
|
}else {
|
||||||
|
app.jump();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
http.get(url, {}).subscribe(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
app.jump();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
} else {
|
||||||
|
$("#tips").text('* 用户名或密码不正确');
|
||||||
|
//清空掉原来记住的
|
||||||
|
cookie.set('__rem', null, -1);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 客户体验
|
||||||
|
app.experience = function () {
|
||||||
|
http.post('/admin/rest/user/login_experience', {}).subscribe(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
|
||||||
|
let url = '/ems/rest/customer/token';
|
||||||
|
|
||||||
|
http.get(url, {}).subscribe(res1 => {
|
||||||
|
if (res1.code === 200) {
|
||||||
|
window.location.href = "http://edp.dianwutong.com:8081/frame.html";
|
||||||
|
}
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
$("#tips").text('* 获取信息失败');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
app.jump = function () {
|
||||||
|
// 从哪儿来 回哪儿去
|
||||||
|
let from = appUtil.getParameter('from');
|
||||||
|
|
||||||
|
if (from) {
|
||||||
|
from = unescape(from);
|
||||||
|
}
|
||||||
|
|
||||||
|
// 是否具有跳转的权限 如果没有 则还是跳转到官网
|
||||||
|
// if (/ems(\.test)?.dianwutong.com/.test(from) && this.canJump('ems')) {
|
||||||
|
// window.location.href = from;
|
||||||
|
// return false;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// if (/edp(\.test)?.dianwutong.com/.test(from) && this.canJump('edp')) {
|
||||||
|
// window.location.href = from;
|
||||||
|
// return false;
|
||||||
|
// }
|
||||||
|
|
||||||
|
// if (/console(\.test)?.dianwutong.com/.test(from) && this.canJump('console')) {
|
||||||
|
// window.location.href = from;
|
||||||
|
// return false;
|
||||||
|
// }
|
||||||
|
|
||||||
|
if (from) {
|
||||||
|
window.location.href = from;
|
||||||
|
} else {
|
||||||
|
window.location.href = 'http://www.dianwutong.com'
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// 检测账号能否登录某一网站
|
||||||
|
app.canJump = function (website) {
|
||||||
|
let ROLES = {
|
||||||
|
'KH': 1, // 客户
|
||||||
|
'ZTZ': 2, //巡检组团长
|
||||||
|
'XJZZ': 3, //巡检组长
|
||||||
|
'QXBZ': 4, //抢修班长
|
||||||
|
'QXZZ': 5, //抢修组长
|
||||||
|
'AQY': 6, //安全员
|
||||||
|
'ZBZ': 7, //值班长
|
||||||
|
'JKY': 8, //物料员,
|
||||||
|
'KHJL': 9, //客户经理
|
||||||
|
'GCS': 10, // 工程师，权限和值班长一致
|
||||||
|
};
|
||||||
|
|
||||||
|
const webRoles = {
|
||||||
|
'ems': [ROLES.QXBZ, ROLES.ZTZ, ROLES.AQY, ROLES.XJZZ, ROLES.QXZZ, ROLES.ZBZ],
|
||||||
|
'edp': [ROLES.KH, ROLES.QXBZ, ROLES.ZTZ, ROLES.ZBZ, ROLES.GCS],
|
||||||
|
'console': [ROLES.CONSOLE_ADMIN],
|
||||||
|
'ems_admin': [ROLES.EMS_ADMIN]
|
||||||
|
}
|
||||||
|
|
||||||
|
let roles = cookie.get('roles');
|
||||||
|
!roles && (roles = '');
|
||||||
|
roles = roles.split('a');
|
||||||
|
|
||||||
|
let isContainer = false;
|
||||||
|
|
||||||
|
let length = roles.length;
|
||||||
|
for (let i = 0; i < length; i++) {
|
||||||
|
if (webRoles[website].indexOf(parseInt(roles[i])) !== -1) {
|
||||||
|
isContainer = true;
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
let userType = cookie.get('userType');
|
||||||
|
|
||||||
|
if (website === 'ems' && isContainer) {
|
||||||
|
// 只有员工可以进去
|
||||||
|
if (userType === '2') {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (website === 'edp' && isContainer) {
|
||||||
|
// 只有员工 和 客户可以进去 工程师也可以进去
|
||||||
|
if (userType === '2' || userType === '3' || userType == '5' || userType === '1') {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (website === 'console') {
|
||||||
|
// 只有控制台管理员
|
||||||
|
if (userType === '1') {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 2018/9/3 update by guoyuanyuan
|
||||||
|
// 重写了字符串加密方法
|
||||||
|
/**
|
||||||
|
* encodeString 加密程序
|
||||||
|
* @param {Strng} str 待加密字符串
|
||||||
|
* @param {Number} xor 异或值
|
||||||
|
* @param {Number} hex 加密后的进制数
|
||||||
|
* @return {Strng} 加密后的字符串
|
||||||
|
*/
|
||||||
|
app.encodeString = function (str, xor, hex) {
|
||||||
|
|
||||||
|
if (typeof str !== 'string' ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
xor = xor?xor: 123;
|
||||||
|
hex = hex?hex: 25;
|
||||||
|
let resultList = [];
|
||||||
|
hex = hex <= 25 ? hex : hex % 25;
|
||||||
|
|
||||||
|
for (let i = 0; i < str.length; i++) {
|
||||||
|
// 提取字符串每个字符的ascll码
|
||||||
|
let charCode = str.charCodeAt(i);
|
||||||
|
// 进行异或加密
|
||||||
|
charCode = (charCode * 1) ^ xor;
|
||||||
|
// 异或加密后的字符转成 hex 位数的字符串
|
||||||
|
charCode = charCode.toString(hex);
|
||||||
|
resultList.push(charCode);
|
||||||
|
}
|
||||||
|
|
||||||
|
let splitStr = String.fromCharCode(hex + 97);
|
||||||
|
let resultStr = resultList.join(splitStr);
|
||||||
|
return resultStr;
|
||||||
|
};
|
||||||
|
|
||||||
|
// 2018/9/3 update by guoyuanyuan
|
||||||
|
// 重写了字符串解密方法
|
||||||
|
|
||||||
|
/**
|
||||||
|
* decodeString 解密程序
|
||||||
|
* @param {Strng} str 待加密字符串
|
||||||
|
* @param {Number} xor 异或值
|
||||||
|
* @param {Number} hex 加密后的进制数
|
||||||
|
* @return {Strng} 加密后的字符串
|
||||||
|
*/
|
||||||
|
|
||||||
|
app.decodeString = function (str, xor, hex) {
|
||||||
|
if (typeof str !== 'string' ) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
xor = xor?xor: 123;
|
||||||
|
hex = hex?hex: 25;
|
||||||
|
let strCharList = [];
|
||||||
|
let resultList = [];
|
||||||
|
hex = hex <= 25 ? hex : hex % 25;
|
||||||
|
// 解析出分割字符
|
||||||
|
let splitStr = String.fromCharCode(hex + 97);
|
||||||
|
// 分割出加密字符串的加密后的每个字符
|
||||||
|
strCharList = str.split(splitStr);
|
||||||
|
|
||||||
|
for (let i = 0; i < strCharList.length; i++) {
|
||||||
|
// 将加密后的每个字符转成加密后的ascll码
|
||||||
|
let charCode = parseInt(strCharList[i], hex);
|
||||||
|
// 异或解密出原字符的ascll码
|
||||||
|
charCode = (charCode * 1) ^ xor;
|
||||||
|
let strChar = String.fromCharCode(charCode);
|
||||||
|
resultList.push(strChar);
|
||||||
|
}
|
||||||
|
let resultStr = resultList.join('');
|
||||||
|
return resultStr;
|
||||||
|
};
|
||||||
|
|
||||||
|
app.init();
|
||||||
22
dwt-account/webpack-account/src/js/reset-complete/app.js
Normal file
22
dwt-account/webpack-account/src/js/reset-complete/app.js
Normal file
@ -0,0 +1,22 @@
|
|||||||
|
require('../../scss/reset-complete.scss');
|
||||||
|
let $ = require('jquery');
|
||||||
|
import { cookie } from '../utils/cookie.util';
|
||||||
|
import { appUtil } from '../utils/app.util';
|
||||||
|
let app = {
|
||||||
|
init: {}
|
||||||
|
}
|
||||||
|
|
||||||
|
app.init = function () {
|
||||||
|
this.bind();
|
||||||
|
}
|
||||||
|
|
||||||
|
app.bind = function () {
|
||||||
|
$('#login').click(function () {
|
||||||
|
window.localStorage.removeItem('id');
|
||||||
|
window.location.href = 'login.html?from='+appUtil.getParameter('from');
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
$(function () {
|
||||||
|
app.init();
|
||||||
|
})
|
||||||
63
dwt-account/webpack-account/src/js/reset-password/app.js
Normal file
63
dwt-account/webpack-account/src/js/reset-password/app.js
Normal file
@ -0,0 +1,63 @@
|
|||||||
|
require( '../../scss/reset-password.scss' );
|
||||||
|
|
||||||
|
let $ = require('jquery')
|
||||||
|
import { helper } from './helper';
|
||||||
|
import { appUtil } from '../utils/app.util';
|
||||||
|
|
||||||
|
|
||||||
|
let app = {
|
||||||
|
init:{},
|
||||||
|
bind:{}
|
||||||
|
}
|
||||||
|
app.init = function () {
|
||||||
|
this.bind();
|
||||||
|
}
|
||||||
|
|
||||||
|
app.bind = function () {
|
||||||
|
|
||||||
|
$('#newPassword,#confirmPassword').keyup(function (e) {
|
||||||
|
if(e.keyCode == 13){
|
||||||
|
$('#confirm').click();
|
||||||
|
}
|
||||||
|
let newPassword = $.trim($('#newPassword').val());
|
||||||
|
let confirmPassword = $.trim($('#confirmPassword').val());
|
||||||
|
if(newPassword.length > 0 && confirmPassword.length > 0){
|
||||||
|
|
||||||
|
$('#confirm').addClass('able');
|
||||||
|
}else {
|
||||||
|
$('#confirm').removeClass('able');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
//点击确定按钮
|
||||||
|
$('#confirm').click(function () {
|
||||||
|
$('#newPasswordTip').text('');
|
||||||
|
$('#confirmPassword').text('');
|
||||||
|
|
||||||
|
let newPassword = $.trim($('#newPassword').val());
|
||||||
|
let confirmPassword = $.trim($('#confirmPassword').val());
|
||||||
|
|
||||||
|
if(newPassword.length == 0){
|
||||||
|
$('#newPasswordTip').text('请输入新密码');
|
||||||
|
|
||||||
|
}else if (confirmPassword.length == 0){
|
||||||
|
$('#confirmPasswordTip').text('请确认新密码');
|
||||||
|
}else if(newPassword != confirmPassword){
|
||||||
|
$('#confirmPasswordTip').text('两次密码不一致');
|
||||||
|
}else {
|
||||||
|
//提交修改密码
|
||||||
|
let id = window.localStorage.getItem('id');
|
||||||
|
helper.resetPassword(newPassword,id)
|
||||||
|
.then(function () {
|
||||||
|
window.location.href = 'reset-complete.html?from=' + appUtil.getParameter('from');
|
||||||
|
},function() {
|
||||||
|
$('#confirmPasswordTip').text('密码修改失败');
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
$(function () {
|
||||||
|
app.init();
|
||||||
|
})
|
||||||
20
dwt-account/webpack-account/src/js/reset-password/helper.js
Normal file
20
dwt-account/webpack-account/src/js/reset-password/helper.js
Normal file
@ -0,0 +1,20 @@
|
|||||||
|
import { http } from '../utils/http.util';
|
||||||
|
export let helper = {
|
||||||
|
resetPassword:{}
|
||||||
|
}
|
||||||
|
helper.resetPassword = function (password,id) {
|
||||||
|
const data = {
|
||||||
|
password:password,
|
||||||
|
userId:id
|
||||||
|
}
|
||||||
|
const path = "/admin/rest/user/forget/password";
|
||||||
|
return new Promise(function (resolve,reject) {
|
||||||
|
http.post(path, data).subscribe(function (res) {
|
||||||
|
if(res.code == 200){
|
||||||
|
resolve(res);
|
||||||
|
}else {
|
||||||
|
reject(res.code);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
124
dwt-account/webpack-account/src/js/update-password/app.js
Normal file
124
dwt-account/webpack-account/src/js/update-password/app.js
Normal file
@ -0,0 +1,124 @@
|
|||||||
|
require('../../scss/update-password.scss');
|
||||||
|
let $ = require('jquery');
|
||||||
|
|
||||||
|
import { UI } from '../common/ui';
|
||||||
|
import { http } from '../utils/http.util';
|
||||||
|
import { cookie } from '../utils/cookie.util';
|
||||||
|
import { appUtil } from '../utils/app.util';
|
||||||
|
|
||||||
|
|
||||||
|
let local = {
|
||||||
|
username: null,
|
||||||
|
originPwd: null,
|
||||||
|
newPwd: null,
|
||||||
|
// 用户类型
|
||||||
|
USER_TYPES: {
|
||||||
|
'ADMIN': 1, // 管理员
|
||||||
|
'EMPLOYEE': 2, // 员工
|
||||||
|
'CUSTOMER': 3 // 客户
|
||||||
|
}
|
||||||
|
};
|
||||||
|
$(function () {
|
||||||
|
local.init();
|
||||||
|
});
|
||||||
|
local.init = function () {
|
||||||
|
|
||||||
|
// Add start 2018/9/26 16:00 kangzhi
|
||||||
|
// 体验账户登录后无法显示修改账号密码页，避免体验账户通过直接输入地址跳转到修改页
|
||||||
|
if (cookie.get('experience')) {
|
||||||
|
$('body').html('体验账户无法显示本页面');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
// Add start 2018/9/26 16:00 kangzhi
|
||||||
|
|
||||||
|
|
||||||
|
this.username = cookie.get('userName');
|
||||||
|
this.userType = cookie.get('userType');
|
||||||
|
// Edit start 2018/9/26 16:02 kangzhi
|
||||||
|
// cusName->userName
|
||||||
|
this.realName = (this.userType == this.USER_TYPES.CUSTOMER ? cookie.get('userName') : decodeURI(cookie.get('employeeName')));
|
||||||
|
// Edit end 2018/9/26 16:02 kangzhi
|
||||||
|
$('#username').html(this.username);
|
||||||
|
$('#realName').html(this.realName);
|
||||||
|
local.bind();
|
||||||
|
};
|
||||||
|
local.bind = function () {
|
||||||
|
|
||||||
|
$('#newPwd,#newPwdConfirm,#pwd').on('keyup', function (e) {
|
||||||
|
var pwd = $('#pwd').val();
|
||||||
|
var newPwd = $('#newPwd').val();
|
||||||
|
var newPwdConfirm = $('#newPwdConfirm').val();
|
||||||
|
if (pwd && newPwd && newPwdConfirm) {
|
||||||
|
$('#submit').addClass('active');
|
||||||
|
}else {
|
||||||
|
$('#submit').removeClass('active');
|
||||||
|
}
|
||||||
|
if (e.keyCode == 13) {
|
||||||
|
$("#submit").click();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
$('#submit').click(function () {
|
||||||
|
$('#pwdTip').html('');
|
||||||
|
$('#newPwdTip').html('');
|
||||||
|
var pwd = $('#pwd').val();
|
||||||
|
var newPwd = $('#newPwd').val();
|
||||||
|
var newPwdConfirm = $('#newPwdConfirm').val();
|
||||||
|
if (!pwd) {
|
||||||
|
$('#pwdTip').html('原密码不能为空');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!newPwd) {
|
||||||
|
$('#newPwdTip').html('新密码不能为空');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (!newPwdConfirm) {
|
||||||
|
$('#newPwdConfirmTip').html('请确认密码');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
if (newPwd != newPwdConfirm) {
|
||||||
|
$('#newPwdConfirmTip').html('两次密码不相同');
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (newPwd && pwd && newPwd == newPwdConfirm) {
|
||||||
|
$('#pwdTip').html('');
|
||||||
|
$('#newPwdTip').html('');
|
||||||
|
$('#newPwdConfirmTip').html('');
|
||||||
|
let data = {
|
||||||
|
userName: local.username,
|
||||||
|
oldPassword: pwd,
|
||||||
|
newPassword: newPwd
|
||||||
|
}
|
||||||
|
let path = "/admin/rest/user/edit/password";
|
||||||
|
http.post(path, data).subscribe(function (res) {
|
||||||
|
if (res.code === 200) {
|
||||||
|
UI.alert({
|
||||||
|
'content': "密码已修改成功，请重新登录",
|
||||||
|
'btn': '知道了',
|
||||||
|
'callback': function () {
|
||||||
|
local.logout();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
} else {
|
||||||
|
$('#pwdTip').html('原密码不正确');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 退出登录
|
||||||
|
local.logout = function () {
|
||||||
|
http.post('/admin/rest/user/logout', {}).subscribe(res => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
cookie.deleteAll();
|
||||||
|
window.location.href = 'http://account.dianwutong.com:8020/login.html?form='+appUtil.getParameter('from');
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
67
dwt-account/webpack-account/src/js/utils/app.util.js
Normal file
67
dwt-account/webpack-account/src/js/utils/app.util.js
Normal file
@ -0,0 +1,67 @@
|
|||||||
|
const appUtil = {}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 判断当前浏览器是否是IE浏览器
|
||||||
|
*/
|
||||||
|
appUtil.isIE = function(){
|
||||||
|
var UA = navigator.userAgent;
|
||||||
|
if(/Trident/i.test(UA)){
|
||||||
|
if(/MSIE (\d{1,})/i.test(UA)){
|
||||||
|
return RegExp.$1;
|
||||||
|
}else if(/rv:(\d{1,})/i.test(UA)){
|
||||||
|
return RegExp.$1;
|
||||||
|
}else{
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/***
|
||||||
|
* 对字符串加密
|
||||||
|
* @param str
|
||||||
|
* @returns {string}
|
||||||
|
*/
|
||||||
|
|
||||||
|
appUtil.encodeString = function(str){
|
||||||
|
var length = str.length;
|
||||||
|
var code = '';
|
||||||
|
|
||||||
|
for(var i = 0; i < length; i++){
|
||||||
|
console.log(((+i)+(+str.charAt(i))));
|
||||||
|
code += String.fromCharCode(str.charCodeAt(i)+(i-length));
|
||||||
|
}
|
||||||
|
return code;
|
||||||
|
};
|
||||||
|
|
||||||
|
/***
|
||||||
|
* encodeString的逆序操作
|
||||||
|
* @param code
|
||||||
|
* @returns {string}
|
||||||
|
*/
|
||||||
|
|
||||||
|
appUtil.decodeString = function(code){
|
||||||
|
var length = code.length;
|
||||||
|
var str = '';
|
||||||
|
|
||||||
|
for(var i = 0; i < length; i++){
|
||||||
|
str += String.fromCharCode(code.charCodeAt(i)-(i-length));
|
||||||
|
}
|
||||||
|
return str;
|
||||||
|
};
|
||||||
|
|
||||||
|
/***
|
||||||
|
* 从url上获取一个参数
|
||||||
|
* @param name
|
||||||
|
* @returns {*}
|
||||||
|
*/
|
||||||
|
|
||||||
|
appUtil.getParameter = function (name) {
|
||||||
|
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
|
||||||
|
var r = window.location.search.substr(1).match(reg);
|
||||||
|
if (r != null)return RegExp.$2;
|
||||||
|
return null;
|
||||||
|
};
|
||||||
|
|
||||||
|
exports.appUtil = appUtil;
|
||||||
53
dwt-account/webpack-account/src/js/utils/cookie.util.js
Normal file
53
dwt-account/webpack-account/src/js/utils/cookie.util.js
Normal file
@ -0,0 +1,53 @@
|
|||||||
|
const cookie = {}
|
||||||
|
|
||||||
|
cookie.get = function (key) {
|
||||||
|
|
||||||
|
let reg = '('+key+')=(.*?)(;|$|;\s)';
|
||||||
|
reg = new RegExp(reg);
|
||||||
|
if(reg.test(document.cookie)){
|
||||||
|
return RegExp.$2;
|
||||||
|
}
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 设置一个cookie
|
||||||
|
* @param {string} key
|
||||||
|
* @param {string} value
|
||||||
|
* @param {number} expires
|
||||||
|
* @param {string} path
|
||||||
|
*/
|
||||||
|
cookie.set = function (key, value, expires, path) {
|
||||||
|
|
||||||
|
let cookie = key + '=' + escape(value);
|
||||||
|
|
||||||
|
if(expires){
|
||||||
|
const now = new Date();
|
||||||
|
expires = now.setDate( now.getDate() + expires )
|
||||||
|
cookie += ';expires='+ new Date(expires).toGMTString();
|
||||||
|
}
|
||||||
|
|
||||||
|
if(path){
|
||||||
|
cookie += ';path='+escape(path);
|
||||||
|
}
|
||||||
|
|
||||||
|
document.cookie = cookie;
|
||||||
|
}
|
||||||
|
|
||||||
|
cookie.delete = function (key, path) {
|
||||||
|
cookie.set(key, null, -1, path);
|
||||||
|
}
|
||||||
|
|
||||||
|
cookie.deleteAll = function () {
|
||||||
|
let cookies = document.cookie.replace(/\s/, '').split(';');
|
||||||
|
|
||||||
|
for( let i=0; i<cookies.length; i++){
|
||||||
|
let pairs = cookies[i].split('=');
|
||||||
|
if(pairs && pairs[0]){
|
||||||
|
cookie.delete(pairs[0]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
exports.cookie = cookie;
|
||||||
224
dwt-account/webpack-account/src/js/utils/date.util.js
Normal file
224
dwt-account/webpack-account/src/js/utils/date.util.js
Normal file
@ -0,0 +1,224 @@
|
|||||||
|
function DateUtils(date) {
|
||||||
|
|
||||||
|
this.date = null;
|
||||||
|
|
||||||
|
/***
|
||||||
|
* 设置日期
|
||||||
|
*/
|
||||||
|
this.setDate = function(date) {
|
||||||
|
if (date instanceof Date) {
|
||||||
|
this.date = date;
|
||||||
|
} else if (typeof date == "date") {
|
||||||
|
this.date = date;
|
||||||
|
} else if (typeof date == "string") {
|
||||||
|
date = date.replace(/\-/, '/');
|
||||||
|
this.date = new Date(date);
|
||||||
|
} else if (typeof date == "number") {
|
||||||
|
this.date = new Date(date);
|
||||||
|
} else {
|
||||||
|
this.date = new Date();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/***
|
||||||
|
* 格式化字符串
|
||||||
|
* date 可以是Date类型 或者字符串类型
|
||||||
|
* format 是格式字符串
|
||||||
|
* y 年
|
||||||
|
* M 月
|
||||||
|
* d 日
|
||||||
|
* h 时
|
||||||
|
* m 分钟
|
||||||
|
* s 秒
|
||||||
|
* S 毫秒
|
||||||
|
* q 季度
|
||||||
|
*/
|
||||||
|
this.getFormattedDate = function(format) {
|
||||||
|
if (!format) {
|
||||||
|
format = "yyyy-MM-dd hh:mm:ss";
|
||||||
|
}
|
||||||
|
var o = {
|
||||||
|
"M+": this.date.getMonth() + 1, //month
|
||||||
|
"d+": this.date.getDate(), //day
|
||||||
|
"h+": this.date.getHours(), //hour
|
||||||
|
"m+": this.date.getMinutes(), //minute
|
||||||
|
"s+": this.date.getSeconds(), //second
|
||||||
|
"q+": Math.floor((this.date.getMonth() + 3) / 3), //quarter
|
||||||
|
"S": this.date.getMilliseconds() //millisecond
|
||||||
|
}
|
||||||
|
|
||||||
|
if (/(y+)/.test(format)) {
|
||||||
|
format = format.replace(RegExp.$1, (this.date.getFullYear() + "").substr(4 - RegExp.$1.length));
|
||||||
|
}
|
||||||
|
|
||||||
|
for (var k in o) {
|
||||||
|
if (new RegExp("(" + k + ")").test(format)) {
|
||||||
|
format = format.replace(RegExp.$1, RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return format;
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 判断年份是否为润年
|
||||||
|
*
|
||||||
|
* @param {Number} year
|
||||||
|
*/
|
||||||
|
this.isLeapYear = function(year) {
|
||||||
|
var year = year || this.date.getFullYear();
|
||||||
|
return (year % 400 == 0) || (year % 4 == 0 && year % 100 != 0);
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 获取某一年份的某一月份的天数
|
||||||
|
*
|
||||||
|
* @param {Number} year
|
||||||
|
* @param {Number} month
|
||||||
|
*/
|
||||||
|
this.getMonthDays = function(month,year) {
|
||||||
|
return [31, null, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month] || (this.isLeapYear(year) ? 29 : 28);
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取某年的某天是第几周
|
||||||
|
* @param {Number}
|
||||||
|
* @param {Number}
|
||||||
|
* @param {Number}
|
||||||
|
* @returns {Number}
|
||||||
|
*/
|
||||||
|
this.getWeek = function () {
|
||||||
|
var year = this.date.getFullYear(),
|
||||||
|
month = this.date.getMonth(),
|
||||||
|
days = this.date.getDate();
|
||||||
|
//那一天是那一年中的第多少天
|
||||||
|
for (var i = 0; i < month; i++) {
|
||||||
|
days += this.getMonthDays(i);
|
||||||
|
}
|
||||||
|
|
||||||
|
//那一年第一天是星期几
|
||||||
|
var yearFirstDay = new Date(year, 0, 1).getDay() || 7;
|
||||||
|
|
||||||
|
var week = null;
|
||||||
|
if (yearFirstDay == 1) {
|
||||||
|
week = Math.ceil(days / yearFirstDay);
|
||||||
|
} else {
|
||||||
|
days -= (7 - yearFirstDay + 1);
|
||||||
|
week = Math.ceil(days / 7) + 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
return week;
|
||||||
|
}
|
||||||
|
|
||||||
|
/***
|
||||||
|
* 获取毫秒数
|
||||||
|
*/
|
||||||
|
this.getMillisecond = function(){
|
||||||
|
return this.date.valueOf();
|
||||||
|
}
|
||||||
|
|
||||||
|
/***
|
||||||
|
* 获取日期的毫秒数 00:00:00
|
||||||
|
*/
|
||||||
|
this.getFirstMillisecondOfDate = function () {
|
||||||
|
var d = new Date(this.date.getFullYear(), this.date.getMonth(), this.date.getDate(), 0, 0, 0);
|
||||||
|
return d.getTime();
|
||||||
|
}
|
||||||
|
/***
|
||||||
|
* 获取日期的毫秒数 23:59:59
|
||||||
|
*/
|
||||||
|
this.getLastMillisecondOfDate = function () {
|
||||||
|
var d = new Date(this.date.getFullYear(), this.date.getMonth(), this.date.getDate(), 23, 59, 59);
|
||||||
|
return d.getTime();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 获取日期的毫秒数 hour:00:00
|
||||||
|
*/
|
||||||
|
this.getFirstMillisecondOfHour = function () {
|
||||||
|
var d = new Date(this.date.getFullYear(), this.date.getMonth(), this.date.getDate(), this.date.getHours(), 0, 0);
|
||||||
|
return d.getTime();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 获取日期的毫秒数 hour:59:59
|
||||||
|
*/
|
||||||
|
this.getLastMillisecondOfHour = function () {
|
||||||
|
var d = new Date(this.date.getFullYear(), this.date.getMonth(), this.date.getDate(), this.date.getHours(), 59, 59);
|
||||||
|
return d.getTime();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 获取本月第一天的秒数
|
||||||
|
*/
|
||||||
|
this.getFirstMillisecondOfMonth = function () {
|
||||||
|
var d = new Date(this.date.getFullYear(),this.date.getMonth(),1,0,0,0);
|
||||||
|
return d.getTime();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 获取本月最后一天的秒数
|
||||||
|
*/
|
||||||
|
this.getLastMillisecondOfMonth = function (year,month) {
|
||||||
|
var day;
|
||||||
|
var month = month || this.date.getMonth();
|
||||||
|
var year = year || this.date.getFullYear();
|
||||||
|
day = this.getMonthDays(month,year);
|
||||||
|
var d = new Date(this.date.getFullYear(),this.date.getMonth(),day,23,59,59);
|
||||||
|
return d.getTime();
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取本年第一月第一天的秒数
|
||||||
|
*/
|
||||||
|
this.getFirstMillisecondOfYear = function () {
|
||||||
|
var d = new Date(this.date.getFullYear(),0,1,0,0,0);
|
||||||
|
return d.getTime();
|
||||||
|
}
|
||||||
|
/**
|
||||||
|
* 获取本年最后一天的秒数
|
||||||
|
*/
|
||||||
|
this.getLastMillisecondOfYear = function () {
|
||||||
|
var d = new Date(this.date.getFullYear(),11,31,23,59,59);
|
||||||
|
return d.getTime();
|
||||||
|
}
|
||||||
|
/***
|
||||||
|
* 计算第一个日期距离第二个日期多少天
|
||||||
|
* 如果不传递第二个日期 默认是当前日期
|
||||||
|
*/
|
||||||
|
this.getDateDistance = function(date1, date2){
|
||||||
|
var times1, times2;
|
||||||
|
|
||||||
|
if(!date1 || !(date1 instanceof Date)){
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
if(!date2){
|
||||||
|
date2 = new Date();
|
||||||
|
}else if(!(date2 instanceof Date)){
|
||||||
|
return null
|
||||||
|
}
|
||||||
|
|
||||||
|
var d1 = new Date(date1.getFullYear(), date1.getMonth(), date1.getDate());
|
||||||
|
var d2 = new Date(date2.getFullYear(), date2.getMonth(), date2.getDate());
|
||||||
|
|
||||||
|
return (d1-d2)/86400000;
|
||||||
|
}
|
||||||
|
|
||||||
|
/***
|
||||||
|
* 增加天数
|
||||||
|
*/
|
||||||
|
this.addDays = function(days) {
|
||||||
|
var daysMilliSeconds = days*86400000;
|
||||||
|
var targetMilliSeconds = this.date.valueOf()+daysMilliSeconds;
|
||||||
|
this.date = new Date(targetMilliSeconds);
|
||||||
|
};
|
||||||
|
|
||||||
|
/***
|
||||||
|
* 减少天数
|
||||||
|
*/
|
||||||
|
this.subDays = function(days) {
|
||||||
|
var daysMilliSeconds = days*86400000;
|
||||||
|
var targetMilliSeconds = this.date.valueOf() - daysMilliSeconds;
|
||||||
|
this.date = new Date(targetMilliSeconds);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
//设置初始日期
|
||||||
|
this.setDate(date);
|
||||||
|
}
|
||||||
|
|
||||||
|
exports.dateUtil = new DateUtils();
|
||||||
177
dwt-account/webpack-account/src/js/utils/http.util.js
Normal file
177
dwt-account/webpack-account/src/js/utils/http.util.js
Normal file
@ -0,0 +1,177 @@
|
|||||||
|
import { Subject, Observable } from 'rxjs/Rx'
|
||||||
|
import { Rx } from 'rxjs'
|
||||||
|
import { cookie } from '../utils/cookie.util'
|
||||||
|
|
||||||
|
// const basePath = 'http://api.dianwutong.com';
|
||||||
|
const basePath = 'https://api.saas.dianwutong.com'
|
||||||
|
|
||||||
|
const http = {}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* http post 请求
|
||||||
|
* @param { string } url
|
||||||
|
* @param { json } param
|
||||||
|
*/
|
||||||
|
|
||||||
|
http.post = function (url, param) {
|
||||||
|
|
||||||
|
// 不传路径的话 直接返回
|
||||||
|
|
||||||
|
if (!url) {
|
||||||
|
return Observable.create(ob => {
|
||||||
|
throw new Error('路径不合法')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
url = basePath + url
|
||||||
|
param = param ? param : {}
|
||||||
|
|
||||||
|
// 如果有查找到token 在url中加入token
|
||||||
|
const token = cookie.get('token')
|
||||||
|
|
||||||
|
if (token) {
|
||||||
|
url = url + '?token=' + token
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
return Observable.ajax({
|
||||||
|
url: url,
|
||||||
|
method: 'POST',
|
||||||
|
crossDomain: true,
|
||||||
|
withCredentials: true,
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json'
|
||||||
|
},
|
||||||
|
body: param
|
||||||
|
}).map(e => {
|
||||||
|
return e.response
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
http.get = function (url, param) {
|
||||||
|
|
||||||
|
// 不传路径的话 直接返回
|
||||||
|
|
||||||
|
if (!url) {
|
||||||
|
return Observable.create(ob => {
|
||||||
|
throw new Error('路径不合法')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
let observable = new Subject()
|
||||||
|
url = basePath + url
|
||||||
|
|
||||||
|
// 如果参数不为空 将参数拼接到url后面
|
||||||
|
|
||||||
|
let queries = []
|
||||||
|
|
||||||
|
// 如果已经登录 传入token
|
||||||
|
|
||||||
|
let token = cookie.get('token')
|
||||||
|
|
||||||
|
if (token) {
|
||||||
|
queries.push('token=' + token)
|
||||||
|
}
|
||||||
|
|
||||||
|
if (param) {
|
||||||
|
for (var i in param) {
|
||||||
|
if (param.hasOwnProperty(i)) {
|
||||||
|
queries.push(i + '=' + param[i])
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
let queryString = queries.join('&')
|
||||||
|
|
||||||
|
if (queryString) {
|
||||||
|
url = url + '?' + queryString
|
||||||
|
}
|
||||||
|
|
||||||
|
return Observable.ajax({
|
||||||
|
url: url,
|
||||||
|
method: 'GET',
|
||||||
|
crossDomain: true,
|
||||||
|
withCredentials: true,
|
||||||
|
}).map(e => {
|
||||||
|
return e.response
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* http post 请求
|
||||||
|
* @param { string } url
|
||||||
|
* @param { json } param
|
||||||
|
*/
|
||||||
|
|
||||||
|
http.put = function (url, param) {
|
||||||
|
|
||||||
|
// 不传路径的话 直接返回
|
||||||
|
|
||||||
|
if (!url) {
|
||||||
|
return Observable.create(ob => {
|
||||||
|
throw new Error('路径不合法')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
url = basePath + url
|
||||||
|
|
||||||
|
// 如果有查找到token 在url中加入token
|
||||||
|
// TODO
|
||||||
|
|
||||||
|
// 如果有查找到token 在url中加入token
|
||||||
|
const token = cookie.get('token')
|
||||||
|
|
||||||
|
if (token) {
|
||||||
|
url = url + '?token=' + token
|
||||||
|
}
|
||||||
|
|
||||||
|
param = param ? param : {}
|
||||||
|
|
||||||
|
return Observable.ajax({
|
||||||
|
url: url,
|
||||||
|
method: 'POST',
|
||||||
|
crossDomain: true,
|
||||||
|
headers: {
|
||||||
|
'Content-Type': 'application/json'
|
||||||
|
},
|
||||||
|
body: param
|
||||||
|
}).map(e => {
|
||||||
|
return e.response
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
http.uploadFile = function (file, from, type) {
|
||||||
|
var form = new FormData()
|
||||||
|
|
||||||
|
var fileName = 'img.' + file.type.split('/')[1]
|
||||||
|
|
||||||
|
form.append('file', file, fileName)
|
||||||
|
form.append('from', from)
|
||||||
|
form.append('type', type)
|
||||||
|
|
||||||
|
url = basePath + '/file_upload.do'
|
||||||
|
|
||||||
|
const token = cookie.get('token')
|
||||||
|
|
||||||
|
if (token) {
|
||||||
|
url = url + '?token=' + token
|
||||||
|
}
|
||||||
|
|
||||||
|
var param = {
|
||||||
|
url: url,
|
||||||
|
method: 'POST',
|
||||||
|
contentType: 'application/json;charset=utf-8',
|
||||||
|
body: form
|
||||||
|
}
|
||||||
|
return Rx.Observable.ajax(param).map(function (res) {
|
||||||
|
if (res.status == 200) {
|
||||||
|
return res.response
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
exports.http = http
|
||||||
139
dwt-account/webpack-account/src/js/verify-phone/app.js
Normal file
139
dwt-account/webpack-account/src/js/verify-phone/app.js
Normal file
@ -0,0 +1,139 @@
|
|||||||
|
require('../../scss/verify-phone.scss');
|
||||||
|
let $ = require('jquery');
|
||||||
|
|
||||||
|
import { helper } from './helper';
|
||||||
|
import { appUtil } from '../utils/app.util';
|
||||||
|
|
||||||
|
let app = {
|
||||||
|
init: {},
|
||||||
|
bind: {},
|
||||||
|
isCountingDown: false,
|
||||||
|
};
|
||||||
|
app.init = function () {
|
||||||
|
|
||||||
|
this.bind();
|
||||||
|
};
|
||||||
|
|
||||||
|
app.bind = function () {
|
||||||
|
|
||||||
|
var _this = app;
|
||||||
|
let $countDown = $('#countDown');
|
||||||
|
let $phoneNumber = $('#phoneNumber');
|
||||||
|
let $phoneTip = $('#phoneTip');
|
||||||
|
let $codeTip = $('#codeTip');
|
||||||
|
let $codeNumber = $('#codeNumber');
|
||||||
|
let $confirm = $('#confirm');
|
||||||
|
|
||||||
|
//点击获取验证码按钮
|
||||||
|
|
||||||
|
$countDown.on('click', function () {
|
||||||
|
if (_this.isCountingDown) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
//验证手机号码是否为空，如果为空，给出提示
|
||||||
|
|
||||||
|
let phoneNumber = $phoneNumber.val();
|
||||||
|
if (!phoneNumber) {
|
||||||
|
$phoneTip.html('请输入手机号');
|
||||||
|
return;
|
||||||
|
} else {
|
||||||
|
$phoneTip.html('');
|
||||||
|
|
||||||
|
//手机号不为空 验证手机号是否正确 如果正确进行倒计时 不正确则给出提示
|
||||||
|
|
||||||
|
_this.verifyPhone(phoneNumber);
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
//监听手机号和验证码输入 不为空时改变提交按钮状态
|
||||||
|
|
||||||
|
$('#phoneNumber,#codeNumber').keyup(function (e) {
|
||||||
|
if (e.keyCode == 13) {
|
||||||
|
$confirm.click();
|
||||||
|
}
|
||||||
|
let phoneNumber = $.trim($phoneNumber.val());
|
||||||
|
let codeNumber = $.trim($codeNumber.val());
|
||||||
|
|
||||||
|
if (phoneNumber.length > 0 && codeNumber.length > 0) {
|
||||||
|
$confirm.addClass('able');
|
||||||
|
} else {
|
||||||
|
$confirm.removeClass('able');
|
||||||
|
}
|
||||||
|
|
||||||
|
});
|
||||||
|
|
||||||
|
//点击确定按钮
|
||||||
|
$confirm.on('click', function () {
|
||||||
|
$phoneTip.text('');
|
||||||
|
$codeTip.text('');
|
||||||
|
let phoneNumber = $.trim($phoneNumber.val());
|
||||||
|
let codeNumber = $.trim($codeNumber.val());
|
||||||
|
|
||||||
|
if (phoneNumber.length == 0) {
|
||||||
|
$phoneTip.text('请填写手机号');
|
||||||
|
return;
|
||||||
|
} else if (codeNumber.length == 0) {
|
||||||
|
$phoneTip.text('');
|
||||||
|
$codeTip.text('请填写验证码');
|
||||||
|
return;
|
||||||
|
} else {
|
||||||
|
helper.verifyPhone(phoneNumber, codeNumber)
|
||||||
|
.then(function (res) {
|
||||||
|
//存储id
|
||||||
|
window.localStorage.setItem('id',escape (res.body))
|
||||||
|
window.location.href = 'reset-password.html?from='+appUtil.getParameter('from');
|
||||||
|
|
||||||
|
|
||||||
|
}, function () {
|
||||||
|
$codeTip.text('验证码不正确');
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
//验证手机号是否正确 如果正确进行倒计时 不正确则给出提示
|
||||||
|
|
||||||
|
app.verifyPhone = function (mobile) {
|
||||||
|
let _this = app;
|
||||||
|
let $phoneTip = $('#phoneTip');
|
||||||
|
helper.getCode(mobile)
|
||||||
|
.then(function (res) {
|
||||||
|
$phoneTip.html('');
|
||||||
|
_this.countDown();
|
||||||
|
})
|
||||||
|
.catch(function () {
|
||||||
|
$phoneTip.html('手机号不正确');
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
//进行倒计时
|
||||||
|
|
||||||
|
app.countDown = function () {
|
||||||
|
let _this = app;
|
||||||
|
let $countDown = $('#countDown');
|
||||||
|
var i = 60;
|
||||||
|
_this.isCountingDown = true;
|
||||||
|
countdown();
|
||||||
|
function countdown() {
|
||||||
|
i--;
|
||||||
|
if (i <= 0) {
|
||||||
|
$countDown.val('点击获取验证码');
|
||||||
|
_this.isCountingDown = false;
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
$countDown.val(i + 's');
|
||||||
|
if (timer) {
|
||||||
|
window.clearTimeout(timer);
|
||||||
|
}
|
||||||
|
var timer = window.setTimeout(countdown, 1000);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
};
|
||||||
|
$(function () {
|
||||||
|
app.init();
|
||||||
|
});
|
||||||
56
dwt-account/webpack-account/src/js/verify-phone/helper.js
Normal file
56
dwt-account/webpack-account/src/js/verify-phone/helper.js
Normal file
@ -0,0 +1,56 @@
|
|||||||
|
|
||||||
|
import { http } from '../utils/http.util';
|
||||||
|
|
||||||
|
export var helper = {
|
||||||
|
|
||||||
|
checkIn : {},
|
||||||
|
experience : {}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
/***
|
||||||
|
* 获取短信验证码
|
||||||
|
* @param mobile
|
||||||
|
* @returns {Promise}
|
||||||
|
*/
|
||||||
|
|
||||||
|
helper.getCode = function (mobile) {
|
||||||
|
const data = {
|
||||||
|
userName:mobile
|
||||||
|
};
|
||||||
|
let path = '/admin/rest/user/get/sms';
|
||||||
|
|
||||||
|
return new Promise(function (resolve,reject) {
|
||||||
|
http.post(path,data).subscribe(function (res) {
|
||||||
|
if(res.code == '200'){
|
||||||
|
resolve(res);
|
||||||
|
}else {
|
||||||
|
reject(res.code);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 验证手机号和验证码是否正确
|
||||||
|
*/
|
||||||
|
|
||||||
|
helper.verifyPhone = function (mobile,sms) {
|
||||||
|
const data = {
|
||||||
|
userName:mobile,
|
||||||
|
code:sms
|
||||||
|
};
|
||||||
|
const path = '/admin/rest/user/sms/validate';
|
||||||
|
return new Promise(function (resolve,reject) {
|
||||||
|
http.post(path, data).subscribe(function (res) {
|
||||||
|
|
||||||
|
if(res.code == '200'){
|
||||||
|
console.log(res)
|
||||||
|
resolve(res);
|
||||||
|
}else {
|
||||||
|
console.log(88888888888)
|
||||||
|
reject(res.code);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
18
dwt-account/webpack-account/src/scss/common.scss
Normal file
18
dwt-account/webpack-account/src/scss/common.scss
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
body{
|
||||||
|
padding: 0px;
|
||||||
|
margin: 0px;
|
||||||
|
min-width: 1400px;
|
||||||
|
animation: bodyFadeIn .2s linear forwards;
|
||||||
|
}
|
||||||
|
@keyframes bodyFadeIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.height100 {
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
1208
dwt-account/webpack-account/src/scss/common/ui.scss
Normal file
1208
dwt-account/webpack-account/src/scss/common/ui.scss
Normal file
File diff suppressed because it is too large
Load Diff
134
dwt-account/webpack-account/src/scss/login.scss
Normal file
134
dwt-account/webpack-account/src/scss/login.scss
Normal file
@ -0,0 +1,134 @@
|
|||||||
|
@import 'common';
|
||||||
|
.container {
|
||||||
|
max-width: 900px;
|
||||||
|
min-width: 600px;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header {
|
||||||
|
padding: 30px 0;
|
||||||
|
|
||||||
|
img {
|
||||||
|
height: 70px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.height19 {
|
||||||
|
width: 100%;
|
||||||
|
height: 19px;
|
||||||
|
}
|
||||||
|
.height21 {
|
||||||
|
width: 100%;
|
||||||
|
height: 21px;
|
||||||
|
}
|
||||||
|
.height33 {
|
||||||
|
width: 100%;
|
||||||
|
height: 33px;
|
||||||
|
}
|
||||||
|
.height37 {
|
||||||
|
width: 100%;
|
||||||
|
height: 37px;
|
||||||
|
}
|
||||||
|
.height60 {
|
||||||
|
width: 100%;
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.body {
|
||||||
|
height: 600px;
|
||||||
|
padding: 35px 0px 47px 0px;
|
||||||
|
background: #f8f8f8;
|
||||||
|
box-sizing: border-box;
|
||||||
|
.container {
|
||||||
|
height: 100%;
|
||||||
|
background: url('http://cdn.saas.dianwutong.com/account/img/login-bg.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.panel {
|
||||||
|
font-size: 14px;
|
||||||
|
width: 360px;
|
||||||
|
height: 460px;
|
||||||
|
padding: 71px 30px 0px 30px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background-color: rgba(255, 255, 255, 0.9);
|
||||||
|
box-shadow: 0px 0px 43px 0px rgba(0, 0, 0, 0.13);
|
||||||
|
opacity: 0.9;
|
||||||
|
right: -200px;
|
||||||
|
top: 30px;
|
||||||
|
position: absolute;
|
||||||
|
|
||||||
|
input {
|
||||||
|
width: 300px;
|
||||||
|
height: 38px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
border: solid 1px #e5e5e5;
|
||||||
|
padding: 0px 11px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
&:focus {
|
||||||
|
border: solid 1px #e9be2b;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
&[type='checkbox'] {
|
||||||
|
width: 14px;
|
||||||
|
height: 14px;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
outline: none;
|
||||||
|
border: none;
|
||||||
|
width: 300px;
|
||||||
|
height: 40px;
|
||||||
|
background-color: #e9be2b;
|
||||||
|
|
||||||
|
&.experience {
|
||||||
|
background: #ccc;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.row {
|
||||||
|
position: relative;
|
||||||
|
height: 14px;
|
||||||
|
.forget {
|
||||||
|
position: absolute;
|
||||||
|
right: 0px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tips {
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer {
|
||||||
|
color: #686868;
|
||||||
|
font-size: 14px;
|
||||||
|
a {
|
||||||
|
color: #686868;
|
||||||
|
}
|
||||||
|
|
||||||
|
.qr-code-con {
|
||||||
|
font-size: 0px;
|
||||||
|
.qr-code {
|
||||||
|
display: inline-block;
|
||||||
|
width: 112px;
|
||||||
|
margin-right: 18px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
vertical-align: top;
|
||||||
|
img {
|
||||||
|
width: 112px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
185
dwt-account/webpack-account/src/scss/reset-complete.scss
Normal file
185
dwt-account/webpack-account/src/scss/reset-complete.scss
Normal file
@ -0,0 +1,185 @@
|
|||||||
|
@import "common";
|
||||||
|
.container{
|
||||||
|
height: 1000px;
|
||||||
|
background: white;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.center{
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.container .header{
|
||||||
|
height: 95px;
|
||||||
|
background:#d9d9d9 ;
|
||||||
|
font-size: 18px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.container .header span{
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: bottom;
|
||||||
|
margin-left: 22px;
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
width: 981px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.height70{
|
||||||
|
height: 70px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.arrow-foreground,.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
right: -15px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-width: 15px 0 15px 15px;
|
||||||
|
border-style: dashed dashed dashed solid;
|
||||||
|
border-color: transparent transparent transparent #d9d9d9;
|
||||||
|
font-size: 0;
|
||||||
|
line-height: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.border-current{
|
||||||
|
border-color: transparent transparent transparent #e9be2b;
|
||||||
|
}
|
||||||
|
.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
right: -17px;
|
||||||
|
top: -2px;
|
||||||
|
border-left-color: #FFF;
|
||||||
|
border-width: 17px 0 17px 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.steps-bar{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.step{
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 30px;
|
||||||
|
height: 30px;
|
||||||
|
width: 216px;
|
||||||
|
background: #d9d9d9;
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
.step-current{
|
||||||
|
color: white;
|
||||||
|
background: #e9be2b;
|
||||||
|
}
|
||||||
|
.height30{
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.height40{
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
.tip{
|
||||||
|
color: #c2c2c2;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.arrow-foreground,.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
right: -15px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-width: 15px 0 15px 15px;
|
||||||
|
border-style: dashed dashed dashed solid;
|
||||||
|
border-color: transparent transparent transparent #d9d9d9;
|
||||||
|
font-size: 0;
|
||||||
|
line-height: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.border-current{
|
||||||
|
border-color: transparent transparent transparent #e9be2b;
|
||||||
|
}
|
||||||
|
.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
right: -17px;
|
||||||
|
top: -2px;
|
||||||
|
border-left-color: #FFF;
|
||||||
|
border-width: 17px 0 17px 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.steps-bar{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.step{
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 30px;
|
||||||
|
height: 30px;
|
||||||
|
width: 216px;
|
||||||
|
background: #d9d9d9;
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
.step-current{
|
||||||
|
color: white;
|
||||||
|
background: #e9be2b;
|
||||||
|
}
|
||||||
|
.height30{
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.height40{
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
.tip{
|
||||||
|
color: #c2c2c2;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
width: 981px;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
}
|
||||||
|
.border{
|
||||||
|
border-top: 1px solid #d9d9d9;
|
||||||
|
border-bottom: 1px solid #d9d9d9;
|
||||||
|
}
|
||||||
|
.height76{
|
||||||
|
height: 76px;
|
||||||
|
}
|
||||||
|
.height88{
|
||||||
|
height: 88px;
|
||||||
|
}
|
||||||
|
.height60{
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
.con .success-tip{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
button{
|
||||||
|
width: 140px;
|
||||||
|
height: 36px;
|
||||||
|
background: #e9be2b;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.color-red{
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
.alert-icon{
|
||||||
|
display: inline-block;
|
||||||
|
width: 38px;
|
||||||
|
height: 38px;
|
||||||
|
}
|
||||||
|
.alert-icon{
|
||||||
|
background: url('data:image/svg+xml,<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve"> <path fill="#13FF00" d="M8,0.033C3.582,0.033,0,3.6,0,8s3.582,7.967,8,7.967c4.418,0,8-3.567,8-7.967S12.418,0.033,8,0.033z M12.534,5.219L7.779,11.43c-0.091,0.118-0.227,0.193-0.376,0.207c-0.016,0.002-0.032,0.002-0.048,0.002 c-0.132,0-0.26-0.049-0.358-0.139L3.53,8.356C3.312,8.159,3.296,7.821,3.494,7.603c0.197-0.219,0.534-0.235,0.753-0.036l3.037,2.755 l4.403-5.751c0.18-0.233,0.514-0.278,0.748-0.099C12.669,4.65,12.714,4.985,12.534,5.219z"/> </svg>') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.success{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
194
dwt-account/webpack-account/src/scss/reset-password.scss
Normal file
194
dwt-account/webpack-account/src/scss/reset-password.scss
Normal file
@ -0,0 +1,194 @@
|
|||||||
|
@import "common";
|
||||||
|
.container{
|
||||||
|
height: 1000px;
|
||||||
|
background: white;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.right{
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.container .header{
|
||||||
|
height: 95px;
|
||||||
|
background:#d9d9d9 ;
|
||||||
|
font-size: 18px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.container .header span{
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: bottom;
|
||||||
|
margin-left: 22px;
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
width: 981px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.height70{
|
||||||
|
height: 70px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.arrow-foreground,.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
right: -15px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-width: 15px 0 15px 15px;
|
||||||
|
border-style: dashed dashed dashed solid;
|
||||||
|
border-color: transparent transparent transparent #d9d9d9;
|
||||||
|
font-size: 0;
|
||||||
|
line-height: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.border-current{
|
||||||
|
border-color: transparent transparent transparent #e9be2b;
|
||||||
|
}
|
||||||
|
.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
right: -17px;
|
||||||
|
top: -2px;
|
||||||
|
border-left-color: #FFF;
|
||||||
|
border-width: 17px 0 17px 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.steps-bar{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.step{
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 30px;
|
||||||
|
height: 30px;
|
||||||
|
width: 216px;
|
||||||
|
background: #d9d9d9;
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
.step-current{
|
||||||
|
color: white;
|
||||||
|
background: #e9be2b;
|
||||||
|
}
|
||||||
|
.height30{
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.height40{
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
.tip{
|
||||||
|
color: #c2c2c2;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.arrow-foreground,.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
right: -15px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-width: 15px 0 15px 15px;
|
||||||
|
border-style: dashed dashed dashed solid;
|
||||||
|
border-color: transparent transparent transparent #d9d9d9;
|
||||||
|
font-size: 0;
|
||||||
|
line-height: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.border-current{
|
||||||
|
border-color: transparent transparent transparent #e9be2b;
|
||||||
|
}
|
||||||
|
.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
right: -17px;
|
||||||
|
top: -2px;
|
||||||
|
border-left-color: #FFF;
|
||||||
|
border-width: 17px 0 17px 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.steps-bar{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.step{
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 30px;
|
||||||
|
height: 30px;
|
||||||
|
width: 216px;
|
||||||
|
background: #d9d9d9;
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
.step-current{
|
||||||
|
color: white;
|
||||||
|
background: #e9be2b;
|
||||||
|
}
|
||||||
|
.height30{
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.height40{
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
.tip{
|
||||||
|
color: #c2c2c2;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
width: 981px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.border{
|
||||||
|
border-top: 1px solid #d9d9d9;
|
||||||
|
border-bottom: 1px solid #d9d9d9;
|
||||||
|
}
|
||||||
|
.height76{
|
||||||
|
height: 76px;
|
||||||
|
}
|
||||||
|
.height50{
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
.height24{
|
||||||
|
height: 24px;
|
||||||
|
}
|
||||||
|
.con .newPwd,.con .confirmPwd{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
input{
|
||||||
|
width: 211px ;
|
||||||
|
height: 36px;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
input{
|
||||||
|
border: 1px solid #d9d9d9;
|
||||||
|
}
|
||||||
|
input::-webkit-input-placeholder{
|
||||||
|
color: #d9d9d9;
|
||||||
|
}
|
||||||
|
input:-moz-placeholder {
|
||||||
|
color: #d9d9d9;
|
||||||
|
}
|
||||||
|
input::-moz-placeholder{
|
||||||
|
color: #d9d9d9;
|
||||||
|
}
|
||||||
|
input:-ms-input-placeholder{
|
||||||
|
color: #d9d9d9;
|
||||||
|
}
|
||||||
|
button{
|
||||||
|
width: 140px;
|
||||||
|
height: 36px;
|
||||||
|
background: #dcdcdc;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
input:active,input:visited,input{
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
.color-red{
|
||||||
|
color: red;
|
||||||
|
}
|
||||||
|
.able{
|
||||||
|
background: #E9BE2B;
|
||||||
|
}
|
||||||
66
dwt-account/webpack-account/src/scss/update-password.scss
Normal file
66
dwt-account/webpack-account/src/scss/update-password.scss
Normal file
@ -0,0 +1,66 @@
|
|||||||
|
@import "common";
|
||||||
|
.height200{
|
||||||
|
height:200px;
|
||||||
|
}
|
||||||
|
.height20{
|
||||||
|
height:20px;
|
||||||
|
}
|
||||||
|
.height10{
|
||||||
|
height:10px;
|
||||||
|
}
|
||||||
|
.color-green{
|
||||||
|
color:#03b679;
|
||||||
|
}
|
||||||
|
.form-content{
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 45%;
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
.form-content div{
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
.form-content input{
|
||||||
|
padding-left: 10px;
|
||||||
|
display: inline-block;
|
||||||
|
width: 300px;
|
||||||
|
outline: none;
|
||||||
|
border: 1px solid #ccc;
|
||||||
|
border-radius: 6px;
|
||||||
|
height: 32px;
|
||||||
|
}
|
||||||
|
.new-password-confirm {
|
||||||
|
margin-left: -29px;
|
||||||
|
}
|
||||||
|
.submit{
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 20%;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.submit{
|
||||||
|
display: inline-block;
|
||||||
|
width: 100px;
|
||||||
|
height: 34px;
|
||||||
|
outline: none;
|
||||||
|
border: none;
|
||||||
|
border-radius: 6px;
|
||||||
|
background: #ccc;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.active{
|
||||||
|
background: #e9be2b;
|
||||||
|
}
|
||||||
|
|
||||||
|
table{
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
table td{
|
||||||
|
padding: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.color-red{
|
||||||
|
font-size: 12px;
|
||||||
|
color: red;
|
||||||
|
display: inline-block;
|
||||||
|
min-width: 100px;
|
||||||
|
}
|
||||||
208
dwt-account/webpack-account/src/scss/verify-phone.scss
Normal file
208
dwt-account/webpack-account/src/scss/verify-phone.scss
Normal file
@ -0,0 +1,208 @@
|
|||||||
|
@import "common";
|
||||||
|
.center{
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.right{
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.container{
|
||||||
|
height: 1000px;
|
||||||
|
background: white;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
.container .header{
|
||||||
|
width: 100%;
|
||||||
|
height: 95px;
|
||||||
|
background:#d9d9d9 ;
|
||||||
|
font-size: 18px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.container .header span{
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: bottom;
|
||||||
|
margin-left: 22px;
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
width: 981px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.height70{
|
||||||
|
height: 70px;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.arrow-foreground,.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
right: -15px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-width: 15px 0 15px 15px;
|
||||||
|
border-style: dashed dashed dashed solid;
|
||||||
|
border-color: transparent transparent transparent #d9d9d9;
|
||||||
|
font-size: 0;
|
||||||
|
line-height: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.border-current{
|
||||||
|
border-color: transparent transparent transparent #e9be2b;
|
||||||
|
}
|
||||||
|
.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
right: -17px;
|
||||||
|
top: -2px;
|
||||||
|
border-left-color: #FFF;
|
||||||
|
border-width: 17px 0 17px 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.steps-bar{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.step{
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 30px;
|
||||||
|
height: 30px;
|
||||||
|
width: 216px;
|
||||||
|
background: #d9d9d9;
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
.step-current{
|
||||||
|
color: white;
|
||||||
|
background: #e9be2b;
|
||||||
|
}
|
||||||
|
.height30{
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.height40{
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
.tip{
|
||||||
|
color: #c2c2c2;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.arrow-foreground,.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
top:0;
|
||||||
|
right: -15px;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-width: 15px 0 15px 15px;
|
||||||
|
border-style: dashed dashed dashed solid;
|
||||||
|
border-color: transparent transparent transparent #d9d9d9;
|
||||||
|
font-size: 0;
|
||||||
|
line-height: 0;
|
||||||
|
z-index: 1;
|
||||||
|
}
|
||||||
|
.border-current{
|
||||||
|
border-color: transparent transparent transparent #e9be2b;
|
||||||
|
}
|
||||||
|
.arrow-background{
|
||||||
|
position: absolute;
|
||||||
|
right: -17px;
|
||||||
|
top: -2px;
|
||||||
|
border-left-color: #FFF;
|
||||||
|
border-width: 17px 0 17px 17px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.steps-bar{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.step{
|
||||||
|
position: relative;
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 30px;
|
||||||
|
height: 30px;
|
||||||
|
width: 216px;
|
||||||
|
background: #d9d9d9;
|
||||||
|
padding-left: 30px;
|
||||||
|
}
|
||||||
|
.step-current{
|
||||||
|
color: white;
|
||||||
|
background: #e9be2b;
|
||||||
|
}
|
||||||
|
.height30{
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
.height40{
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
.tip{
|
||||||
|
color: #c2c2c2;
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
.content{
|
||||||
|
width: 981px;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
}
|
||||||
|
.border{
|
||||||
|
border-top: 1px solid #d9d9d9;
|
||||||
|
border-bottom: 1px solid #d9d9d9;
|
||||||
|
}
|
||||||
|
.height76{
|
||||||
|
height: 76px;
|
||||||
|
}
|
||||||
|
.height50{
|
||||||
|
height: 50px;
|
||||||
|
}
|
||||||
|
.height24{
|
||||||
|
height: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.phone input{
|
||||||
|
width: 256px ;
|
||||||
|
height: 36px;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
.code input{
|
||||||
|
width: 100px;
|
||||||
|
height: 36px;
|
||||||
|
padding-left: 10px;
|
||||||
|
}
|
||||||
|
.code .getCode{
|
||||||
|
width: 138px;
|
||||||
|
border: 1px solid #e9be2b;
|
||||||
|
background: white;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
input{
|
||||||
|
border: 1px solid #d9d9d9;
|
||||||
|
}
|
||||||
|
input::-webkit-input-placeholder{
|
||||||
|
color: #d9d9d9;
|
||||||
|
}
|
||||||
|
input:-moz-placeholder {
|
||||||
|
color: #d9d9d9;
|
||||||
|
}
|
||||||
|
input::-moz-placeholder{
|
||||||
|
color: #d9d9d9;
|
||||||
|
}
|
||||||
|
input:-ms-input-placeholder{
|
||||||
|
color: #d9d9d9;
|
||||||
|
}
|
||||||
|
button{
|
||||||
|
width: 140px;
|
||||||
|
height: 36px;
|
||||||
|
background: #dcdcdc;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
input:active,input:visited,input{
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
.tips{
|
||||||
|
color: red;
|
||||||
|
font-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.able{
|
||||||
|
background: #E9BE2B;
|
||||||
|
}
|
||||||
@ -0,0 +1,38 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||||
|
<meta http-equiv="Pragma" content="no-cache" />
|
||||||
|
<meta http-equiv="Expires" content="0" />
|
||||||
|
<link rel="icon" type="image/x-icon" href="http://cdn.saas.dianwutong.com/common/img/favicon.ico">
|
||||||
|
<title>修改密码</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body style="opacity: 0;">
|
||||||
|
<div class="container">
|
||||||
|
<div class="header">
|
||||||
|
<div class="content">
|
||||||
|
<img src="http://cdn.saas.dianwutong.com/edp/img/bee.png">
|
||||||
|
<span>找回密码</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="height70"></div>
|
||||||
|
{{content}}
|
||||||
|
<div class="height40"></div>
|
||||||
|
<div class="tip content">
|
||||||
|
<div>没收到短信验证码？</div>
|
||||||
|
<div>1.网络通讯异常可能会造成短信丢失，请重新获取或稍后再试。</div>
|
||||||
|
<div>2.请核实手机是否已欠费停机，或者屏蔽了系统短信。</div>
|
||||||
|
<div>3.如果手机已丢失或停用，请选择其他验证方式。</div>
|
||||||
|
<div>4.您也可以尝试将SIM卡移动到另一部的手机，然后重试。</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
91
dwt-account/webpack-account/src/view/login.html
Normal file
91
dwt-account/webpack-account/src/view/login.html
Normal file
@ -0,0 +1,91 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||||
|
<meta http-equiv="Pragma" content="no-cache" />
|
||||||
|
<meta http-equiv="Expires" content="0" />
|
||||||
|
<link rel="icon" type="image/x-icon" href="http://cdn.saas.dianwutong.com/common/img/favicon.ico">
|
||||||
|
<title>登录</title>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body style="opacity: 0;">
|
||||||
|
|
||||||
|
<div class="header">
|
||||||
|
<div class="container">
|
||||||
|
<img src="http://cdn.saas.dianwutong.com/common/img/logo.png" style="transform: scale(1.3)">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="body">
|
||||||
|
<div class="container">
|
||||||
|
<div class="panel">
|
||||||
|
<span>请使用账号密码登录</span>
|
||||||
|
<div class="height21"></div>
|
||||||
|
<input type="text" id="username" placeholder="用户名">
|
||||||
|
<div class="height37"></div>
|
||||||
|
<input type="password" id="password" placeholder="密码">
|
||||||
|
<div class="height19"></div>
|
||||||
|
<div class="row">
|
||||||
|
<span>
|
||||||
|
<input type="checkbox" value="1" id="remember">
|
||||||
|
<label for="remember">记住密码</label>
|
||||||
|
</span>
|
||||||
|
<span class="forget">
|
||||||
|
<a href="verify-phone.html">忘记密码？</a>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="height33"></div>
|
||||||
|
<button id="login">登录</button>
|
||||||
|
<!-- del start 2019/3/27 kangzhi -->
|
||||||
|
<!-- <div class="height21"></div>
|
||||||
|
<button id="experience" class="experience">客户体验</button>
|
||||||
|
<div class="height21"></div> -->
|
||||||
|
<!-- del end 2019/3/27 kangzhi -->
|
||||||
|
<div class="tips" id="tips"></div>
|
||||||
|
<div class="height21"></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="height60"></div>
|
||||||
|
<div class="footer">
|
||||||
|
<div class="container">
|
||||||
|
<div class="">
|
||||||
|
<a href="//www.dianwutong.com">返回首页</a>
|
||||||
|
<a href="//www.dianwutong.com/about.do">关于我们</a>
|
||||||
|
<a href="//www.dianwutong.com/solution.do">产品服务</a>
|
||||||
|
<a href="//www.dianwutong.com">合作伙伴 中港世能</a>
|
||||||
|
</div>
|
||||||
|
<div class="height21"></div>
|
||||||
|
<div class="">
|
||||||
|
Copyright © 2022-2026
|
||||||
|
北京电务通能源科技（集团）有限公司 京ICP备16028363号
|
||||||
|
</div>
|
||||||
|
<div class="height21"></div>
|
||||||
|
<div class="qr-code-con">
|
||||||
|
<div class="qr-code">
|
||||||
|
<div>电务通app下载</div>
|
||||||
|
<img src="http://cdn.saas.dianwutong.com/common/img/dianwutong_app_download.png">
|
||||||
|
</div>
|
||||||
|
<div class="qr-code">
|
||||||
|
<div>电务通官方微信</div>
|
||||||
|
<!-- edit start 2018/11/22 14:24 kangzhi -->
|
||||||
|
<!-- <img src="http://www.dianwutong.com/images/wechat_icon.png"> -->
|
||||||
|
<img src="http://cdn.saas.dianwutong.com/common/img/wechat_icon.png">
|
||||||
|
<!-- edit end 2018/11/22 14:24 kangzhi -->
|
||||||
|
</div>
|
||||||
|
<div class="qr-code">
|
||||||
|
<div>电务通官方抖音</div>
|
||||||
|
<img src="http://cdn.saas.dianwutong.com/common/img/douyin.jpg">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
52
dwt-account/webpack-account/src/view/reset-complete.html
Normal file
52
dwt-account/webpack-account/src/view/reset-complete.html
Normal file
@ -0,0 +1,52 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head lang="en">
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<meta name="renderer" content="webkit">
|
||||||
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||||
|
<meta http-equiv="Pragma" content="no-cache" />
|
||||||
|
<meta http-equiv="Expires" content="0" />
|
||||||
|
<title>修改密码</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body style="opacity: 0;">
|
||||||
|
<div class="height100"></div>
|
||||||
|
<div class="content">
|
||||||
|
<div class="steps-bar">
|
||||||
|
<div class="step">
|
||||||
|
<div>1.验证手机号</div>
|
||||||
|
<span class="arrow-background "></span>
|
||||||
|
<span class="arrow-foreground "></span>
|
||||||
|
</div>
|
||||||
|
<div class="step">
|
||||||
|
<div>2.找回/重置密码</div>
|
||||||
|
<span class="arrow-background "></span>
|
||||||
|
<span class="arrow-foreground"></span>
|
||||||
|
</div>
|
||||||
|
<div class="step step-current">
|
||||||
|
<div>3.完成</div>
|
||||||
|
<span class="arrow-background "></span>
|
||||||
|
<span class="arrow-foreground border-current"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="height30"></div>
|
||||||
|
<div class="content border">
|
||||||
|
<div class="height76"></div>
|
||||||
|
<div class="con">
|
||||||
|
<div class="success-tip">
|
||||||
|
<span class="success">
|
||||||
|
<span class="alert-icon"></span> 您的密码已经重置，请牢记您的登录密码</span>
|
||||||
|
</div>
|
||||||
|
<div class="height60"></div>
|
||||||
|
<div class="center">
|
||||||
|
<button id="login" class="pointer">立即登录</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="height88"></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
75
dwt-account/webpack-account/src/view/reset-password.html
Normal file
75
dwt-account/webpack-account/src/view/reset-password.html
Normal file
@ -0,0 +1,75 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head lang="en">
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<meta name="renderer" content="webkit">
|
||||||
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||||
|
<meta http-equiv="Pragma" content="no-cache" />
|
||||||
|
<meta http-equiv="Expires" content="0" />
|
||||||
|
<title>重置密码</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body style="opacity: 0;">
|
||||||
|
<div class="height100"></div>
|
||||||
|
<div class="content">
|
||||||
|
<div class="steps-bar">
|
||||||
|
<div class="step">
|
||||||
|
<div>1.验证手机号</div>
|
||||||
|
<span class="arrow-background "></span>
|
||||||
|
<span class="arrow-foreground "></span>
|
||||||
|
</div>
|
||||||
|
<div class="step step-current">
|
||||||
|
<div>2.找回/重置密码</div>
|
||||||
|
<span class="arrow-background "></span>
|
||||||
|
<span class="arrow-foreground border-current"></span>
|
||||||
|
</div>
|
||||||
|
<div class="step">
|
||||||
|
<div>3.完成</div>
|
||||||
|
<span class="arrow-background "></span>
|
||||||
|
<span class="arrow-foreground "></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="height30"></div>
|
||||||
|
<div class="content">
|
||||||
|
<div class="height76"></div>
|
||||||
|
<div class="con">
|
||||||
|
<table style="margin:auto;">
|
||||||
|
<tr>
|
||||||
|
<td class="right">新密码：</td>
|
||||||
|
<td>
|
||||||
|
<input type="password" placeholder="请输入新密码" id="newPassword">
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td>
|
||||||
|
<span class="color-red" id="newPasswordTip"> </span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="right">确认密码：</td>
|
||||||
|
<td>
|
||||||
|
<input type="password" placeholder="请确认新密码" id="confirmPassword">
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td>
|
||||||
|
<span class="color-red" id="confirmPasswordTip"> </span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td>
|
||||||
|
<button id="confirm" class="pointer">确定</button>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
<div class="height50"></div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
77
dwt-account/webpack-account/src/view/update-password.html
Normal file
77
dwt-account/webpack-account/src/view/update-password.html
Normal file
@ -0,0 +1,77 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head lang="en">
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<meta name="renderer" content="webkit">
|
||||||
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||||
|
<meta http-equiv="Pragma" content="no-cache" />
|
||||||
|
<meta http-equiv="Expires" content="0" />
|
||||||
|
<title>修改密码</title>
|
||||||
|
</head>
|
||||||
|
<body style="opacity: 0;">
|
||||||
|
<div class="container">
|
||||||
|
<div class="height200"></div>
|
||||||
|
<div class="form-content">
|
||||||
|
<div class="height20"></div>
|
||||||
|
<div class="tip">
|
||||||
|
<span class="color-green" id="realName"></span> 您好，请输入您的原密码和您的新密码，密码修改完成之后需要重新登录，请保管好您的个人密码。</div>
|
||||||
|
<div class="height20"></div>
|
||||||
|
<table>
|
||||||
|
<tr>
|
||||||
|
<td>账号</td>
|
||||||
|
<td colspan="2">
|
||||||
|
<span id="username"></span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<span>原密码</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<input type="password" id="pwd">
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="color-red" id="pwdTip"></span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<span>新密码</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<input type="password" id="newPwd">
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="color-red" id="newPwdTip"></span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<span>确认新密码</span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<input type="password" id="newPwdConfirm">
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<span class="color-red" id="newPwdConfirmTip"></span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td>
|
||||||
|
<span> </span>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
<button id="submit" class="submit">确定</button>
|
||||||
|
</td>
|
||||||
|
<td>
|
||||||
|
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
84
dwt-account/webpack-account/src/view/verify-phone.html
Normal file
84
dwt-account/webpack-account/src/view/verify-phone.html
Normal file
@ -0,0 +1,84 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
|
||||||
|
<head lang="en">
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="ie=edge">
|
||||||
|
<meta name="renderer" content="webkit">
|
||||||
|
<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate" />
|
||||||
|
<meta http-equiv="Pragma" content="no-cache" />
|
||||||
|
<meta http-equiv="Expires" content="0" />
|
||||||
|
<title>验证手机号</title>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body style="opacity: 0;">
|
||||||
|
<div class="height100"></div>
|
||||||
|
<div class="content">
|
||||||
|
<div class="steps-bar">
|
||||||
|
<div class="step step-current">
|
||||||
|
<div>1.验证手机号</div>
|
||||||
|
<span class="arrow-background "></span>
|
||||||
|
<span class="arrow-foreground border-current"></span>
|
||||||
|
</div>
|
||||||
|
<div class="step">
|
||||||
|
<div>2.找回/重置密码</div>
|
||||||
|
<span class="arrow-background "></span>
|
||||||
|
<span class="arrow-foreground"></span>
|
||||||
|
</div>
|
||||||
|
<div class="step">
|
||||||
|
<div>3.完成</div>
|
||||||
|
<span class="arrow-background "></span>
|
||||||
|
<span class="arrow-foreground"></span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="height30"></div>
|
||||||
|
<div class="content border">
|
||||||
|
<div class="height76"></div>
|
||||||
|
<div class="con">
|
||||||
|
<table style="margin:auto;">
|
||||||
|
<tr>
|
||||||
|
<td>手机号码：</td>
|
||||||
|
<td class="phone">
|
||||||
|
<input type="input" placeholder="请输入手机号码" id="phoneNumber">
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td>
|
||||||
|
<span class="color-red tips" id="phoneTip"></span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td class="right">验证码：</td>
|
||||||
|
<td class="code">
|
||||||
|
<input type="input" placeholder="6位数字" id="codeNumber">
|
||||||
|
<input type="button" id="countDown" class="getCode pointer" value="点击获取验证码">
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td>
|
||||||
|
<span class="color-red tips" id="codeTip"></span>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td> </td>
|
||||||
|
<td>
|
||||||
|
<button id="confirm" class=" pointer">
|
||||||
|
确定
|
||||||
|
</button>
|
||||||
|
</td>
|
||||||
|
</tr>
|
||||||
|
</table>
|
||||||
|
|
||||||
|
<div class="center">
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="height50"></div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
62
dwt-account/webpack-account/webpack.config.js
Normal file
62
dwt-account/webpack-account/webpack.config.js
Normal file
@ -0,0 +1,62 @@
|
|||||||
|
|
||||||
|
let path = require('path')
|
||||||
|
let entry = require('./webpack.entry.js')
|
||||||
|
let htmlPlugins = require('./webpack.html.js')
|
||||||
|
const webpack = require('webpack')
|
||||||
|
let ReleaseHandlePlugin = require('./releaseHandlePlugin')
|
||||||
|
|
||||||
|
// 根据环境选择变量
|
||||||
|
let outputPath = process.env.NODE_ENV === 'production' ? path.resolve('Z:/cdn/edp/js/') : path.resolve('./dist/')
|
||||||
|
let publicPath = process.env.NODE_ENV === 'production' ? '//cdn.saas.dianwutong.com/edp/js' : ''
|
||||||
|
|
||||||
|
let config = {
|
||||||
|
context: __dirname,
|
||||||
|
entry: entry,
|
||||||
|
output: {
|
||||||
|
path: path.resolve('./dist/'),
|
||||||
|
publicPath: '', // 插入到html中的静态文件的路径前缀
|
||||||
|
filename: '[name].[hash].js'
|
||||||
|
},
|
||||||
|
module: {
|
||||||
|
rules: [{
|
||||||
|
test: /\.js$/,
|
||||||
|
exclude: /(node_modules)/,
|
||||||
|
loader: 'babel-loader',
|
||||||
|
query: {
|
||||||
|
presets: ['es2015']
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
test: /\.scss$/,
|
||||||
|
use: [{
|
||||||
|
loader: "style-loader" // 将 JS 字符串生成为 style 节点
|
||||||
|
}, {
|
||||||
|
loader: "css-loader" // 将 CSS 转化成 CommonJS 模块
|
||||||
|
}, {
|
||||||
|
loader: "sass-loader" // 将 Sass 编译成 CSS
|
||||||
|
}]
|
||||||
|
}]
|
||||||
|
},
|
||||||
|
plugins: [
|
||||||
|
new webpack.ProvidePlugin({
|
||||||
|
Promise: 'es6-promise-promise'
|
||||||
|
})
|
||||||
|
].concat(htmlPlugins)
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
if (process.env.NODE_ENV == 'development') {
|
||||||
|
config.devServer = {
|
||||||
|
inline: true,
|
||||||
|
historyApiFallback: true,
|
||||||
|
port: 8020,
|
||||||
|
host: 'account.dianwutong.com'
|
||||||
|
}
|
||||||
|
} else if (process.env.NODE_ENV == 'test') {
|
||||||
|
config.plugins.push(new ReleaseHandlePlugin({ env: 'test' }))
|
||||||
|
} else if (process.env.NODE_ENV == 'production') {
|
||||||
|
config.plugins.push(new webpack.optimize.UglifyJsPlugin())
|
||||||
|
config.plugins.push(new ReleaseHandlePlugin({ env: 'production' }))
|
||||||
|
}
|
||||||
|
|
||||||
|
module.exports = config
|
||||||
23
dwt-account/webpack-account/webpack.entry.js
Normal file
23
dwt-account/webpack-account/webpack.entry.js
Normal file
@ -0,0 +1,23 @@
|
|||||||
|
let fs = require('fs');
|
||||||
|
let path = require('path');
|
||||||
|
|
||||||
|
//------------------------------
|
||||||
|
// 读取src/js下的页面入口目录
|
||||||
|
// 除了common和lib外都是各个页面对应的目录
|
||||||
|
// 构建入口对象 以目录作为key 以 {{目录}}/app.js作为value
|
||||||
|
//------------------------------
|
||||||
|
|
||||||
|
let files = fs.readdirSync('./src/js');
|
||||||
|
|
||||||
|
let entry = {};
|
||||||
|
|
||||||
|
files.forEach((file) =>{
|
||||||
|
|
||||||
|
if(file === 'common' || file ==='utils'){
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
entry[file] = './src/js/'+file+'/app.js';
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
module.exports = entry;
|
||||||
40
dwt-account/webpack-account/webpack.html.js
Normal file
40
dwt-account/webpack-account/webpack.html.js
Normal file
@ -0,0 +1,40 @@
|
|||||||
|
let fs = require('fs');
|
||||||
|
let path = require('path');
|
||||||
|
let HtmlWebpackPlugin = require('html-webpack-plugin');
|
||||||
|
let ExtractTextPlugin = require('extract-text-webpack-plugin');
|
||||||
|
let HtmlWebpackLayoutPlugin = require('html-webpack-layout-plugin');
|
||||||
|
|
||||||
|
//------------------------------
|
||||||
|
// 读取src/js下的页面入口目录
|
||||||
|
// 除了common和lib外都是各个页面对应的目录
|
||||||
|
// 构建HtmlWebpackPlugin对象以创建页面
|
||||||
|
// 其中页面filename为{{目录名称}}.html
|
||||||
|
// 页面模板为src/view/{{目录名称}}.html
|
||||||
|
// 页面的chunks只有一个，就是[{{目录名称}}]
|
||||||
|
//------------------------------
|
||||||
|
|
||||||
|
let files = fs.readdirSync('./src/js');
|
||||||
|
|
||||||
|
let plugins = [];
|
||||||
|
|
||||||
|
files.forEach((file) => {
|
||||||
|
|
||||||
|
if (file === 'common' || file === 'utils') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
let opts = {
|
||||||
|
inject: true,
|
||||||
|
filename: file + '.html',
|
||||||
|
template: ('./src/view/' + file + '.html'),
|
||||||
|
chunksSortMode: 'manual',
|
||||||
|
chunks: [file]
|
||||||
|
}
|
||||||
|
|
||||||
|
plugins.push(new HtmlWebpackPlugin(opts));
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
plugins.push(new HtmlWebpackLayoutPlugin());
|
||||||
|
|
||||||
|
module.exports = plugins;
|
||||||
14
dwt-circuit/webpack-circuit/.babelrc
Normal file
14
dwt-circuit/webpack-circuit/.babelrc
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
{
|
||||||
|
"presets": [
|
||||||
|
["@babel/preset-env", {
|
||||||
|
"modules": false,
|
||||||
|
"targets": {
|
||||||
|
"browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
|
||||||
|
},
|
||||||
|
"useBuiltIns": "usage"
|
||||||
|
}]
|
||||||
|
],
|
||||||
|
"plugins": [
|
||||||
|
"@babel/plugin-transform-runtime"
|
||||||
|
]
|
||||||
|
}
|
||||||
1
dwt-circuit/webpack-circuit/README.md
Normal file
1
dwt-circuit/webpack-circuit/README.md
Normal file
@ -0,0 +1 @@
|
|||||||
|
# webpack4_multipage
|
||||||
10339
dwt-circuit/webpack-circuit/package-lock.json
generated
Normal file
10339
dwt-circuit/webpack-circuit/package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
51
dwt-circuit/webpack-circuit/package.json
Normal file
51
dwt-circuit/webpack-circuit/package.json
Normal file
@ -0,0 +1,51 @@
|
|||||||
|
{
|
||||||
|
"name": "circuit",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"main": "index.js",
|
||||||
|
"scripts": {
|
||||||
|
"build": "cross-env NODE_ENV=production webpack --config webpack.config.js ",
|
||||||
|
"serve": "cross-env NODE_ENV=development webpack-dev-server"
|
||||||
|
},
|
||||||
|
"keywords": [],
|
||||||
|
"author": "",
|
||||||
|
"license": "ISC",
|
||||||
|
"description": "",
|
||||||
|
"devDependencies": {
|
||||||
|
"@babel/core": "^7.5.5",
|
||||||
|
"@babel/plugin-transform-runtime": "^7.6.0",
|
||||||
|
"@babel/preset-env": "^7.5.5",
|
||||||
|
"@babel/runtime": "^7.6.0",
|
||||||
|
"autoprefixer": "^9.6.1",
|
||||||
|
"babel-loader": "^8.0.6",
|
||||||
|
"chalk": "^2.4.2",
|
||||||
|
"clean-webpack-plugin": "^3.0.0",
|
||||||
|
"cross-env": "^7.0.2",
|
||||||
|
"css-loader": "^3.2.0",
|
||||||
|
"file-loader": "^4.2.0",
|
||||||
|
"glob": "^7.1.4",
|
||||||
|
"html-loader": "^0.5.5",
|
||||||
|
"html-webpack-plugin": "^3.2.0",
|
||||||
|
"less": "^3.10.3",
|
||||||
|
"less-loader": "^5.0.0",
|
||||||
|
"mini-css-extract-plugin": "^0.8.0",
|
||||||
|
"node-sass": "^4.12.0",
|
||||||
|
"optimize-css-assets-webpack-plugin": "^5.0.3",
|
||||||
|
"postcss-loader": "^3.0.0",
|
||||||
|
"sass-loader": "^7.3.1",
|
||||||
|
"style-loader": "^1.0.0",
|
||||||
|
"stylus": "^0.54.7",
|
||||||
|
"stylus-loader": "^3.0.2",
|
||||||
|
"url-loader": "^2.1.0",
|
||||||
|
"webpack": "^4.39.2",
|
||||||
|
"webpack-bundle-analyzer": "^3.4.1",
|
||||||
|
"webpack-cli": "^3.3.7",
|
||||||
|
"webpack-dev-server": "^3.8.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"axios": "^0.19.2",
|
||||||
|
"backbone": "^1.4.0",
|
||||||
|
"core-js": "^2.6.11",
|
||||||
|
"jquery": "^3.5.1",
|
||||||
|
"underscore": "^1.10.2"
|
||||||
|
}
|
||||||
|
}
|
||||||
5
dwt-circuit/webpack-circuit/postcss.config.js
Normal file
5
dwt-circuit/webpack-circuit/postcss.config.js
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
module.exports = {
|
||||||
|
plugins: [
|
||||||
|
require('autoprefixer') // 自动补充前缀
|
||||||
|
]
|
||||||
|
}
|
||||||
126
dwt-circuit/webpack-circuit/src/assets/css/common.css
Normal file
126
dwt-circuit/webpack-circuit/src/assets/css/common.css
Normal file
@ -0,0 +1,126 @@
|
|||||||
|
@charset "utf-8";
|
||||||
|
/* CSS Document */
|
||||||
|
html {
|
||||||
|
background:white;
|
||||||
|
color:black;
|
||||||
|
}
|
||||||
|
/* 内外边距通常让各个浏览器样式的表现位置不同 */
|
||||||
|
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
}
|
||||||
|
/* 要注意表单元素并不继承父级 font 的问题 */
|
||||||
|
body,button,input,select,textarea {
|
||||||
|
/* font:12px \5b8b\4f53,arial,sans-serif; */
|
||||||
|
}
|
||||||
|
input,select,textarea {
|
||||||
|
font-size:100%;
|
||||||
|
}
|
||||||
|
/* 去掉 table cell 的边距并让其边重合 */
|
||||||
|
table {
|
||||||
|
border-collapse:collapse;
|
||||||
|
border-spacing:0;
|
||||||
|
}
|
||||||
|
/* ie bug：th 不继承 text-align */
|
||||||
|
th {
|
||||||
|
text-align:inherit;
|
||||||
|
}
|
||||||
|
/* 去除默认边框 */
|
||||||
|
fieldset,img {
|
||||||
|
border:none;
|
||||||
|
}
|
||||||
|
/* ie6 7 8(q) bug 显示为行内表现 */
|
||||||
|
iframe {
|
||||||
|
display:block;
|
||||||
|
}
|
||||||
|
/* 去掉 firefox 下此元素的边框 */
|
||||||
|
abbr,acronym {
|
||||||
|
border:none;
|
||||||
|
font-variant:normal;
|
||||||
|
}
|
||||||
|
/* 一致的 del 样式 */
|
||||||
|
del {
|
||||||
|
text-decoration:line-through;
|
||||||
|
}
|
||||||
|
address,caption,cite,code,dfn,em,th,var {
|
||||||
|
font-style:normal;
|
||||||
|
font-weight:500;
|
||||||
|
}
|
||||||
|
/* 去掉列表前的标识，li 会继承 */
|
||||||
|
ol,ul {
|
||||||
|
list-style:none;
|
||||||
|
}
|
||||||
|
/* 对齐是排版最重要的因素，别让什么都居中 */
|
||||||
|
caption,th {
|
||||||
|
text-align:left;
|
||||||
|
}
|
||||||
|
/* 来自yahoo，让标题都自定义，适应多个系统应用 */
|
||||||
|
h1,h2,h3,h4,h5,h6 {
|
||||||
|
font-size:100%;
|
||||||
|
font-weight:500;
|
||||||
|
}
|
||||||
|
q:before,q:after {
|
||||||
|
content:'';
|
||||||
|
}
|
||||||
|
/* 统一上标和下标 */
|
||||||
|
sub,sup {
|
||||||
|
font-size:75%;
|
||||||
|
line-height:0;
|
||||||
|
position:relative;
|
||||||
|
vertical-align:baseline;
|
||||||
|
}
|
||||||
|
sup {
|
||||||
|
top:-0.5em;
|
||||||
|
}
|
||||||
|
sub {
|
||||||
|
bottom:-0.25em;
|
||||||
|
}
|
||||||
|
/* 让链接在 hover 状态下显示下划线 */
|
||||||
|
a:hover {
|
||||||
|
text-decoration:underline;
|
||||||
|
}
|
||||||
|
/* 默认不显示下划线，保持页面简洁 */
|
||||||
|
ins,a {
|
||||||
|
text-decoration:none;
|
||||||
|
}
|
||||||
|
/* 去除 ie6 & ie7 焦点点状线 */
|
||||||
|
a:focus,*:focus {
|
||||||
|
outline:none;
|
||||||
|
}
|
||||||
|
/* 清除浮动 */
|
||||||
|
.clearfix:before,.clearfix:after {
|
||||||
|
content:"";
|
||||||
|
display:table;
|
||||||
|
}
|
||||||
|
.clearfix:after {
|
||||||
|
clear:both;
|
||||||
|
overflow:hidden;
|
||||||
|
}
|
||||||
|
.clearfix {
|
||||||
|
zoom:1; /* for ie6 & ie7 */
|
||||||
|
}
|
||||||
|
.clear {
|
||||||
|
clear:both;
|
||||||
|
display:block;
|
||||||
|
font-size:0;
|
||||||
|
height:0;
|
||||||
|
line-height:0;
|
||||||
|
overflow:hidden;
|
||||||
|
}
|
||||||
|
/* 设置显示和隐藏，通常用来与 js 配合 */
|
||||||
|
.hide {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
.block {
|
||||||
|
display:block;
|
||||||
|
}
|
||||||
|
/* 设置浮动，减少浮动带来的 bug */
|
||||||
|
.fl,.fr {
|
||||||
|
display:inline;
|
||||||
|
}
|
||||||
|
.fl {
|
||||||
|
float:left;
|
||||||
|
}
|
||||||
|
.fr {
|
||||||
|
float:right;
|
||||||
|
}
|
||||||
24
dwt-circuit/webpack-circuit/src/assets/css/rappid.css
Normal file
24
dwt-circuit/webpack-circuit/src/assets/css/rappid.css
Normal file
File diff suppressed because one or more lines are too long
207
dwt-circuit/webpack-circuit/src/assets/css/style.css
Normal file
207
dwt-circuit/webpack-circuit/src/assets/css/style.css
Normal file
@ -0,0 +1,207 @@
|
|||||||
|
/* @font-face {
|
||||||
|
font-family: 'Roboto Condensed';
|
||||||
|
src: url('../assets/fonts/Roboto_Condensed/RobotoCondensed-Light.ttf');
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Roboto Condensed';
|
||||||
|
src: url('../assets/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf');
|
||||||
|
font-weight: Normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Roboto Condensed';
|
||||||
|
src: url('../assets/fonts/Roboto_Condensed/RobotoCondensed-Bold.ttf');
|
||||||
|
font-weight: Bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Averia Libre';
|
||||||
|
src: url('../assets/fonts/Averia_Libre/AveriaLibre-Light.ttf');
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Averia Libre';
|
||||||
|
src: url('../assets/fonts/Averia_Libre/AveriaLibre-Regular.ttf');
|
||||||
|
font-weight: Normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Averia Libre';
|
||||||
|
src: url('../assets/fonts/Averia_Libre/AveriaLibre-Bold.ttf');
|
||||||
|
font-weight: Bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Alegreya Sans';
|
||||||
|
src: url('../assets/fonts/Alegreya_Sans/AlegreyaSans-Light.ttf');
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Alegreya Sans';
|
||||||
|
src: url('../assets/fonts/Alegreya_Sans/AlegreyaSans-Regular.ttf');
|
||||||
|
font-weight: Normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Alegreya Sans';
|
||||||
|
src: url('../assets/fonts/Alegreya_Sans/AlegreyaSans-Bold.ttf');
|
||||||
|
font-weight: Bold;
|
||||||
|
} */
|
||||||
|
|
||||||
|
html, body, .joint-app {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-moz-user-select: -moz-none;
|
||||||
|
user-select: none;
|
||||||
|
font-family: sans-serif, Arial;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-header {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-body {
|
||||||
|
position: relative;
|
||||||
|
height: -moz-calc(100% - 60px);
|
||||||
|
height: -webkit-calc(100% - 60px);
|
||||||
|
height: calc(100% - 60px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-title {
|
||||||
|
display: inline-block;
|
||||||
|
width: 240px;
|
||||||
|
height: 100%;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-title > h1 {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 60px;
|
||||||
|
text-align: left;
|
||||||
|
text-transform: uppercase;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0 0 0 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Paper */
|
||||||
|
.paper-container {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
box-sizing: border-box;
|
||||||
|
left: 240px;
|
||||||
|
right: 240px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Inspector */
|
||||||
|
.inspector-container {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 120px; /* navigator height */
|
||||||
|
width: 240px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.object-property[data-property$="/fill"],
|
||||||
|
.object-property[data-property$="/stroke"],
|
||||||
|
.field[data-field$="/fill"],
|
||||||
|
.field[data-field$="/stroke"] {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: top;
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-select-box.joint-color-palette .select-box-option:nth-child(2):not(.hover) {
|
||||||
|
border: inset;
|
||||||
|
border-width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-inspector-select-box-options {
|
||||||
|
width: 190px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Navigator */
|
||||||
|
.navigator-container {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 240px;
|
||||||
|
height: 120px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Stencil */
|
||||||
|
.stencil-container {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 240px;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-stencil .joint-element[data-type="standard.Image"] text,
|
||||||
|
.joint-stencil .joint-element[data-type="standard.Cylinder"] text,
|
||||||
|
.joint-stencil .joint-element[data-type="standard.InscribedImage"] text,
|
||||||
|
.joint-stencil .joint-element[data-type="devs.Atomic"] .inPorts text,
|
||||||
|
.joint-stencil .joint-element[data-type="devs.Atomic"] .outPorts text,
|
||||||
|
.joint-stencil .joint-element[data-type="pn.Transition"] text,
|
||||||
|
.joint-stencil .joint-element .joint-port text {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-stencil .joint-element.joint-type-uml rect,
|
||||||
|
.joint-stencil .joint-element.joint-type-uml path {
|
||||||
|
stroke: #4a4d6e;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Toolbar */
|
||||||
|
.toolbar-container {
|
||||||
|
display: inline-block;
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
left: 240px;
|
||||||
|
right: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-container .joint-toolbar {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-container label {
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-container button:not(:empty) {
|
||||||
|
padding: 0 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-container button.joint-widget[data-type="zoomIn"],
|
||||||
|
.toolbar-container button.joint-widget[data-type="zoomOut"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-dialog.joint-lightbox .fg {
|
||||||
|
background-color: #F6F6F6;
|
||||||
|
}
|
||||||
|
/* select-box 高度超过300 显示滚动条 */
|
||||||
|
.joint-select-box-options {
|
||||||
|
max-height: 300px;
|
||||||
|
overflow-y: scroll;
|
||||||
|
}
|
||||||
145
dwt-circuit/webpack-circuit/src/assets/css/style.dark.css
Normal file
145
dwt-circuit/webpack-circuit/src/assets/css/style.dark.css
Normal file
@ -0,0 +1,145 @@
|
|||||||
|
|
||||||
|
/* Dark */
|
||||||
|
.joint-app.joint-theme-dark .app-title {
|
||||||
|
background: #383c3f;
|
||||||
|
box-shadow: inset -2px -1px 0px #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .inspector-container {
|
||||||
|
background: #5e6366;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-paper.joint-theme-dark .port-label {
|
||||||
|
fill: #c6c7e2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-stencil.joint-theme-dark .joint-element.joint-type-uml rect,
|
||||||
|
.joint-stencil.joint-theme-dark .joint-element.joint-type-uml path {
|
||||||
|
stroke: #5e6366;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-select-box.joint-color-palette.joint-theme-dark .select-box-option:nth-child(2):not(.hover) {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* @font-face {
|
||||||
|
font-family: 'toolbar-icons-dark-kitchen-sink';
|
||||||
|
src: url('./../assets/toolbar-icons-dark.woff') format('woff');
|
||||||
|
} */
|
||||||
|
|
||||||
|
/* .joint-widget.joint-theme-dark[data-name="clear"]:after,
|
||||||
|
.joint-widget.joint-theme-dark[data-name="layout"]:after,
|
||||||
|
.joint-widget.joint-theme-dark[data-name="print"]:after {
|
||||||
|
font-family: "toolbar-icons-dark-kitchen-sink";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: normal;
|
||||||
|
display: inline-block;
|
||||||
|
margin: auto;
|
||||||
|
text-align: center;
|
||||||
|
font-variant: normal;
|
||||||
|
text-transform: none;
|
||||||
|
line-height: 1em;
|
||||||
|
font-size: 22px;
|
||||||
|
} */
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-dark[data-name="clear"]:after {
|
||||||
|
/* content: '\e850'; */
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-dark[data-name="layout"]:after {
|
||||||
|
content: '\e853';
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-dark[data-name="print"]:after {
|
||||||
|
content: '\e851';
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1390px) and (min-width: 1280px) {
|
||||||
|
.joint-toolbar.joint-theme-dark div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-dark label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1280px) {
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-dark {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* IE */
|
||||||
|
@media screen and (max-width: 1390px) and (min-width: 0\0
|
||||||
|
) {
|
||||||
|
.joint-toolbar.joint-theme-dark div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-dark label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1350px) and (min-width: 0\0
|
||||||
|
) {
|
||||||
|
.joint-toolbar.joint-theme-dark div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-dark label[data-name="zoom-slider-label"] {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-dark {
|
||||||
|
flex-wrap: wrap; /* IE 11 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="source-arrowhead"],
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="target-arrowhead"],
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="segments"] rect,
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="vertices"] circle {
|
||||||
|
fill: white;
|
||||||
|
stroke: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="source-anchor"] rect,
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="source-anchor"] rect {
|
||||||
|
stroke: white;
|
||||||
|
}
|
||||||
146
dwt-circuit/webpack-circuit/src/assets/css/style.material.css
Normal file
146
dwt-circuit/webpack-circuit/src/assets/css/style.material.css
Normal file
@ -0,0 +1,146 @@
|
|||||||
|
/* Material */
|
||||||
|
.joint-app.joint-theme-material .inspector-container {
|
||||||
|
background: #ecf0f8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-title {
|
||||||
|
box-shadow: inset -1px -1px 1px #434c63;
|
||||||
|
background-color: #545D74;
|
||||||
|
background-image: -ms-linear-gradient(top, #6B748F 0%, #545D74 100%);
|
||||||
|
background-image: -moz-linear-gradient(top, #6B748F 0%, #545D74 100%);
|
||||||
|
background-image: -o-linear-gradient(top, #6B748F 0%, #545D74 100%);
|
||||||
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6B748F), color-stop(100, #545D74));
|
||||||
|
background-image: -webkit-linear-gradient(top, #6B748F 0%, #545D74 100%);
|
||||||
|
background-image: linear-gradient(to bottom, #6B748F 0%, #545D74 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-stencil.joint-theme-material .joint-element.joint-type-uml rect,
|
||||||
|
.joint-stencil.joint-theme-material .joint-element.joint-type-uml path {
|
||||||
|
stroke: #ecf0f8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-inspector.joint-theme-material .select-button-group-button {
|
||||||
|
background: #d0d8e8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-widget[data-type="separator"],
|
||||||
|
.joint-toolbar.joint-theme-material button {
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-toolbar-group + .joint-toolbar-group button.joint-widget.joint-theme-material[data-type="zoomIn"] {
|
||||||
|
border-width: 0 0 0 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-material[data-name="clear"]:after {
|
||||||
|
background-position: -46px -100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-material[data-name="layout"]:after {
|
||||||
|
background-position: -5px -99px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-material[data-name="print"]:after {
|
||||||
|
background-position: -88px -100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-material[data-name="clear"]:after,
|
||||||
|
.joint-widget.joint-theme-material[data-name="layout"]:after,
|
||||||
|
.joint-widget.joint-theme-material[data-name="print"]:after {
|
||||||
|
display: block;
|
||||||
|
width: 33px;
|
||||||
|
height: 33px;
|
||||||
|
content: ' ';
|
||||||
|
background-color: transparent;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
/* background-image: url(./../assets/toolbar-icons-material.png); */
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1460px) and (min-width: 1300px) {
|
||||||
|
.joint-toolbar.joint-theme-material div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-material label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1300px) {
|
||||||
|
.joint-app.joint-theme-material .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-widget[data-type="separator"],
|
||||||
|
.joint-toolbar.joint-theme-material button {
|
||||||
|
height: 45px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* IE */
|
||||||
|
@media screen and (max-width: 1500px) and (min-width: 0\0) {
|
||||||
|
.joint-toolbar.joint-theme-material div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-material label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1420px) and (min-width: 0\0) {
|
||||||
|
.joint-toolbar.joint-theme-material div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-material label[data-name="zoom-slider-label"] {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material {
|
||||||
|
flex-wrap: wrap; /* IE 11 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-widget[data-type="separator"],
|
||||||
|
.joint-toolbar.joint-theme-material button {
|
||||||
|
height: 45px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-toolbar-group {
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
156
dwt-circuit/webpack-circuit/src/assets/css/style.modern.css
Normal file
156
dwt-circuit/webpack-circuit/src/assets/css/style.modern.css
Normal file
@ -0,0 +1,156 @@
|
|||||||
|
|
||||||
|
/* Modern */
|
||||||
|
.joint-theme-picker.joint-theme-modern {
|
||||||
|
border: 1px solid lightgray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-title {
|
||||||
|
background: #30d0c6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .inspector-container {
|
||||||
|
background: #383b61;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="clear"]:after,
|
||||||
|
.joint-widget.joint-theme-modern[data-name="layout"]:after,
|
||||||
|
.joint-widget.joint-theme-modern[data-name="print"]:after {
|
||||||
|
display: block;
|
||||||
|
width: 31px;
|
||||||
|
height: 31px;
|
||||||
|
content: ' ';
|
||||||
|
background-color: transparent;
|
||||||
|
background-position: 0 0;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
/* // background-image: url(./../assets/toolbar-icons-modern.png); */
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="clear"]:after {
|
||||||
|
background-position: 0 -62px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="clear"]:hover:after {
|
||||||
|
background-position: -31px -62px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="layout"]:after {
|
||||||
|
background-position: 0 -124px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="layout"]:hover:after {
|
||||||
|
background-position: -31px -124px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="print"]:after {
|
||||||
|
background-position: 0 -248px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="print"]:hover:after {
|
||||||
|
background-position: -31px -248px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="clear"],
|
||||||
|
.joint-widget.joint-theme-modern[data-name="layout"],
|
||||||
|
.joint-widget.joint-theme-modern[data-name="print"] {
|
||||||
|
position: relative;
|
||||||
|
top: -1px;
|
||||||
|
border: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1230px) and (min-width: 1170px) {
|
||||||
|
.joint-toolbar.joint-theme-modern div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-modern label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1170px) {
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-modern {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* IE */
|
||||||
|
@media screen and (max-width: 1490px) and (min-width: 0\0
|
||||||
|
) {
|
||||||
|
.joint-toolbar.joint-theme-modern div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-modern label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1380px) and (min-width: 0\0
|
||||||
|
) {
|
||||||
|
.joint-toolbar.joint-theme-modern div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-modern label[data-name="zoom-slider-label"] {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-modern {
|
||||||
|
flex-wrap: wrap; /* IE 11 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/* Dialog */
|
||||||
|
|
||||||
|
.joint-dialog.joint-theme-modern .titlebar {
|
||||||
|
text-shadow: none;
|
||||||
|
background-color: #EFEFEF;
|
||||||
|
color: #333;
|
||||||
|
border-bottom: 0;
|
||||||
|
}
|
||||||
|
.joint-dialog.joint-theme-modern .fg {
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
display: table;
|
||||||
|
margin: auto;
|
||||||
|
}
|
||||||
|
.joint-dialog.joint-theme-modern .controls .control-button {
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
.joint-dialog.joint-theme-modern .joint-inspector input {
|
||||||
|
height: 39px;
|
||||||
|
}
|
||||||
@ -0,0 +1,8 @@
|
|||||||
|
/* Toolbar */
|
||||||
|
.joint-theme-picker {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 20px;
|
||||||
|
right: 260px;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 3px 1px !important;
|
||||||
|
}
|
||||||
77
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.css
Normal file
77
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.css
Normal file
File diff suppressed because one or more lines are too long
BIN
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.eot
Normal file
BIN
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.eot
Normal file
Binary file not shown.
1
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.js
Normal file
1
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.js
Normal file
File diff suppressed because one or more lines are too long
71
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.svg
Normal file
71
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.svg
Normal file
@ -0,0 +1,71 @@
|
|||||||
|
<?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" >
|
||||||
|
<!--
|
||||||
|
2013-9-30: Created.
|
||||||
|
-->
|
||||||
|
<svg>
|
||||||
|
<metadata>
|
||||||
|
Created by iconfont
|
||||||
|
</metadata>
|
||||||
|
<defs>
|
||||||
|
|
||||||
|
<font id="iconfont" horiz-adv-x="1024" >
|
||||||
|
<font-face
|
||||||
|
font-family="iconfont"
|
||||||
|
font-weight="500"
|
||||||
|
font-stretch="normal"
|
||||||
|
units-per-em="1024"
|
||||||
|
ascent="896"
|
||||||
|
descent="-128"
|
||||||
|
/>
|
||||||
|
<missing-glyph />
|
||||||
|
|
||||||
|
<glyph glyph-name="yaopin" unicode="" d="M921.268 229.066c-33.774 36.31-79.53 58.41-128.838 62.232l-1.274 0.098-557.142 0.546c-108.564 0-196.888-88.324-196.888-196.89 0-108.564 88.324-196.888 196.888-196.888h0.034l555.834 0.546 2.546 0.1c49.308 3.82 95.064 25.918 128.84 62.228 33.97 36.518 52.678 84.112 52.678 134.014s-18.708 97.494-52.678 134.014zM511.22-34.75l-277.23-0.272c-71.708 0.014-130.048 58.36-130.048 130.072 0 71.722 58.35 130.074 130.038 130.074l277.24-0.272v-259.602zM124.212 354.842c33.542-24.49 74.794-37.978 116.154-37.982h0.008c14.17 0 28.404 1.554 42.304 4.62l1.246 0.274 533.334 161.118c103.896 31.496 162.798 141.646 131.3 245.544-12.502 41.242-37.462 76.444-72.186 101.806-33.552 24.508-74.812 38.004-116.176 38.004a197.046 197.046 0 0 1-57.21-8.52L171.216 697.922l-2.41-0.834c-46.08-17.962-83.456-52.386-105.244-96.932-21.914-44.802-26.008-95.778-11.532-143.534 12.504-41.236 37.464-76.43 72.182-101.78zM722.404 795.772a130.194 130.194 0 0 0 37.792 5.638c56.768 0 107.93-37.988 124.42-92.378 20.806-68.638-18.106-141.408-86.712-162.206l-265.39-80.172-75.316 248.432 265.206 80.686z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="zuzhi" unicode="" d="M996.288 256.256H917.184V421.248c0 13.12-13.248 26.368-26.368 26.368H541.056v105.6h145.216c19.84 0 32.96 13.184 32.96 32.96V803.904c0 19.776-13.12 33.024-32.96 33.024H356.288c-19.776 0-32.96-13.248-32.96-33.024v-217.728c0-19.776 13.184-32.96 32.96-32.96h132.032v-105.536H151.808c-13.184 0-26.368-13.248-26.368-26.368v-171.584H33.088c-19.84-0.064-33.024-13.248-33.024-33.024v-230.912c0-19.776 13.184-33.024 33.024-33.024h230.848c19.904 0 33.024 13.248 33.024 33.024v230.912c0 19.84-13.12 33.024-33.024 33.024h-85.76v151.68h316.736v-145.216H402.56c-19.904 0-33.024-13.184-33.024-33.024v-230.848c0-19.84 13.12-33.024 33.024-33.024h230.848c19.84 0 33.024 13.184 33.024 33.024v230.848c0 19.84-13.184 33.024-33.024 33.024H541.056V401.408h323.328v-145.216h-105.536c-19.776 0-33.024-13.184-33.024-33.024v-230.848c0-19.84 13.248-33.024 33.024-33.024h230.912c19.84 0 33.024 13.184 33.024 33.024v230.848c6.528 13.312-13.248 33.088-26.496 33.088zM382.72 777.472h277.056v-171.52H382.72v171.52zM237.568 12.096H59.456v184.768h178.112v-184.768z m369.472 0H428.928v184.768h178.112v-184.768z m362.88 0h-178.112v184.768h178.112v-184.768z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="bigdata" unicode="" d="M104.448 467.968a412.672 412.672 0 0 0 816.128 0l30.72 5.12a444.416 444.416 0 0 1-878.592 0zM922.624 349.18399999999997a411.648 411.648 0 0 0-265.216-326.656l11.264-29.696a444.416 444.416 0 0 1 285.696 351.232zM200.704 474.112l32.768-6.144a284.672 284.672 0 0 0 143.36 191.488l-14.336 27.648a316.416 316.416 0 0 1-161.792-212.992zM512 41.98400000000004a63.488 63.488 0 0 1-59.392-41.984A412.672 412.672 0 0 0 102.4 347.13599999999997l-30.72-5.12a444.416 444.416 0 0 1 378.88-374.784 63.488 63.488 0 1 1 61.44 74.752z m0-95.232a31.744 31.744 0 1 0 31.744 31.744 31.744 31.744 0 0 0-31.744-31.744zM557.056 664.576a63.488 63.488 0 0 1 14.336 22.528 286.72 286.72 0 0 0 220.16-219.136l32.768 6.144a318.464 318.464 0 0 1-249.856 243.712 63.488 63.488 0 1 1-17.408-54.272z m-76.8 45.056a31.744 31.744 0 1 0 31.744-32.768 31.744 31.744 0 0 0-31.744 31.744zM512 90.11199999999997a318.464 318.464 0 0 1 309.248 249.856l-30.72 7.168a285.696 285.696 0 0 0-559.104 0l-30.72-7.168A318.464 318.464 0 0 1 512 90.11199999999997zM928.768 742.4a40.96 40.96 0 1 1-40.96 40.96 40.96 40.96 0 0 1 40.96-40.96zM96.256 743.424A39.936 39.936 0 1 1 56.32 783.36a39.936 39.936 0 0 1 39.936-39.936zM928.768 70.65599999999995a40.96 40.96 0 1 1 40.96-40.96 40.96 40.96 0 0 1-40.96 40.96zM96.256 71.67999999999995a41.984 41.984 0 1 1 41.984-41.984 41.984 41.984 0 0 1-41.984 41.984zM861.184 422.912h31.744v-31.9488h-31.744zM924.672 422.912h31.744v-31.9488h-31.744zM131.072 422.912h31.744v-31.9488h-31.744zM321.536 406.528A190.464 190.464 0 1 1 512 596.992a190.464 190.464 0 0 1-190.464-190.464zM512 566.2719999999999a155.648 155.648 0 1 0-155.648-156.672A155.648 155.648 0 0 0 512 566.2719999999999zM68.608 422.912h31.744v-31.9488H68.608zM797.696 422.912H829.44v-31.9488h-31.744zM194.56 422.912h31.744v-31.9488H194.56z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="ziyuanku" unicode="" d="M175.37 697.94a32 32 0 1 1 32 32 32 32 0 0 1-32-32z m0 0M133.58 561.68h755.15c31.72 0 63.46 25.39 63.46 63.46V764.75c0 31.73-25.39 63.46-63.46 63.46H133.58c-38.08 0-63.46-31.73-63.46-63.46v-139.61c0-38.07 25.38-63.46 63.46-63.46z m748.8 203.07v-139.61l-748.8-6.35v146zM178 384a31.73 31.73 0 1 1 31.73 31.73A31.73 31.73 0 0 1 178 384z m0 0M124.2 249.69H444c19.19 0 32 12.79 32 32s-12.79 32-32 32l-313.39-6.4-6.4 147.11 761.1 6.39L891.7 320c-19.19 0-32-12.79-32-32s12.79-32 32-32a57.33 57.33 0 0 1 57.56 57.57V460.75a57.32 57.32 0 0 1-57.56 57.56H124.2a57.32 57.32 0 0 1-57.56-57.56v-147.1c0-38.38 25.59-64 57.56-64z m51.17-179.08a32 32 0 1 1 32 32 32 32 0 0 1-32-32z m0 0M330.3 206.32H127.23a56.87 56.87 0 0 1-57.11-57.11v-146c0-31.73 25.38-63.46 57.11-63.46h184c19 0 31.73 12.7 31.73 31.73s-6.35 31.73-25.38 31.73h-184l-6.35 139.61H324c19 0 31.73 12.69 31.73 31.73s-6.34 31.73-25.38 31.73z m533.05-57.11c0 76.15-63.46 139.6-139.61 139.6-38.08 0-76.15-19-107.88-44.42-12.7 6.35-25.38 6.35-38.07 6.35-44.42 0-82.5-31.73-95.19-76.15a114.23 114.23 0 1 1 0-228.45h361.71c57.11 0 107.88 44.42 107.88 107.88 6.34 50.77-38.08 95.19-88.84 95.19z m-12.69-146H489c-25.39 0-50.77 25.38-50.77 50.77s25.38 50.77 50.77 50.77c6.34 0 12.68 0 19-6.35 12.69-6.35 25.39 0 31.73 6.35s12.69 19 6.34 31.73v12.73c0 25.38 38.08 38.07 50.77 19 6.34-6.35 19-12.69 25.39-6.35 12.69 0 19 6.35 25.38 19.05 12.69 25.38 38.07 44.42 69.8 44.42 44.42 0 76.15-31.73 76.15-76.15 0-6.35 0-12.69-6.35-25.39s0-25.38 6.35-31.73 25.38-12.69 31.73-6.34c25.39 12.69 57.11-12.7 57.11-38.08 12.7-25.38-6.35-44.42-31.72-44.42z m0 0" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="yichang" unicode="" d="M512 892.221686C230.274952 892.221686 1.891717 663.838451 1.891717 382.113403c0-281.730168 228.383235-510.113403 510.108283-510.113403 281.730168 0 510.113403 228.383235 510.113403 510.113403 0 281.719928-228.388355 510.108283-510.113403 510.108283z m-43.409658-134.345188c9.358752 10.029428 21.38997 15.046702 36.114132 15.046702 18.051947 0 31.091739-5.360292 39.114258-16.050157 8.693195-12.707014 12.696775-28.429512 12.041457-47.147015l-13.044912-452.384035c-1.99667-16.710594-6.358627-29.084829-13.034673-37.107348-8.022519-8.703434-17.39151-13.044912-28.086494-13.044912-10.024308 0-18.394964 4.013819-25.07613 12.041457-7.362081 9.348512-10.705224 22.070885-10.029428 38.110803l-12.041458 452.389154c-1.346472 20.063976 3.338023 36.114133 14.043248 48.145351zM559.868889 32.670516c-14.713924-14.713924-33.093529-22.081125-55.164415-22.081124-22.741562 0.686035-41.474424 8.380895-56.172989 23.07434-12.712134 15.394839-19.055401 32.433092-19.055401 51.160834 0.655317 21.395089 7.351842 39.447036 20.058856 54.16096 14.038128 14.048367 32.427972 21.057191 55.169534 21.057191 21.400209 0 39.457275-7.008824 54.176319-21.057191 14.033008-15.394839 21.052072-33.441666 21.052071-54.16096-0.670676-20.734652-7.362081-38.121042-20.063975-52.15405z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="daiding" unicode="" d="M323.584 719.8720000000001h30.03733333c24.576 0 46.42133333 21.84533333 46.42133334 46.42133333V856.40533333c0 24.576-21.84533333 46.42133333-46.42133334 46.42133334h-30.03733333c-24.576 0-46.42133333-21.84533333-46.42133333-46.42133334V766.29333333c0-24.576 19.11466667-46.42133333 46.42133333-46.42133333z m663.552-24.576V801.792c0 21.84533333-19.11466667 40.96-40.96 40.96h-109.22666667-27.30666666v-57.344c0-54.61333333-43.69066667-98.304-98.304-98.304h-5.46133334c-54.61333333 0-98.304 43.69066667-98.304 98.304V842.752H430.08v-57.344c0-54.61333333-43.69066667-98.304-98.304-98.304h-5.46133333c-54.61333333 0-98.304 43.69066667-98.304 98.304V842.752h-27.30666667-128.34133333c-21.84533333 0-40.96-19.11466667-40.96-40.96v-892.928c0-21.84533333 19.11466667-40.96 40.96-40.96H948.90666667c21.84533333 0 40.96 19.11466667 40.96 40.96V687.104c0 2.73066667-2.73066667 5.46133333-2.73066667 8.192z m-60.07466667-709.97333333c0-57.344-5.46133333-60.07466667-60.07466666-60.07466667H173.39733333c-57.344 0-81.92 5.46133333-81.92 60.07466667V596.992h835.584v-611.66933333z m-218.45333333 734.54933333h30.03733333c24.576 0 46.42133333 21.84533333 46.42133334 46.42133333V856.40533333c0 27.30666667-21.84533333 46.42133333-46.42133334 46.42133334h-30.03733333c-24.576 0-46.42133333-21.84533333-46.42133333-46.42133334V766.29333333c0-24.576 21.84533333-46.42133333 46.42133333-46.42133333z m-133.80266667-630.784c2.73066667 2.73066667 5.46133333 8.192 8.192 13.65333333 0 5.46133333-2.73066667 10.92266667-5.46133333 13.65333334l-57.344 60.07466666c-8.192 8.192-19.11466667 8.192-27.30666667 0-8.192-8.192-8.192-19.11466667 0-27.30666666l57.344-60.07466667c5.46133333-8.192 16.384-8.192 24.576 0z m-292.18133333 256.68266667c5.46133333 0 10.92266667 2.73066667 13.65333333 5.46133333l111.95733334 122.88c5.46133333 8.192 5.46133333 19.11466667 0 27.30666667-5.46133333 2.73066667-8.192 5.46133333-13.65333334 5.46133333s-10.92266667-2.73066667-13.65333333-5.46133333L266.24 375.808c-8.192-8.192-5.46133333-19.11466667 0-27.30666667 5.46133333-2.73066667 10.92266667-2.73066667 16.384-2.73066666z m155.648-136.53333334h259.41333333v-147.456c0-8.192-2.73066667-16.384-10.92266666-21.84533333-5.46133333-5.46133333-13.65333333-10.92266667-24.576-10.92266667h-90.112c-10.92266667 0-19.11466667-8.192-19.11466667-19.11466666 0-10.92266667 8.192-19.11466667 19.11466667-19.11466667h90.112c10.92266667 0 19.11466667 2.73066667 27.30666666 5.46133333 27.30666667 10.92266667 43.69066667 38.22933333 43.69066667 65.536v147.456h21.84533333c10.92266667 0 19.11466667 8.192 19.11466667 19.11466667 0 10.92266667-8.192 19.11466667-19.11466667 19.11466667h-21.84533333v68.26666666h21.84533333c10.92266667 0 19.11466667 8.192 19.11466667 19.11466667 0 10.92266667-8.192 19.11466667-19.11466667 19.11466667h-141.99466666v76.45866666h136.53333333c10.92266667 0 19.11466667 8.192 19.11466667 19.11466667 0 10.92266667-8.192 19.11466667-19.11466667 19.11466667h-136.53333333V493.22666667c0 10.92266667-8.192 19.11466667-19.11466667 19.11466666-10.92266667 0-19.11466667-8.192-19.11466667-19.11466666v-24.576h-133.80266666c-10.92266667 0-19.11466667-8.192-19.11466667-19.11466667 0-10.92266667 8.192-19.11466667 19.11466667-19.11466667h133.80266666V356.69333333h-139.264c-10.92266667 0-19.11466667-8.192-19.11466666-19.11466666 0-10.92266667 8.192-19.11466667 19.11466666-19.11466667h259.41333334v-68.26666667h-259.41333334c-10.92266667 0-19.11466667-8.192-19.11466666-19.11466666 2.73066667-13.65333333 10.92266667-21.84533333 21.84533333-21.84533334z m-92.84266667 139.264l-76.45866666-87.38133333c-8.192-8.192-5.46133333-19.11466667 0-27.30666667 5.46133333-2.73066667 8.192-5.46133333 13.65333333-5.46133333s10.92266667 2.73066667 13.65333333 5.46133333l43.69066667 49.152v-275.79733333c0-10.92266667 8.192-19.11466667 19.11466667-19.11466667 10.92266667 0 19.11466667 8.192 19.11466666 19.11466667v327.68c2.73066667 19.11466667-19.11466667 27.30666667-32.768 13.65333333z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="yiliaohangyedeICON-" unicode="" d="M936.4 414.6l-44.2-0.4a381.3 381.3 0 0 1-33.8 132.4l38.8 20.9a23.9 23.9 0 1 1-22.6 42.1l-39.1-21a384.3 384.3 0 0 1-104.2 110.6l23.2 37.7a23.9 23.9 0 0 1-40.7 25.1l-23-37.4a378.8 378.8 0 0 1-159.1 43.9l-0.4 44.3a23.9 23.9 0 1 1-47.8-0.4l0.3-44.3a379.3 379.3 0 0 1-155.2-45l-23.3 37.2a23.9 23.9 0 1 1-40.6-25.4l23.5-37.4a385.4 385.4 0 0 1-102.3-109.8l-39.1 20.8a23.7 23.7 0 0 1-32.3-9.8 24 24 0 0 1 9.8-32.4l39-20.8a378.9 378.9 0 0 1-33.8-137.9l-44.3-0.4a23.9 23.9 0 1 1 0.5-47.8l44.2 0.4a379.1 379.1 0 0 1 33.8-132.4l-38.8-20.9a23.9 23.9 0 1 1 22.6-42.1l39 21a384.7 384.7 0 0 1 104.3-110.6l-23.3-37.7a24 24 0 0 1 40.8-25.1l23 37.4a378.8 378.8 0 0 1 159.1-43.9l0.4-44.3a23.9 23.9 0 0 1 47.8 0.4l-0.4 44.3a379.7 379.7 0 0 1 155.3 45l23.3-37.2a23.9 23.9 0 1 1 40.5 25.4l-23.5 37.4a385.8 385.8 0 0 1 102.4 109.8l39-20.8a23.9 23.9 0 1 1 22.5 42.2l-39 20.8a377 377 0 0 1 33.9 137.9l44.2 0.4a23.9 23.9 0 0 1-0.4 47.8zM825 246.5A345.6 345.6 0 0 0 713.5 109a366.5 366.5 0 0 0-40.4-25.5 342.1 342.1 0 0 0-135.2-39.4c-7.9-0.6-15.8-1.3-23.9-1.4s-16 0.5-23.9 1a332.5 332.5 0 0 0-179.2 63.8 347.9 347.9 0 0 0-113.5 138 340.7 340.7 0 0 0-29.2 114.6c-0.7 8-1.4 15.9-1.5 23.9s0.6 16 1 23.9a341.9 341.9 0 0 0 29.4 119.6 362.4 362.4 0 0 0 22.5 42.2 348.4 348.4 0 0 0 89 95.3 352.2 352.2 0 0 0 40.4 25.5 341.6 341.6 0 0 0 135.2 39.4c7.9 0.6 15.8 1.3 23.9 1.4s15.9-0.5 23.9-1a343.2 343.2 0 0 0 321.9-316.4c0.6-8 1.4-15.9 1.4-23.9s-0.5-16-1-23.9A339.6 339.6 0 0 0 825 246.5zM398.7 444.4m-114.8 0a114.8 114.8 0 1 1 229.6 0 114.8 114.8 0 1 1-229.6 0ZM532.6 195.70000000000005m-76.5 0a76.5 76.5 0 1 1 153 0 76.5 76.5 0 1 1-153 0ZM704.7 387m-57.4 0a57.4 57.4 0 1 1 114.8 0 57.4 57.4 0 1 1-114.8 0ZM609.1 559.2m-19.1 0a19.1 19.1 0 1 1 38.2 0 19.1 19.1 0 1 1-38.2 0ZM341.3 176.60000000000002m-19.1 0a19.1 19.1 0 1 1 38.2 0 19.1 19.1 0 1 1-38.2 0Z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="yiliaojigou" unicode="" d="M1024 200.6016c-11.4176-33.6896-64-27.7504-58.2656-81.0496 5.9904-40.6016 40.9088-34.6624 46.592-52.5824 0-11.3664-6.1952-52.5824-23.296-57.9072-17.3056 0-40.8576 5.6832-57.9584 0-11.3152-6.2464-23.3472-11.3664-29.2864-23.3472-11.4176-29.2352 11.3664-52.5312 0-63.9488-17.3056-11.3664-52.6336-28.928-64-17.0496-17.3056 17.3568-17.3056 40.704-52.5312 40.704-46.6944 0-46.592-46.6944-69.9392-46.6944-23.296 0-63.8976 17.6128-63.8976 34.6624 5.888 23.3472 17.3056 40.6528-5.9904 64-29.2352 23.3472-63.9488 0-75.8784 11.3664-17.1008 11.3664-23.04 40.6016-17.1008 57.9584 5.9392 17.408 46.6432 17.408 46.6432 63.9488 0 34.6624-40.96 40.704-46.592 63.8976-6.0416 17.408 6.144 46.6432 23.2448 52.6336 29.184 11.3664 46.592-11.4176 75.8784 11.3664 17.408 17.408 11.4176 58.0096 11.4176 69.9904 5.9392 17.3056 29.5424 23.296 46.592 23.296 34.6624 0 23.3472-40.9088 69.9904-46.592 46.7968 0 40.5504 17.3056 63.8464 46.592 29.5424 0 52.3264-11.264 58.0096-23.296 11.3152-23.296-11.3152-57.9584 23.3472-81.3056 29.2352-17.1008 57.856 6.0416 75.776 0 11.3664-5.9904 17.7152-23.3472 23.3984-46.592z m-221.1328-179.8144v0.3072c134.5024 29.2352 116.5312 244.992-46.6432 215.4496-139.776-34.7136-87.2448-238.5408 46.6432-215.7568z m-190.2592-49.5104a15.7696 15.7696 0 0 0 8.1408-1.4336l1.3824-1.8432a90.3168 90.3168 0 0 0-3.1744-11.8272 236.7488 236.7488 0 0 1-3.6864-12.8512l-1.1264-4.608v-4.9152c0-2.1504 0.1536-4.3008 0.4096-6.4512H35.9424a35.328 35.328 0 0 0-35.328 35.4304v47.2064c0 19.5072 15.7696 35.328 35.328 35.3792h59.0336V800.5632A94.3616 94.3616 0 0 0 189.3376 895.1296h401.2032a94.464 94.464 0 0 0 94.2592-94.5664v-414.208a95.7952 95.7952 0 0 1-17.0496-5.2736c-18.432-7.168-32.9728-21.8624-39.8336-40.448l-2.048-5.632v-6.2976c0-3.072 0.3584-6.3488 0.3584-10.0864a111.104 111.104 0 0 0-1.024-32.768 5.1712 5.1712 0 0 0-2.1504-0.3072 79.7184 79.7184 0 0 0-8.8064 0.9216 143.0528 143.0528 0 0 1-19.968 1.6896c-10.6496 0.0512-21.248-1.8944-31.232-5.632a73.6768 73.6768 0 0 1-39.8336-38.4 82.1248 82.1248 0 0 1-6.1952-60.0576c6.0416-21.3504 22.016-33.536 33.3824-42.496 4.1984-3.0208 7.9872-6.4512 11.4176-10.2912v-0.4096c0-9.1648-1.1264-10.1376-13.1072-17.5616-10.0352-6.0416-25.088-15.4624-31.5392-34.1504-10.6496-30.72-1.1264-77.4656 29.8496-99.6352 9.5744-7.5264 21.504-11.4176 33.7408-11.0592a129.024 129.024 0 0 1 17.9712 1.536c4.608 0.7168 9.216 1.1264 13.824 1.28z m-92.8768 320.4096v36.608a23.6032 23.6032 0 0 1-23.6032 23.6032h-23.552a23.6032 23.6032 0 0 1-23.6544-23.552v-36.6592a23.6032 23.6032 0 0 1 23.6032-23.6032h23.552a23.6032 23.6032 0 0 1 23.6544 23.6032z m-188.8256-165.0688l-0.1536 36.608a23.552 23.552 0 0 1-23.552 23.6032H283.648a23.552 23.552 0 0 1-23.552-23.6032v-36.608c0-13.0048 10.5984-23.552 23.552-23.552H307.2a23.552 23.552 0 0 1 23.7056 23.552z m0 165.0688l-0.1536 36.608a23.552 23.552 0 0 1-23.552 23.6032H283.648a23.552 23.552 0 0 1-23.552-23.552v-36.6592a23.552 23.552 0 0 1 23.552-23.3984H307.2a23.552 23.552 0 0 1 23.7056 23.3984z m93.696 219.5968V593.0496H506.368a35.328 35.328 0 0 1 35.4304 35.4304v1.6384a35.4304 35.4304 0 0 1-35.4304 35.4304H424.5504V747.1104a35.4304 35.4304 0 0 1-35.3792 35.3792h-1.6896c-19.5072 0-35.328-15.872-35.3792-35.3792v-81.5616H270.336a35.4304 35.4304 0 0 1-35.3792-35.4304v-1.6384a35.328 35.328 0 0 1 35.3792-35.4304h81.7664v-81.7664c0-19.5584 15.872-35.3792 35.3792-35.4304h1.6896a35.4304 35.4304 0 0 1 35.3792 35.4304z m71.5264-408.1664c13.0048 0 23.552 10.496 23.6032 23.5008v36.608a23.6032 23.6032 0 0 1-23.6032 23.6032h-23.552a23.6032 23.6032 0 0 1-23.6544-23.6032v-36.608c0.0512-13.0048 10.5984-23.552 23.6032-23.552h23.552z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="dangan" unicode="" d="M866.797037-117.342815H153.524148c-44.828444 0-81.313185 37.05363-81.313185 82.640593V801.298963c0 45.549037 36.484741 82.640593 81.313185 82.640593h713.272889c44.86637 0 81.351111-37.091556 81.351111-82.678519V-34.702222c0-45.586963-36.484741-82.640593-81.351111-82.640593zM147.986963 806.229333a5.006222 5.006222 0 0 1-4.854519-4.93037V-34.702222c0-2.654815 2.275556-4.93037 4.854519-4.930371h731.287704c2.578963 0 4.854519 1.365333 4.854518 4.930371V801.298963c0 2.616889-2.275556 4.93037-4.854518 4.93037H147.986963z m-39.442963-282.472296l0.151704 77.748148 797.696-1.820444-0.18963-77.710222-797.658074 1.782518z m369.967407 137.216h59.733334v-247.580444h-59.733334V660.973037z m-38.229333 33.867852c0 38.153481 30.454519 69.101037 68.001185 69.101037 37.546667 0 67.963259-30.947556 67.96326-69.101037 0-24.651852-12.932741-47.483259-33.98163-59.809185a67.053037 67.053037 0 0 0-68.001185 0 69.290667 69.290667 0 0 0-33.98163 59.809185z m0-276.29037c0 24.651852 12.970667 47.483259 33.98163 59.809185a67.053037 67.053037 0 0 0 68.001185 0c21.048889-12.325926 33.98163-35.157333 33.98163-59.809185 0-38.153481-30.416593-69.101037-67.96326-69.101038s-68.001185 30.947556-68.001185 69.101038z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="renkouku" unicode="" d="M934.8-37.7H91.2v10c0 56.9 11.2 112.1 33.2 164.1 21.3 50.2 51.7 95.3 90.4 134s83.8 69.1 134.1 90.3c52 22 107.2 33.1 164.2 33.1s112.2-11.1 164.2-33.1c50.2-21.2 95.3-51.6 134.1-90.3 38.7-38.7 69.2-83.8 90.4-134 22-52 33.2-107.2 33.2-164.1l-0.2-10z m-823.5 20h803.4c-1.3 50.7-11.8 99.9-31.5 146.3-20.2 47.8-49.2 90.8-86.1 127.7-36.9 36.9-79.9 65.8-127.7 86.1C619.8 363.3 567.2 374 513 374s-106.8-10.6-156.4-31.6c-47.8-20.2-90.8-49.2-127.7-86.1-36.9-36.9-65.9-79.8-86.1-127.7-19.7-46.4-30.3-95.6-31.5-146.3zM312.8 173.8v20h26.8c9.9 0 17.9 8 17.9 17.9s-8 17.9-17.9 17.9H195.9v20h143.7c20.9 0 37.9-17 37.9-37.9s-17-37.9-37.9-37.9h-26.8zM441.3 118H306.6c-20.9 0-37.9 17-37.9 37.9s17 37.9 37.9 37.9h26.8v-20h-26.8c-9.9 0-17.9-8-17.9-17.9s8-17.9 17.9-17.9h134.6v-20zM448.9 62.1H314.3v20h134.6c9.9 0 17.9 8 17.9 17.9s-8 17.9-17.9 17.9h-26.8v20h26.8c20.9 0 37.9-17 37.9-37.9s-16.9-37.9-37.9-37.9zM247.7 6.2h-22.3c-20.9 0-37.9 17-37.9 37.9s17 37.9 37.9 37.9h92.3v-20h-92.3c-9.9 0-17.9-8-17.9-17.9s8-17.9 17.9-17.9h22.3v-20z m329.1 236.6H550c-20.9 0-37.9 17-37.9 37.9s17 37.9 37.9 37.9h200.1v-20h-200c-9.9 0-17.9-8-17.9-17.9s8-17.9 17.9-17.9h26.8l-0.1-20zM620.5 186.9h-22.3v20h22.3c9.9 0 17.9 8 17.9 17.9s-8 17.9-17.9 17.9h-54.9v20h54.9c20.9 0 37.9-17 37.9-37.9s-17-37.9-37.9-37.9zM725.1 131.1H590.5c-20.9 0-37.9 17-37.9 37.9s17 37.9 37.9 37.9h26.8v-20h-26.8c-9.9 0-17.9-8-17.9-17.9s8-17.9 17.9-17.9h134.6v-20zM729.8 75.2h-22.3v20h22.3c9.9 0 17.9 8 17.9 17.9s-8 17.9-17.9 17.9h-92.3v20h92.3c20.9 0 37.9-17 37.9-37.9s-16.9-37.9-37.9-37.9z m-432-108.6l-16.4 11.5c2.1 3 3.2 6.6 3.2 10.2 0 9.9-8 17.9-17.9 17.9h-22.3v20h22.3c20.9 0 37.9-17 37.9-37.9 0-7.8-2.3-15.3-6.8-21.7z m279.1 39.6h-28.6c-20 0-36.2 16.3-36.2 36.2s16.3 36.2 36.2 36.2h28.6c20 0 36.2-16.3 36.2-36.2s-16.2-36.2-36.2-36.2z m-28.5 52.5c-9 0-16.2-7.3-16.2-16.2s7.3-16.2 16.2-16.2H577c9 0 16.2 7.3 16.2 16.2s-7.3 16.2-16.2 16.2h-28.6zM921.4 19.4H698.1c-20.9 0-37.9 17-37.9 37.9s17 37.9 37.9 37.9h22.3v-20h-22.3c-9.9 0-17.9-8-17.9-17.9s8-17.9 17.9-17.9h223.3v-20zM398.8 444.9h-72.4v20h52.4v92c0 25.1-20.5 45.6-45.6 45.6H181.8c-25.1 0-45.6-20.5-45.6-45.6v-92h48v-20h-68v112c0 36.2 29.4 65.6 65.6 65.6h151.4c36.2 0 65.6-29.4 65.6-65.6v-112zM173.5 555h20v-335.9h-20z m144.1 0h20v-215.1h-20z m-72.1-112.4h20v-149.1h-20zM255.5 602.8c-38.3 0-69.5 31.2-69.5 69.5V699c0 38.3 31.2 69.5 69.5 69.5S325 737.3 325 699v-26.7c0-38.3-31.2-69.5-69.5-69.5z m0 145.6c-27.3 0-49.5-22.2-49.5-49.5v-26.7c0-27.3 22.2-49.5 49.5-49.5s49.5 22.2 49.5 49.5v26.7c0 27.3-22.2 49.5-49.5 49.5zM582 538.6h54.2v-20H582z m-190.2 45.2h-20v46.7c0 36.2 29.4 65.6 65.6 65.6h151.4c36.2 0 65.6-29.4 65.6-65.6v-44.8h-20v44.8c0 25.1-20.5 45.6-45.6 45.6H437.4c-25.1 0-45.6-20.5-45.6-45.6v-46.7z m-2.8-45.2h50.8v-20H389zM429.1 628.7h20v-256.9h-20z m144 0h20v-247.6h-20z m-72-112.4h20v-125.9h-20zM511.1 676.4c-38.3 0-69.5 31.2-69.5 69.5v26.7c0 38.3 31.2 69.5 69.5 69.5s69.5-31.2 69.5-69.5v-26.7c0-38.3-31.2-69.5-69.5-69.5z m0 145.7c-27.3 0-49.5-22.2-49.5-49.5v-26.7c0-27.3 22.2-49.5 49.5-49.5s49.5 22.2 49.5 49.5v26.7c0 27.3-22.2 49.5-49.5 49.5zM908.7 444.9h-68v20h48v92c0 25.1-20.5 45.6-45.6 45.6H691.8c-25.1 0-45.6-20.5-45.6-45.6v-92h52.4v-20h-72.4v112c0 36.2 29.4 65.6 65.6 65.6h151.4c36.2 0 65.6-29.4 65.6-65.6v-112zM831.5 555h20v-341.1h-20z m-144.1 0h20v-219.5h-20z m72.1-112.4h20v-154h-20zM769.5 602.8c-38.3 0-69.5 31.2-69.5 69.5V699c0 38.3 31.2 69.5 69.5 69.5S839 737.3 839 699v-26.7c-0.1-38.3-31.2-69.5-69.5-69.5z m0 145.6c-27.3 0-49.5-22.2-49.5-49.5v-26.7c0-27.3 22.2-49.5 49.5-49.5s49.5 22.2 49.5 49.5v26.7c-0.1 27.3-22.3 49.5-49.5 49.5z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="pingbi" unicode="" d="M511.43111111 893.04177778c-281.03111111 0-508.70044445-227.78311111-508.70044444-508.81422223s227.78311111-508.70044445 508.70044444-508.70044444c281.03111111 0 508.70044445 227.78311111 508.70044444 508.70044444 0.11377778 281.03111111-227.66933333 508.81422222-508.70044444 508.81422223zM83.51288889 384.34133333c0 103.99288889 37.09155555 199.22488889 98.75911111 273.408L784.83911111 55.18222221999997c-74.18311111-61.66755555-169.41511111-98.75911111-273.408-98.75911111-236.31644445 0-427.91822222 191.60177778-427.91822222 427.91822222zM841.50044445 112.07111110999995L239.16088889 714.41066667c73.95555555 61.09866667 168.84622222 97.73511111 272.27022222 97.73511111 236.31644445 0 427.91822222-191.60177778 427.91822222-427.91822223 0-103.31022222-36.75022222-198.20088889-97.84888888-272.15644444z m0 0" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="guihualuxian" unicode="" d="M445.882182 299.287273L138.868364 375.109818c-57.367273 14.126545-61.905455 74.263273-7.400728 97.000727l723.269819 301.614546c52.084364 21.76 92.276364-19.805091 69.794909-72.192l-228.770909-533.201455a36.677818 36.677818 0 0 0-29.463273-22.109091 36.398545 36.398545 0 0 0-33.582546 14.894546 37.632 37.632 0 0 0-4.096 36.910545L838.213818 686.545455 224.349091 430.475636l260.189091-64.232727c13.125818-3.258182 23.412364-13.544727 26.810182-26.833454l77.265454-303.848728c3.607273-12.962909 0-26.856727-9.402182-36.375272a36.235636 36.235636 0 0 0-35.863272-9.402182 36.910545 36.910545 0 0 0-25.6 27.229091L445.905455 299.287273z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="dingdanzongliang" unicode="" d="M112.819575-127.999588A55.866771 55.866771 0 0 0 56.788006-72.380016V838.833379A55.866771 55.866771 0 0 0 112.819575 894.452952h159.442774a90.227306 90.227306 0 0 0 14.007893 0.865193 59.203945 59.203945 0 0 0 68.391474-56.484766 48.780425 48.780425 0 0 1 49.027623-50.222413h223.71428a45.690449 45.690449 0 0 1 40.37569 50.222413c0 51.705603 59.739541 55.743171 78.279398 55.743172a37.368113 37.368113 0 0 0 4.119968 0h159.442775a55.866771 55.866771 0 0 0 56.031569-55.619572v-727.21561l-240.60615-239.699757H112.819575zM139.187372 836.073001a23.854617 23.854617 0 0 1-23.895816-23.772218v-858.313001a23.854617 23.854617 0 0 1 23.895816-23.772218h502.22414v208.923594a55.784371 55.784371 0 0 0 55.619572 55.619573h210.118385V812.383183a23.854617 23.854617 0 0 1-23.895817 23.772217h-119.891078a40.33449 40.33449 0 0 1-37.079715-42.559273c0-62.37632-78.691395-63.241514-82.399366-63.241514H374.025567c-18.127861 0-77.455405 4.119968-77.867401 55.660773a47.544435 47.544435 0 0 1-30.075769 50.263613H139.187372z m584.623506-699.611822a23.813417 23.813417 0 0 1-23.895816-23.731018v-178.724226l203.114438 202.455244h-179.218622z m-454.432506 0v58.297552h271.093915v-58.297552H269.378372z m0 185.398575V380.198505H753.062653v-58.338751H269.378372z m0 185.398574V565.55588H753.062653v-58.297552H269.378372z m159.442774 329.18547V894.535351h164.798733v-58.297552h-164.798733z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="aixinxianxie" unicode="" d="M871.08266667 240.75377777999995C806.00177778 163.27111111 733.63911111 92.38755555 658.88711111 25.031111109999983c-39.02577778-35.27111111-78.96177778-69.632-119.92177778-102.4-12.51555555-10.01244445-37.43288889-9.55733333-50.06222222 0-0.91022222 0.68266667-1.70666667 1.36533333-2.73066666 2.048-59.61955555 44.14577778-116.16711111 94.32177778-170.89422223 144.61155556-86.58488889 79.53066667-170.89422222 165.31911111-236.544 264.76088888-32.99555555 49.83466667-60.07466667 105.92711111-70.54222222 165.888-11.94666667 68.38044445-4.66488889 137.89866667 27.98933333 199.45244445 50.63111111 95.11822222 158.72 162.70222222 264.30577778 155.19288889 78.27911111-5.57511111 155.87555555-40.61866667 212.992-97.39377778 2.16177778 1.70666667 4.32355555 3.52711111 6.48533334 5.23377778 49.152 39.48088889 106.15466667 73.27288889 168.04977777 84.53688889 57.68533333 10.58133333 112.41244445 3.41333333 165.77422223-21.61777778 104.90311111-49.152 172.71466667-170.09777778 166.45688888-288.768-5.80266667-115.93955555-78.50666667-211.85422222-149.16266666-295.82222222zM707.69777778 463.53066667H551.02577778V620.08888889h-78.27911111v-156.672H316.07466667V385.13777778h156.672v-156.672h78.27911111V385.13777778H707.69777778v78.39288889z m0 0" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
<glyph glyph-name="handin" unicode="" d="M227.006 644.505c13.83 0 25.124 11.293 25.124 25.124V779.515l-135.01-135.01h109.886z m-150.872-75.5V40.889999999999986c0-13.83 11.293-25.124 25.124-25.124h519.74v-75.5h-519.74c-26.647 0-52.279 10.533-71.185 29.44C11.293-11.38900000000001 0.634 14.241999999999962 0.634 40.889999999999986V634.7339999999999L261.9 896h426.096c26.647 0 52.279-10.532 71.185-29.438 18.907-18.907 29.439-44.412 29.439-71.186v-184.37h-75.5v184.37c0 13.958-11.293 25.125-25.124 25.125H327.629v-150.872c0-26.647-10.532-52.279-29.438-71.185-18.907-18.907-44.412-29.439-71.185-29.439H76.134zM713.247 560.63h75.373v-117.373h-75.5V560.63zM520.375 82.88999999999999l255.048 293.37 247.943-293.37H855.617v-209.621H688.123V82.88999999999999H520.375z m234.746 66.998v-209.621h33.499V149.88800000000003h90.218l-104.176 123.21-107.095-123.21h87.554zM168.256 518.7570000000001h452.742v-75.5H168.256v75.5z m335.37-125.748h117.372v-75.5H503.625v75.5z m-335.37 0H453.25v-75.5H168.256v75.5z m209.622 251.496h243.12v-75.5h-243.12v75.5z" horiz-adv-x="1024" />
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</font>
|
||||||
|
</defs></svg>
|
||||||
|
After Width: | Height: | Size: 27 KiB |
BIN
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.ttf
Normal file
BIN
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.ttf
Normal file
Binary file not shown.
BIN
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.woff
Normal file
BIN
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.woff
Normal file
Binary file not shown.
BIN
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.woff2
Normal file
BIN
dwt-circuit/webpack-circuit/src/assets/fonts/iconfont.woff2
Normal file
Binary file not shown.
BIN
dwt-circuit/webpack-circuit/src/assets/images/Flutter-Logo.png
Normal file
BIN
dwt-circuit/webpack-circuit/src/assets/images/Flutter-Logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
BIN
dwt-circuit/webpack-circuit/src/assets/images/lukuang.png
Normal file
BIN
dwt-circuit/webpack-circuit/src/assets/images/lukuang.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 10 KiB |
2096
dwt-circuit/webpack-circuit/src/assets/js/backbone.js
Normal file
2096
dwt-circuit/webpack-circuit/src/assets/js/backbone.js
Normal file
File diff suppressed because it is too large
Load Diff
2950
dwt-circuit/webpack-circuit/src/assets/js/dagre.core.js
Normal file
2950
dwt-circuit/webpack-circuit/src/assets/js/dagre.core.js
Normal file
File diff suppressed because it is too large
Load Diff
1236
dwt-circuit/webpack-circuit/src/assets/js/graphlib.core.js
Normal file
1236
dwt-circuit/webpack-circuit/src/assets/js/graphlib.core.js
Normal file
File diff suppressed because it is too large
Load Diff
10872
dwt-circuit/webpack-circuit/src/assets/js/jquery.js
vendored
Normal file
10872
dwt-circuit/webpack-circuit/src/assets/js/jquery.js
vendored
Normal file
File diff suppressed because it is too large
Load Diff
17112
dwt-circuit/webpack-circuit/src/assets/js/lodash.js
Normal file
17112
dwt-circuit/webpack-circuit/src/assets/js/lodash.js
Normal file
File diff suppressed because it is too large
Load Diff
30489
dwt-circuit/webpack-circuit/src/assets/js/rappid.js
Normal file
30489
dwt-circuit/webpack-circuit/src/assets/js/rappid.js
Normal file
File diff suppressed because one or more lines are too long
126
dwt-circuit/webpack-circuit/src/common/attr-fn-map.js
Normal file
126
dwt-circuit/webpack-circuit/src/common/attr-fn-map.js
Normal file
@ -0,0 +1,126 @@
|
|||||||
|
let AttrFnMap = {
|
||||||
|
body_stroke: null, // 图形 边框颜色
|
||||||
|
body_fill: null, // 图形 填充色
|
||||||
|
label_text: null, // 图形内的 填充文字
|
||||||
|
label_fill: null, // 图形内的 填充文字颜色
|
||||||
|
textBlock_label_text: null, // 文本框 内容
|
||||||
|
textBlock_label_style_color: null // 文本框 内容颜色
|
||||||
|
}
|
||||||
|
|
||||||
|
function getCell (graph, cellId) {
|
||||||
|
return graph.getCell(cellId)
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* graph: 画布
|
||||||
|
* cellId: 绑定变量的 ele ID
|
||||||
|
* t_color: DI 点的变量值为 1 时绑定的颜色
|
||||||
|
* f_color: DI 点的变量值为 0 时绑定的颜色
|
||||||
|
* val: 获取到的变量的值
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
|
||||||
|
/* 图形相关属性 */
|
||||||
|
// 图形 边框颜色
|
||||||
|
AttrFnMap.body_stroke = function ({ graph, cellId, t_color, f_color, val }) {
|
||||||
|
|
||||||
|
let cell = getCell(graph, cellId)
|
||||||
|
|
||||||
|
if (val == '1') { // val: 1
|
||||||
|
cell.attr('body/stroke', t_color)
|
||||||
|
} else if (val == '0') { // val: 0
|
||||||
|
cell.attr('body/stroke', f_color)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
// 图形 填充色
|
||||||
|
AttrFnMap.fill_color = function ({ graph, cellId, t_color, f_color, val }) {
|
||||||
|
let cell = getCell(graph, cellId)
|
||||||
|
if (val == '1') {
|
||||||
|
cell && cell.attr('body/fill', t_color)
|
||||||
|
cell && cell.attr('body/stroke', t_color)
|
||||||
|
} else if (val == '0') {
|
||||||
|
cell && cell.attr('body/fill', f_color)
|
||||||
|
cell && cell.attr('body/stroke', f_color)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
// 图形内的 填充文字
|
||||||
|
AttrFnMap.label_text = function ({ graph, cellId, val }) {
|
||||||
|
|
||||||
|
let cell = getCell(graph, cellId)
|
||||||
|
cell && cell.attr('label/text', val)
|
||||||
|
|
||||||
|
}
|
||||||
|
// 图形内的 填充文字颜色
|
||||||
|
AttrFnMap.label_fill = function ({ graph, cellId, t_color, f_color, val }) {
|
||||||
|
|
||||||
|
let cell = getCell(graph, cellId)
|
||||||
|
|
||||||
|
if (val == '1') {
|
||||||
|
cell.attr('label/fill', t_color)
|
||||||
|
} else if (val == '0') {
|
||||||
|
cell.attr('label/fill', f_color)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// 可见性
|
||||||
|
AttrFnMap.visible = function ({ graph, cellId, condition, compareValue, val }) {
|
||||||
|
let cell = getCell(graph, cellId)
|
||||||
|
let result
|
||||||
|
|
||||||
|
switch (condition) {
|
||||||
|
case 'a=b':
|
||||||
|
result = compareValue == val
|
||||||
|
break
|
||||||
|
case 'a>b':
|
||||||
|
result = compareValue > val
|
||||||
|
break
|
||||||
|
case 'a<b':
|
||||||
|
result = compareValue < val
|
||||||
|
break
|
||||||
|
}
|
||||||
|
// console.log(result, 'vis')
|
||||||
|
// console.log(cell, 'cell')
|
||||||
|
// result? cell.attr('body/opacity', 1) : cell.attr('body/opacity', 0)
|
||||||
|
result ? cell.attr('body/stroke', 1) : cell.attr('body/stroke', 'transparent')
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 文本框相关属性 */
|
||||||
|
// 文本框 内容
|
||||||
|
// AttrFnMap.textBlock_label_text = function ({graph, cellId, val}) {
|
||||||
|
|
||||||
|
// let cell = getCell(graph, cellId)
|
||||||
|
|
||||||
|
// cell.attr('label/text', val)
|
||||||
|
|
||||||
|
// }
|
||||||
|
// 文本框 内容颜色
|
||||||
|
// AttrFnMap.textBlock_label_style_color = function ({graph, cellId, t_color, f_color, val}) {
|
||||||
|
|
||||||
|
// let cell = getCell(graph, cellId)
|
||||||
|
|
||||||
|
// if (val == '1') {
|
||||||
|
// cell.attr('label/text', t_color)
|
||||||
|
// } else if (val == '0') {
|
||||||
|
// cell.attr('label/text', f_color)
|
||||||
|
// }
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
|
/* 线 相关属性 */
|
||||||
|
// 线 透明度
|
||||||
|
// AttrFnMap.customPath_strokeOpacity = function ({graph, cellId, t_opacity, f_opacity, val}) {
|
||||||
|
|
||||||
|
// let cell = getCell(graph, cellId)
|
||||||
|
|
||||||
|
// if (val == '1') {
|
||||||
|
// cell.attr('path/strokeOpacity', t_opacity)
|
||||||
|
// } else if (val == '0') {
|
||||||
|
// cell.attr('path/strokeOpacity', f_opacity)
|
||||||
|
// }
|
||||||
|
|
||||||
|
// }
|
||||||
|
|
||||||
|
export { AttrFnMap }
|
||||||
9
dwt-circuit/webpack-circuit/src/common/menu.js
Normal file
9
dwt-circuit/webpack-circuit/src/common/menu.js
Normal file
@ -0,0 +1,9 @@
|
|||||||
|
const menu = {
|
||||||
|
border_color: 'border_color',
|
||||||
|
fill_color: 'fill_color',
|
||||||
|
text_val: 'text_val',
|
||||||
|
text_color: 'text_color',
|
||||||
|
visible: 'visible'
|
||||||
|
}
|
||||||
|
|
||||||
|
export { menu }
|
||||||
24
dwt-circuit/webpack-circuit/src/css/rappid.css
Normal file
24
dwt-circuit/webpack-circuit/src/css/rappid.css
Normal file
File diff suppressed because one or more lines are too long
202
dwt-circuit/webpack-circuit/src/css/style.css
Normal file
202
dwt-circuit/webpack-circuit/src/css/style.css
Normal file
@ -0,0 +1,202 @@
|
|||||||
|
@font-face {
|
||||||
|
font-family: 'Roboto Condensed';
|
||||||
|
src: url('../assets/fonts/Roboto_Condensed/RobotoCondensed-Light.ttf');
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Roboto Condensed';
|
||||||
|
src: url('../assets/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf');
|
||||||
|
font-weight: Normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Roboto Condensed';
|
||||||
|
src: url('../assets/fonts/Roboto_Condensed/RobotoCondensed-Bold.ttf');
|
||||||
|
font-weight: Bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Averia Libre';
|
||||||
|
src: url('../assets/fonts/Averia_Libre/AveriaLibre-Light.ttf');
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Averia Libre';
|
||||||
|
src: url('../assets/fonts/Averia_Libre/AveriaLibre-Regular.ttf');
|
||||||
|
font-weight: Normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Averia Libre';
|
||||||
|
src: url('../assets/fonts/Averia_Libre/AveriaLibre-Bold.ttf');
|
||||||
|
font-weight: Bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Alegreya Sans';
|
||||||
|
src: url('../assets/fonts/Alegreya_Sans/AlegreyaSans-Light.ttf');
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Alegreya Sans';
|
||||||
|
src: url('../assets/fonts/Alegreya_Sans/AlegreyaSans-Regular.ttf');
|
||||||
|
font-weight: Normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Alegreya Sans';
|
||||||
|
src: url('../assets/fonts/Alegreya_Sans/AlegreyaSans-Bold.ttf');
|
||||||
|
font-weight: Bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
html, body, .joint-app {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
body {
|
||||||
|
-webkit-user-select: none;
|
||||||
|
-moz-user-select: -moz-none;
|
||||||
|
user-select: none;
|
||||||
|
font-family: sans-serif, Arial;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-header {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-body {
|
||||||
|
position: relative;
|
||||||
|
height: -moz-calc(100% - 60px);
|
||||||
|
height: -webkit-calc(100% - 60px);
|
||||||
|
height: calc(100% - 60px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-title {
|
||||||
|
display: inline-block;
|
||||||
|
width: 240px;
|
||||||
|
height: 100%;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.app-title > h1 {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 18px;
|
||||||
|
line-height: 60px;
|
||||||
|
text-align: left;
|
||||||
|
text-transform: uppercase;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0 0 0 30px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Paper */
|
||||||
|
.paper-container {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
box-sizing: border-box;
|
||||||
|
left: 240px;
|
||||||
|
right: 240px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Inspector */
|
||||||
|
.inspector-container {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0px; /* navigator height */
|
||||||
|
width: 240px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
.object-property[data-property$="/fill"],
|
||||||
|
.object-property[data-property$="/stroke"],
|
||||||
|
.field[data-field$="/fill"],
|
||||||
|
.field[data-field$="/stroke"] {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: top;
|
||||||
|
width: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-select-box.joint-color-palette .select-box-option:nth-child(2):not(.hover) {
|
||||||
|
border: inset;
|
||||||
|
border-width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-inspector-select-box-options {
|
||||||
|
width: 190px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Navigator */
|
||||||
|
.navigator-container {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 240px;
|
||||||
|
height: 120px;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Stencil */
|
||||||
|
.stencil-container {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 240px;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-stencil .joint-element[data-type="standard.Image"] text,
|
||||||
|
.joint-stencil .joint-element[data-type="standard.Cylinder"] text,
|
||||||
|
.joint-stencil .joint-element[data-type="standard.InscribedImage"] text,
|
||||||
|
.joint-stencil .joint-element[data-type="devs.Atomic"] .inPorts text,
|
||||||
|
.joint-stencil .joint-element[data-type="devs.Atomic"] .outPorts text,
|
||||||
|
.joint-stencil .joint-element[data-type="pn.Transition"] text,
|
||||||
|
.joint-stencil .joint-element .joint-port text {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-stencil .joint-element.joint-type-uml rect,
|
||||||
|
.joint-stencil .joint-element.joint-type-uml path {
|
||||||
|
stroke: #4a4d6e;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Toolbar */
|
||||||
|
.toolbar-container {
|
||||||
|
display: inline-block;
|
||||||
|
position: absolute;
|
||||||
|
height: 100%;
|
||||||
|
left: 240px;
|
||||||
|
right: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-container .joint-toolbar {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-container label {
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-container button:not(:empty) {
|
||||||
|
padding: 0 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.toolbar-container button.joint-widget[data-type="zoomIn"],
|
||||||
|
.toolbar-container button.joint-widget[data-type="zoomOut"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-dialog.joint-lightbox .fg {
|
||||||
|
background-color: #F6F6F6;
|
||||||
|
}
|
||||||
145
dwt-circuit/webpack-circuit/src/css/style.dark.css
Normal file
145
dwt-circuit/webpack-circuit/src/css/style.dark.css
Normal file
@ -0,0 +1,145 @@
|
|||||||
|
|
||||||
|
/* Dark */
|
||||||
|
.joint-app.joint-theme-dark .app-title {
|
||||||
|
background: #383c3f;
|
||||||
|
box-shadow: inset -2px -1px 0px #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .inspector-container {
|
||||||
|
background: #5e6366;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-paper.joint-theme-dark .port-label {
|
||||||
|
fill: #c6c7e2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-stencil.joint-theme-dark .joint-element.joint-type-uml rect,
|
||||||
|
.joint-stencil.joint-theme-dark .joint-element.joint-type-uml path {
|
||||||
|
stroke: #5e6366;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-select-box.joint-color-palette.joint-theme-dark .select-box-option:nth-child(2):not(.hover) {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'toolbar-icons-dark-kitchen-sink';
|
||||||
|
src: url('./../assets/toolbar-icons-dark.woff') format('woff');
|
||||||
|
}
|
||||||
|
|
||||||
|
/* .joint-widget.joint-theme-dark[data-name="clear"]:after,
|
||||||
|
.joint-widget.joint-theme-dark[data-name="layout"]:after,
|
||||||
|
.joint-widget.joint-theme-dark[data-name="print"]:after {
|
||||||
|
font-family: "toolbar-icons-dark-kitchen-sink";
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: normal;
|
||||||
|
display: inline-block;
|
||||||
|
margin: auto;
|
||||||
|
text-align: center;
|
||||||
|
font-variant: normal;
|
||||||
|
text-transform: none;
|
||||||
|
line-height: 1em;
|
||||||
|
font-size: 22px;
|
||||||
|
} */
|
||||||
|
|
||||||
|
/* .joint-widget.joint-theme-dark[data-name="clear"]:after {
|
||||||
|
content: '\e850';
|
||||||
|
} */
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-dark[data-name="layout"]:after {
|
||||||
|
content: '\e853';
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-dark[data-name="print"]:after {
|
||||||
|
content: '\e851';
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1390px) and (min-width: 1280px) {
|
||||||
|
.joint-toolbar.joint-theme-dark div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-dark label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1280px) {
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-dark {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* IE */
|
||||||
|
@media screen and (max-width: 1390px) and (min-width: 0\0
|
||||||
|
) {
|
||||||
|
.joint-toolbar.joint-theme-dark div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-dark label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1350px) and (min-width: 0\0
|
||||||
|
) {
|
||||||
|
.joint-toolbar.joint-theme-dark div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-dark label[data-name="zoom-slider-label"] {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-dark {
|
||||||
|
flex-wrap: wrap; /* IE 11 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-dark .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="source-arrowhead"],
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="target-arrowhead"],
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="segments"] rect,
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="vertices"] circle {
|
||||||
|
fill: white;
|
||||||
|
stroke: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="source-anchor"] rect,
|
||||||
|
.joint-tool.joint-theme-dark[data-tool-name="source-anchor"] rect {
|
||||||
|
stroke: white;
|
||||||
|
}
|
||||||
146
dwt-circuit/webpack-circuit/src/css/style.material.css
Normal file
146
dwt-circuit/webpack-circuit/src/css/style.material.css
Normal file
@ -0,0 +1,146 @@
|
|||||||
|
/* Material */
|
||||||
|
.joint-app.joint-theme-material .inspector-container {
|
||||||
|
background: #ecf0f8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-title {
|
||||||
|
box-shadow: inset -1px -1px 1px #434c63;
|
||||||
|
background-color: #545D74;
|
||||||
|
background-image: -ms-linear-gradient(top, #6B748F 0%, #545D74 100%);
|
||||||
|
background-image: -moz-linear-gradient(top, #6B748F 0%, #545D74 100%);
|
||||||
|
background-image: -o-linear-gradient(top, #6B748F 0%, #545D74 100%);
|
||||||
|
background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #6B748F), color-stop(100, #545D74));
|
||||||
|
background-image: -webkit-linear-gradient(top, #6B748F 0%, #545D74 100%);
|
||||||
|
background-image: linear-gradient(to bottom, #6B748F 0%, #545D74 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-stencil.joint-theme-material .joint-element.joint-type-uml rect,
|
||||||
|
.joint-stencil.joint-theme-material .joint-element.joint-type-uml path {
|
||||||
|
stroke: #ecf0f8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-inspector.joint-theme-material .select-button-group-button {
|
||||||
|
background: #d0d8e8;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-widget[data-type="separator"],
|
||||||
|
.joint-toolbar.joint-theme-material button {
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-toolbar-group + .joint-toolbar-group button.joint-widget.joint-theme-material[data-type="zoomIn"] {
|
||||||
|
border-width: 0 0 0 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-material[data-name="clear"]:after {
|
||||||
|
background-position: -46px -100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-material[data-name="layout"]:after {
|
||||||
|
background-position: -5px -99px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-material[data-name="print"]:after {
|
||||||
|
background-position: -88px -100px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-material[data-name="clear"]:after,
|
||||||
|
.joint-widget.joint-theme-material[data-name="layout"]:after,
|
||||||
|
.joint-widget.joint-theme-material[data-name="print"]:after {
|
||||||
|
display: block;
|
||||||
|
width: 33px;
|
||||||
|
height: 33px;
|
||||||
|
content: ' ';
|
||||||
|
background-color: transparent;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-image: url(./../assets/toolbar-icons-material.png);
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1460px) and (min-width: 1300px) {
|
||||||
|
.joint-toolbar.joint-theme-material div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-material label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1300px) {
|
||||||
|
.joint-app.joint-theme-material .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-widget[data-type="separator"],
|
||||||
|
.joint-toolbar.joint-theme-material button {
|
||||||
|
height: 45px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* IE */
|
||||||
|
@media screen and (max-width: 1500px) and (min-width: 0\0) {
|
||||||
|
.joint-toolbar.joint-theme-material div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-material label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1420px) and (min-width: 0\0) {
|
||||||
|
.joint-toolbar.joint-theme-material div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-material label[data-name="zoom-slider-label"] {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-material .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material {
|
||||||
|
flex-wrap: wrap; /* IE 11 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-material .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-widget[data-type="separator"],
|
||||||
|
.joint-toolbar.joint-theme-material button {
|
||||||
|
height: 45px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-material .joint-toolbar-group {
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
136
dwt-circuit/webpack-circuit/src/css/style.modern.css
Normal file
136
dwt-circuit/webpack-circuit/src/css/style.modern.css
Normal file
@ -0,0 +1,136 @@
|
|||||||
|
|
||||||
|
/* Modern */
|
||||||
|
.joint-theme-picker.joint-theme-modern {
|
||||||
|
border: 1px solid lightgray;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-title {
|
||||||
|
background: #30d0c6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .inspector-container {
|
||||||
|
background: #383b61;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="clear"]:after,
|
||||||
|
.joint-widget.joint-theme-modern[data-name="layout"]:after,
|
||||||
|
.joint-widget.joint-theme-modern[data-name="print"]:after {
|
||||||
|
display: block;
|
||||||
|
width: 31px;
|
||||||
|
height: 31px;
|
||||||
|
content: ' ';
|
||||||
|
background-color: transparent;
|
||||||
|
background-position: 0 0;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-image: url(./../assets/toolbar-icons-modern.png);
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="clear"]:after {
|
||||||
|
background-position: 0 -62px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="clear"]:hover:after {
|
||||||
|
background-position: -31px -62px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="layout"]:after {
|
||||||
|
background-position: 0 -124px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="layout"]:hover:after {
|
||||||
|
background-position: -31px -124px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="print"]:after {
|
||||||
|
background-position: 0 -248px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="print"]:hover:after {
|
||||||
|
background-position: -31px -248px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-widget.joint-theme-modern[data-name="clear"],
|
||||||
|
.joint-widget.joint-theme-modern[data-name="layout"],
|
||||||
|
.joint-widget.joint-theme-modern[data-name="print"] {
|
||||||
|
position: relative;
|
||||||
|
top: -1px;
|
||||||
|
border: none;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1230px) and (min-width: 1170px) {
|
||||||
|
.joint-toolbar.joint-theme-modern div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-modern label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1170px) {
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-modern {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* IE */
|
||||||
|
@media screen and (max-width: 1490px) and (min-width: 0\0
|
||||||
|
) {
|
||||||
|
.joint-toolbar.joint-theme-modern div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-modern label[data-name="zoom-slider-label"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (max-width: 1380px) and (min-width: 0\0
|
||||||
|
) {
|
||||||
|
.joint-toolbar.joint-theme-modern div[data-name="zoom-slider"] input,
|
||||||
|
.joint-toolbar.joint-theme-modern label[data-name="zoom-slider-label"] {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomIn"],
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container button[data-type="zoomOut"] {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .toolbar-container {
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-toolbar.joint-theme-modern {
|
||||||
|
flex-wrap: wrap; /* IE 11 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-title h1 {
|
||||||
|
line-height: 92px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.joint-app.joint-theme-modern .app-body {
|
||||||
|
height: -moz-calc(100% - 92px);
|
||||||
|
height: -webkit-calc(100% - 92px);
|
||||||
|
height: calc(100% - 92px);
|
||||||
|
}
|
||||||
|
}
|
||||||
8
dwt-circuit/webpack-circuit/src/css/theme-picker.css
Normal file
8
dwt-circuit/webpack-circuit/src/css/theme-picker.css
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
/* Toolbar */
|
||||||
|
.joint-theme-picker {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 20px;
|
||||||
|
right: 260px;
|
||||||
|
border-radius: 5px;
|
||||||
|
padding: 3px 1px !important;
|
||||||
|
}
|
||||||
159
dwt-circuit/webpack-circuit/src/pages/draw/common/common.js
Normal file
159
dwt-circuit/webpack-circuit/src/pages/draw/common/common.js
Normal file
@ -0,0 +1,159 @@
|
|||||||
|
import { model } from '../service/service'
|
||||||
|
import { resolve } from 'core-js/fn/promise'
|
||||||
|
|
||||||
|
// 保存订阅的函数
|
||||||
|
let subArr = []
|
||||||
|
|
||||||
|
let store
|
||||||
|
|
||||||
|
function getStore () {
|
||||||
|
store = window.Store
|
||||||
|
}
|
||||||
|
|
||||||
|
subscribe(getStore)
|
||||||
|
|
||||||
|
// 订阅
|
||||||
|
function subscribe (fn) {
|
||||||
|
subArr.push(fn)
|
||||||
|
}
|
||||||
|
|
||||||
|
// 发布
|
||||||
|
function publish () {
|
||||||
|
subArr.forEach(fn => {
|
||||||
|
fn()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 保存画布
|
||||||
|
function saveDiagram (callback) {
|
||||||
|
// console.log(store.varJson, 'store.varJson111')
|
||||||
|
if (!checkPaperAttr()) return
|
||||||
|
if (!store.varJson) store.varJson = {}
|
||||||
|
let data = {
|
||||||
|
prId: store.paperAttr.prId,
|
||||||
|
prName: store.paperAttr.prName,
|
||||||
|
circuitName: store.paperAttr.circuitName,
|
||||||
|
paperJson: JSON.stringify(store.paperAttr),
|
||||||
|
varJson: JSON.stringify(store.varJson),
|
||||||
|
graphJson: JSON.stringify(store.graph.toJSON())
|
||||||
|
}
|
||||||
|
// 判断当前是否是新建的画布
|
||||||
|
if (store.currentCirId != null) { // 编辑保存
|
||||||
|
data.circuitId = store.currentCirId
|
||||||
|
|
||||||
|
model.editCircuit(data).then(res => {
|
||||||
|
if (res.code && res.code == 200) {
|
||||||
|
// 将画布的缩放重置成100%
|
||||||
|
store.paperScroller.zoom(1 - store.paperScroller.zoom())
|
||||||
|
|
||||||
|
// 更新画布对应的属性
|
||||||
|
store.paper.drawBackground({
|
||||||
|
color: store.paperAttr.color
|
||||||
|
})
|
||||||
|
store.paper.setDimensions(store.paperAttr.width, store.paperAttr.height)
|
||||||
|
|
||||||
|
$('.edit-diagram-dialog #edit-diagram-prName') && $('.edit-diagram-dialog #edit-diagram-prName').text(store.paperAttr.prName);
|
||||||
|
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'success',
|
||||||
|
closeAnimation: { delay: 2000 },
|
||||||
|
width: 100,
|
||||||
|
modal: true,
|
||||||
|
title: '提示',
|
||||||
|
content: '保存成功'
|
||||||
|
})).open()
|
||||||
|
|
||||||
|
if (typeof callback == 'function') callback()
|
||||||
|
publish()
|
||||||
|
} else {
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'alert',
|
||||||
|
closeAnimation: { delay: 2000 },
|
||||||
|
width: 100,
|
||||||
|
modal: true,
|
||||||
|
title: '提示',
|
||||||
|
content: '保存失败'
|
||||||
|
})).open()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
} else { // 新建保存
|
||||||
|
model.addCircuit(data).then(res => {
|
||||||
|
if (res.code && res.code == 200) {
|
||||||
|
// 更新画布对应的属性
|
||||||
|
store.paper.drawBackground({
|
||||||
|
color: store.paperAttr.color
|
||||||
|
})
|
||||||
|
store.paper.setDimensions(store.paperAttr.width, store.paperAttr.height)
|
||||||
|
|
||||||
|
store.currentCirId = res.body;
|
||||||
|
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'success',
|
||||||
|
closeAnimation: { delay: 2000 },
|
||||||
|
width: 100,
|
||||||
|
modal: true,
|
||||||
|
title: '提示',
|
||||||
|
content: '保存成功'
|
||||||
|
})).open()
|
||||||
|
window.location.hash = res.body
|
||||||
|
if (typeof callback == 'function') callback()
|
||||||
|
|
||||||
|
publish()
|
||||||
|
} else {
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'alert',
|
||||||
|
closeAnimation: { delay: 2000 },
|
||||||
|
width: 100,
|
||||||
|
modal: true,
|
||||||
|
title: '提示',
|
||||||
|
content: '保存失败'
|
||||||
|
})).open()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 检查画布信息完整性
|
||||||
|
function checkPaperAttr () {
|
||||||
|
// 检查是否填写完整
|
||||||
|
for (let key in store.paperAttr) {
|
||||||
|
if (store.paperAttr.hasOwnProperty(key)) {
|
||||||
|
if (!store.paperAttr[key]) {
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'alert',
|
||||||
|
closeAnimation: { delay: 2000 },
|
||||||
|
width: 100,
|
||||||
|
modal: true,
|
||||||
|
title: '警告',
|
||||||
|
content: '请将画布信息填写完整！'
|
||||||
|
})).open()
|
||||||
|
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
|
||||||
|
// 根据画布id渲染画布
|
||||||
|
function renderParperById (query) {
|
||||||
|
return new Promise((resolve, reject) => {
|
||||||
|
model.getCircuitDetail(query).then(res => {
|
||||||
|
if (res.code && res.code == 200) {
|
||||||
|
store.paperAttr = JSON.parse(res.body.paperJson)
|
||||||
|
store.graph.fromJSON(JSON.parse(res.body.graphJson))
|
||||||
|
store.varJson = JSON.parse(res.body.varJson)
|
||||||
|
// 更新画布对应的属性
|
||||||
|
store.paper.drawBackground({
|
||||||
|
color: store.paperAttr.color
|
||||||
|
})
|
||||||
|
store.paper.setDimensions(store.paperAttr.width, store.paperAttr.height)
|
||||||
|
resolve()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export { subscribe, publish, saveDiagram, checkPaperAttr, renderParperById }
|
||||||
34
dwt-circuit/webpack-circuit/src/pages/draw/common/store.js
Normal file
34
dwt-circuit/webpack-circuit/src/pages/draw/common/store.js
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
let store = {}
|
||||||
|
|
||||||
|
store.paperAttr = {
|
||||||
|
circuitName: '',
|
||||||
|
prId: null,
|
||||||
|
prName: '',
|
||||||
|
width: 1920,
|
||||||
|
height: 1080,
|
||||||
|
color: '#60a3a4'
|
||||||
|
}
|
||||||
|
|
||||||
|
store.currentCirId = null
|
||||||
|
|
||||||
|
store.prInf = {
|
||||||
|
prName: '',
|
||||||
|
prId: null
|
||||||
|
}
|
||||||
|
|
||||||
|
store.cirInf = {
|
||||||
|
circuitId: null,
|
||||||
|
circuitName: ''
|
||||||
|
}
|
||||||
|
store.currentVarJson = {}; // 本次编辑元素生成的变量json
|
||||||
|
store.varJson = null;
|
||||||
|
|
||||||
|
store.graph = null
|
||||||
|
|
||||||
|
store.paper = null
|
||||||
|
|
||||||
|
store.paperScroller = null
|
||||||
|
|
||||||
|
store.commandManager = null
|
||||||
|
|
||||||
|
window.Store = store
|
||||||
94
dwt-circuit/webpack-circuit/src/pages/draw/config/halo.js
Normal file
94
dwt-circuit/webpack-circuit/src/pages/draw/config/halo.js
Normal file
@ -0,0 +1,94 @@
|
|||||||
|
// 画布中，选中单个元素时，元素上面出现的“删除”、“旋转”、“复制”、“拖拽”等功能
|
||||||
|
var halo = {};
|
||||||
|
|
||||||
|
(function() {
|
||||||
|
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
halo = {
|
||||||
|
|
||||||
|
handles: [
|
||||||
|
{
|
||||||
|
name: 'remove',
|
||||||
|
position: 'nw',
|
||||||
|
events: { pointerdown: 'removeElement' },
|
||||||
|
attrs: {
|
||||||
|
'.handle': {
|
||||||
|
'data-tooltip-class-name': 'small',
|
||||||
|
'data-tooltip': '删除',
|
||||||
|
'data-tooltip-position': 'right',
|
||||||
|
'data-tooltip-padding': 15
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// name: 'fork',
|
||||||
|
// position: 'ne',
|
||||||
|
// events: { pointerdown: 'startForking', pointermove: 'doFork', pointerup: 'stopForking' },
|
||||||
|
// attrs: {
|
||||||
|
// '.handle': {
|
||||||
|
// 'data-tooltip-class-name': 'small',
|
||||||
|
// 'data-tooltip': 'Click and drag to clone and connect the object in one go',
|
||||||
|
// 'data-tooltip-position': 'left',
|
||||||
|
// 'data-tooltip-padding': 15
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
name: 'clone',
|
||||||
|
position: 'se',
|
||||||
|
events: { pointerdown: 'startCloning', pointermove: 'doClone', pointerup: 'stopCloning' },
|
||||||
|
attrs: {
|
||||||
|
'.handle': {
|
||||||
|
'data-tooltip-class-name': 'small',
|
||||||
|
'data-tooltip': '复制',
|
||||||
|
'data-tooltip-position': 'left',
|
||||||
|
'data-tooltip-padding': 15
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// name: 'unlink',
|
||||||
|
// position: 'w',
|
||||||
|
// events: { pointerdown: 'unlinkElement' },
|
||||||
|
// attrs: {
|
||||||
|
// '.handle': {
|
||||||
|
// 'data-tooltip-class-name': 'small',
|
||||||
|
// 'data-tooltip': 'Click to break all connections to other objects',
|
||||||
|
// 'data-tooltip-position': 'right',
|
||||||
|
// 'data-tooltip-padding': 15
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// name: 'link',
|
||||||
|
// position: 'e',
|
||||||
|
// events: { pointerdown: 'startLinking', pointermove: 'doLink', pointerup: 'stopLinking' },
|
||||||
|
// attrs: {
|
||||||
|
// '.handle': {
|
||||||
|
// 'data-tooltip-class-name': 'small',
|
||||||
|
// 'data-tooltip': 'Click and drag to connect the object',
|
||||||
|
// 'data-tooltip-position': 'left',
|
||||||
|
// 'data-tooltip-padding': 15
|
||||||
|
// }
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
{
|
||||||
|
name: 'rotate',
|
||||||
|
position: 'sw',
|
||||||
|
events: { pointerdown: 'startRotating', pointermove: 'doRotate', pointerup: 'stopBatch' },
|
||||||
|
attrs: {
|
||||||
|
'.handle': {
|
||||||
|
'data-tooltip-class-name': 'small',
|
||||||
|
'data-tooltip': '旋转',
|
||||||
|
'data-tooltip-position': 'right',
|
||||||
|
'data-tooltip-padding': 15
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
};
|
||||||
|
|
||||||
|
})();
|
||||||
|
|
||||||
|
export { halo };
|
||||||
925
dwt-circuit/webpack-circuit/src/pages/draw/config/inspector.js
Normal file
925
dwt-circuit/webpack-circuit/src/pages/draw/config/inspector.js
Normal file
@ -0,0 +1,925 @@
|
|||||||
|
// 对选中的元素进行修改时，右侧的编辑面板中的内容配置项
|
||||||
|
require('../../../assets/js/jquery.js')
|
||||||
|
require('../../../assets/js/lodash.js')
|
||||||
|
require('../../../assets/js/backbone.js')
|
||||||
|
require('../../../assets/js/graphlib.core.js')
|
||||||
|
require('../../../assets/js/dagre.core.js')
|
||||||
|
require('../../../assets/js/rappid.js')
|
||||||
|
import '../template/tag-dialog/index.css'
|
||||||
|
import { createTagDialog } from '../template/tag-dialog/index.js'
|
||||||
|
var inspector;
|
||||||
|
|
||||||
|
|
||||||
|
(function () {
|
||||||
|
// 'use strict'
|
||||||
|
// 动态选项 变量数值显示
|
||||||
|
var tagEditorOptions = {
|
||||||
|
// 给元素绑定变量相关的属性
|
||||||
|
tagValue: {
|
||||||
|
type: 'object',
|
||||||
|
group: 'tag',
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
// 不显示最外层的label
|
||||||
|
label: {
|
||||||
|
style: 'display:none;'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
properties: {
|
||||||
|
// 是否进行“变量数值显示”操作
|
||||||
|
isShowTagValue: {
|
||||||
|
type: 'toggle',
|
||||||
|
label: '是否开启',
|
||||||
|
group: 'tag',
|
||||||
|
//defaultValue: false,
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'isShowTagValue',
|
||||||
|
defaultValue: false
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
// 关联显示值的变量
|
||||||
|
showTagValue: {
|
||||||
|
type: 'text',
|
||||||
|
group: 'tag',
|
||||||
|
name: 'tagName',
|
||||||
|
index: 2,
|
||||||
|
label: '关联变量',
|
||||||
|
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'tagName',
|
||||||
|
readOnly: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
when: { eq: { 'tagOptions/tagValue/isShowTagValue': true } },
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
// 给元素绑定 动态文本色的属性
|
||||||
|
dynamicTextColor: {
|
||||||
|
type: 'object',
|
||||||
|
group: 'dynamicTextColor',
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
// 不显示最外层的label
|
||||||
|
label: {
|
||||||
|
style: 'display:none;'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
properties: {
|
||||||
|
// 是否进行“变量数值显示”操作
|
||||||
|
isDynamicTextColor: {
|
||||||
|
type: 'toggle',
|
||||||
|
name: 'isDynamicTextColor',
|
||||||
|
label: '是否开启',
|
||||||
|
group: 'dynamicTextColor',
|
||||||
|
//defaultValue: false,
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'isDynamicTextColor',
|
||||||
|
defaultValue: false
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
// 选择对应变量
|
||||||
|
textColorTag: {
|
||||||
|
type: 'text',
|
||||||
|
name: 'textColorTag',
|
||||||
|
label: '对应变量',
|
||||||
|
group: 'dynamicTextColor',
|
||||||
|
defaultValue: '',
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'textColorTag',
|
||||||
|
readOnly: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
when: { eq: { 'tagOptions/dynamicTextColor/isDynamicTextColor': true } },
|
||||||
|
|
||||||
|
},
|
||||||
|
textColorOptions: {
|
||||||
|
type: 'list',
|
||||||
|
label: '添加配置',
|
||||||
|
item: {
|
||||||
|
type: 'object',
|
||||||
|
properties: {
|
||||||
|
label: {
|
||||||
|
name: 'colorValue',
|
||||||
|
type: 'number',
|
||||||
|
label: '变量数值',
|
||||||
|
defaultValue: '{{index}}'
|
||||||
|
},
|
||||||
|
textColor: {
|
||||||
|
type: 'color',
|
||||||
|
label: '对应颜色'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
when: { ne: { 'tagOptions/dynamicTextColor/textColorTag': undefined }, eq: { 'tagOptions/dynamicTextColor/isDynamicTextColor': true } },
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
// 给元素绑定 动态边框色的属性
|
||||||
|
dynamicStrokeColor: {
|
||||||
|
type: 'object',
|
||||||
|
group: 'dynamicStrokeColor',
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
// 不显示最外层的label
|
||||||
|
label: {
|
||||||
|
style: 'display:none;'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
properties: {
|
||||||
|
// 是否进行“变量数值显示”操作
|
||||||
|
isDynamicStrokeColor: {
|
||||||
|
type: 'toggle',
|
||||||
|
name: 'isDynamicStrokeColor',
|
||||||
|
label: '是否开启',
|
||||||
|
group: 'dynamicStrokeColor',
|
||||||
|
//defaultValue: false,
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'isDynamicStrokeColor',
|
||||||
|
defaultValue: false
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
// 选择对应变量
|
||||||
|
strokeColorTag: {
|
||||||
|
type: 'text',
|
||||||
|
name: 'strokeColorTag',
|
||||||
|
label: '对应变量',
|
||||||
|
group: 'dynamicStrokeColor',
|
||||||
|
defaultValue: '',
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'strokeColorTag',
|
||||||
|
readOnly: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
when: { eq: { 'tagOptions/dynamicStrokeColor/isDynamicStrokeColor': true } },
|
||||||
|
|
||||||
|
},
|
||||||
|
textColorOptions: {
|
||||||
|
type: 'list',
|
||||||
|
label: '添加配置',
|
||||||
|
item: {
|
||||||
|
type: 'object',
|
||||||
|
properties: {
|
||||||
|
label: {
|
||||||
|
type: 'number',
|
||||||
|
label: '变量数值',
|
||||||
|
name: 'colorValue',
|
||||||
|
defaultValue: '{{index}}'
|
||||||
|
},
|
||||||
|
textColor: {
|
||||||
|
type: 'color',
|
||||||
|
label: '对应颜色'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
when: { ne: { 'tagOptions/dynamicStrokeColor/strokeColorTag': undefined }, eq: { 'tagOptions/dynamicStrokeColor/isDynamicStrokeColor': true } },
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
// 给元素绑定 动态背景色的属性
|
||||||
|
dynamicBackgroundColor: {
|
||||||
|
type: 'object',
|
||||||
|
group: 'dynamicBackgroundColor',
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
// 不显示最外层的label
|
||||||
|
label: {
|
||||||
|
style: 'display:none;'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
properties: {
|
||||||
|
// 是否进行“变量数值显示”操作
|
||||||
|
isDynamicBackgroundColor: {
|
||||||
|
type: 'toggle',
|
||||||
|
name: 'isDynamicBackgroundColor',
|
||||||
|
label: '是否开启',
|
||||||
|
group: 'dynamicBackgroundColor',
|
||||||
|
//defaultValue: false,
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'isDynamicBackgroundColor',
|
||||||
|
defaultValue: false
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
// 选择对应变量
|
||||||
|
backgroundColorTag: {
|
||||||
|
type: 'text',
|
||||||
|
name: 'backgroundColorTag',
|
||||||
|
label: '对应变量',
|
||||||
|
group: 'dynamicBackgroundColor',
|
||||||
|
defaultValue: '',
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'backgroundColorTag',
|
||||||
|
readOnly: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
when: { eq: { 'tagOptions/dynamicBackgroundColor/isDynamicBackgroundColor': true } },
|
||||||
|
|
||||||
|
},
|
||||||
|
textColorOptions: {
|
||||||
|
type: 'list',
|
||||||
|
label: '添加配置',
|
||||||
|
item: {
|
||||||
|
type: 'object',
|
||||||
|
properties: {
|
||||||
|
label: {
|
||||||
|
name: 'colorValue',
|
||||||
|
defaultValue: '{{index}}',
|
||||||
|
type: 'number',
|
||||||
|
label: '变量数值',
|
||||||
|
},
|
||||||
|
textColor: {
|
||||||
|
type: 'color',
|
||||||
|
label: '对应颜色'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
when: { ne: { 'tagOptions/dynamicBackgroundColor/backgroundColorTag': undefined }, eq: { 'tagOptions/dynamicBackgroundColor/isDynamicBackgroundColor': true } },
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// 给元素绑定 动态可见性的属性
|
||||||
|
dynamicVisibility: {
|
||||||
|
type: 'object',
|
||||||
|
group: 'dynamicVisibility',
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
// 不显示最外层的label
|
||||||
|
label: {
|
||||||
|
style: 'display:none;'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
properties: {
|
||||||
|
// 是否进行“变量数值显示”操作
|
||||||
|
isDynamicVisibility: {
|
||||||
|
type: 'toggle',
|
||||||
|
name: 'isDynamicVisibility',
|
||||||
|
label: '是否开启',
|
||||||
|
group: 'dynamicVisibility',
|
||||||
|
//defaultValue: false,
|
||||||
|
index: 1,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'isDynamicVisibility',
|
||||||
|
defaultValue: false
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
// 可视控制条件
|
||||||
|
condition: {
|
||||||
|
type: 'select',
|
||||||
|
// name: 'textColorTag',
|
||||||
|
label: '可视控制条件',
|
||||||
|
index: 1,
|
||||||
|
group: 'dynamicVisibility',
|
||||||
|
options: ['a=b', 'a>=b', 'a<=b'],
|
||||||
|
when: { eq: { 'tagOptions/dynamicVisibility/isDynamicVisibility': true } },
|
||||||
|
|
||||||
|
},
|
||||||
|
mainTag: {
|
||||||
|
type: 'text',
|
||||||
|
label: '主控制变量[a]',
|
||||||
|
group: 'dynamicVisibility',
|
||||||
|
defaultValue: '',
|
||||||
|
index: 2,
|
||||||
|
name: 'mainTag',
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'mainTag',
|
||||||
|
readOnly: true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
when: { eq: { 'tagOptions/dynamicVisibility/isDynamicVisibility': true } },
|
||||||
|
|
||||||
|
// when: { ne: { 'tagOptions/dynamicTextColor/textColorTag': '' } },
|
||||||
|
|
||||||
|
},
|
||||||
|
compareValue: {
|
||||||
|
type: 'number',
|
||||||
|
label: '比较常量[b]',
|
||||||
|
group: 'dynamicVisibility',
|
||||||
|
defaultValue: '',
|
||||||
|
index: 3,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'compareValue',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
when: { eq: { 'tagOptions/dynamicVisibility/isDynamicVisibility': true } },
|
||||||
|
|
||||||
|
// when: { ne: { 'tagOptions/dynamicTextColor/textColorTag': '' } },
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
var renderFieldContent = function (options, path, value, inspector) {
|
||||||
|
if (options.type === 'color-palette') {
|
||||||
|
// console.log($('.color-input'), 'ooooooooooooooooooo')
|
||||||
|
}
|
||||||
|
switch (options.name) {
|
||||||
|
// 增加颜色/数值 组合时候 数值自动从0 开始赋值
|
||||||
|
case 'colorValue':
|
||||||
|
var $input = $('<input type="number" />')
|
||||||
|
var text = options.defaultValue
|
||||||
|
var indexPlaceholder = '{{index}}'
|
||||||
|
if (text && text.indexOf(indexPlaceholder) > -1) {
|
||||||
|
var match = path.match(/\/(\d+)/)
|
||||||
|
if (match) {
|
||||||
|
|
||||||
|
var index = parseInt(match[1], 10)
|
||||||
|
text = text.replace(indexPlaceholder, index)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
$input.val(text)
|
||||||
|
$input.attr('readonly', true)
|
||||||
|
$input.attr('label', '对应数值')
|
||||||
|
return $input
|
||||||
|
// 变量数值显示
|
||||||
|
case 'tagName':
|
||||||
|
// 因为每次选择图形或操作图形都会进行一次事件绑定 为了防止多次绑定 每次绑定之前先解除该元素下的事件
|
||||||
|
$('.inspector-container').off('click', '#tagName').on('click', '#tagName', function (event) {
|
||||||
|
// 打开变量选择弹框
|
||||||
|
createTagDialog(function (selectedTagName) {
|
||||||
|
// 给对应的inspector赋值
|
||||||
|
$('#tagName').val(selectedTagName)
|
||||||
|
inspector.updateCell()
|
||||||
|
}, function () {
|
||||||
|
inspector.updateCell()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
break
|
||||||
|
// 动态文本色选择变量
|
||||||
|
case 'textColorTag':
|
||||||
|
$('.inspector-container').off('click', '#textColorTag').on('click', '#textColorTag', function () {
|
||||||
|
// 打开变量选择弹框
|
||||||
|
createTagDialog(function (selectedTagName) {
|
||||||
|
// 给对应的inspector赋值
|
||||||
|
$('#textColorTag').val(selectedTagName)
|
||||||
|
inspector.updateCell()
|
||||||
|
}, function () {
|
||||||
|
inspector.updateCell()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
break
|
||||||
|
// 动态边框色选择变量
|
||||||
|
case 'strokeColorTag':
|
||||||
|
$('.inspector-container').off('click', '#strokeColorTag').on('click', '#strokeColorTag', function () {
|
||||||
|
// 打开变量选择弹框
|
||||||
|
createTagDialog(function (selectedTagName) {
|
||||||
|
// 给对应的inspector赋值
|
||||||
|
$('#strokeColorTag').val(selectedTagName)
|
||||||
|
inspector.updateCell()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
break
|
||||||
|
// 动态背景色选择变量
|
||||||
|
case 'backgroundColorTag':
|
||||||
|
$('.inspector-container').off('click', '#backgroundColorTag').on('click', '#backgroundColorTag', function () {
|
||||||
|
// 打开变量选择弹框
|
||||||
|
createTagDialog(function (selectedTagName) {
|
||||||
|
// 给对应的inspector赋值
|
||||||
|
$('#backgroundColorTag').val(selectedTagName)
|
||||||
|
inspector.updateCell()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
break
|
||||||
|
// 动态可见性选择变量
|
||||||
|
case 'mainTag':
|
||||||
|
$('.inspector-container').off('click', '#mainTag').on('click', '#mainTag', function () {
|
||||||
|
// 打开变量选择弹框
|
||||||
|
createTagDialog(function (selectedTagName) {
|
||||||
|
// 给对应的inspector赋值
|
||||||
|
$('#mainTag').val(selectedTagName)
|
||||||
|
inspector.updateCell()
|
||||||
|
})
|
||||||
|
})
|
||||||
|
break
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
var groups = {
|
||||||
|
presentation: {
|
||||||
|
label: '基本属性',
|
||||||
|
index: 1
|
||||||
|
},
|
||||||
|
text: {
|
||||||
|
label: '文字属性',
|
||||||
|
index: 2,
|
||||||
|
closed: true
|
||||||
|
},
|
||||||
|
tag: {
|
||||||
|
label: '变量数值显示',
|
||||||
|
index: 3,
|
||||||
|
closed: true
|
||||||
|
},
|
||||||
|
dynamicTextColor: {
|
||||||
|
label: '动态文本色',
|
||||||
|
index: 4,
|
||||||
|
closed: true
|
||||||
|
},
|
||||||
|
dynamicStrokeColor: {
|
||||||
|
label: '动态边框色',
|
||||||
|
index: 5,
|
||||||
|
closed: true
|
||||||
|
},
|
||||||
|
dynamicBackgroundColor: {
|
||||||
|
label: '动态背景色',
|
||||||
|
index: 6,
|
||||||
|
closed: true
|
||||||
|
},
|
||||||
|
dynamicVisibility: {
|
||||||
|
label: '可见性',
|
||||||
|
index: 7,
|
||||||
|
closed: true
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
|
var options = {
|
||||||
|
|
||||||
|
colorPalette: [
|
||||||
|
{ content: '#f28226' },
|
||||||
|
{ content: '#00ff00' },
|
||||||
|
{ content: '#3d496d' },
|
||||||
|
{ content: '#000000' },
|
||||||
|
{ content: '#fbfbfb' },
|
||||||
|
{ content: '#ff0000' },
|
||||||
|
{ content: '#24a25c' }
|
||||||
|
],
|
||||||
|
|
||||||
|
// 文字粗细
|
||||||
|
fontWeight: [
|
||||||
|
{ value: '300', content: '<span style="font-weight: 300">细</span>' },
|
||||||
|
{ value: 'Normal', content: '<span style="font-weight: Normal">正常</span>' },
|
||||||
|
{ value: 'Bold', content: '<span style="font-weight: Bolder">加粗</span>' }
|
||||||
|
],
|
||||||
|
|
||||||
|
// 字体
|
||||||
|
fontFamily: [
|
||||||
|
{ value: 'SimSun', content: '<span style="font-family: SimSun">宋体</span>' },
|
||||||
|
{ value: 'SimHei', content: '<span style="font-family: SimHei">黑体</span>' },
|
||||||
|
{ value: 'Microsoft YaHei', content: '<span style="font-family: Microsoft YaHei">微软雅黑</span>' },
|
||||||
|
{ value: 'KaiTi', content: '<span style="font-family: KaiTi">楷体</span>' }
|
||||||
|
],
|
||||||
|
|
||||||
|
// 边框线条类型
|
||||||
|
strokeStyle: [
|
||||||
|
{ value: '0', content: '实线' },
|
||||||
|
{ value: '2,5', content: '点线' },
|
||||||
|
{ value: '10,5', content: '虚线' }
|
||||||
|
],
|
||||||
|
|
||||||
|
side: [
|
||||||
|
{ value: 'top', content: 'Top Side' },
|
||||||
|
{ value: 'right', content: 'Right Side' },
|
||||||
|
{ value: 'bottom', content: 'Bottom Side' },
|
||||||
|
{ value: 'left', content: 'Left Side' }
|
||||||
|
],
|
||||||
|
|
||||||
|
portLabelPositionRectangle: [
|
||||||
|
{ value: { name: 'top', args: { y: -12 } }, content: 'Above' },
|
||||||
|
{ value: { name: 'right', args: { y: 0 } }, content: 'On Right' },
|
||||||
|
{ value: { name: 'bottom', args: { y: 12 } }, content: 'Below' },
|
||||||
|
{ value: { name: 'left', args: { y: 0 } }, content: 'On Left' }
|
||||||
|
],
|
||||||
|
|
||||||
|
portLabelPositionEllipse: [
|
||||||
|
{ value: 'radial', content: 'Horizontal' },
|
||||||
|
{ value: 'radialOriented', content: 'Angled' }
|
||||||
|
],
|
||||||
|
|
||||||
|
imageIcons: [
|
||||||
|
{ value: 'assets/image-icon1.svg', content: '<img height="42px" src="assets/image-icon1.svg"/>' },
|
||||||
|
{ value: 'assets/image-icon2.svg', content: '<img height="80px" src="assets/image-icon2.svg"/>' },
|
||||||
|
{ value: 'assets/image-icon3.svg', content: '<img height="80px" src="assets/image-icon3.svg"/>' },
|
||||||
|
{ value: 'assets/image-icon4.svg', content: '<img height="80px" src="assets/image-icon4.svg"/>' }
|
||||||
|
],
|
||||||
|
|
||||||
|
imageGender: [
|
||||||
|
{ value: 'assets/member-male.png', content: '<img height="50px" src="assets/member-male.png" style="margin: 5px 0 0 2px;"/>' },
|
||||||
|
{ value: 'assets/member-female.png', content: '<img height="50px" src="assets/member-female.png" style="margin: 5px 0 0 2px;"/>' }
|
||||||
|
],
|
||||||
|
|
||||||
|
arrowheadSize: [
|
||||||
|
{ value: 'M 0 0 0 0', content: 'None' },
|
||||||
|
{ value: 'M 0 -3 -6 0 0 3 z', content: 'Small' },
|
||||||
|
{ value: 'M 0 -5 -10 0 0 5 z', content: 'Medium' },
|
||||||
|
{ value: 'M 0 -10 -15 0 0 10 z', content: 'Large' },
|
||||||
|
],
|
||||||
|
|
||||||
|
strokeWidth: [
|
||||||
|
{ value: 1, content: '<div style="background:#fff;width:2px;height:30px;margin:0 14px;border-radius: 2px;"/>' },
|
||||||
|
{ value: 2, content: '<div style="background:#fff;width:4px;height:30px;margin:0 13px;border-radius: 2px;"/>' },
|
||||||
|
{ value: 4, content: '<div style="background:#fff;width:8px;height:30px;margin:0 11px;border-radius: 2px;"/>' },
|
||||||
|
{ value: 8, content: '<div style="background:#fff;width:16px;height:30px;margin:0 8px;border-radius: 2px;"/>' }
|
||||||
|
],
|
||||||
|
|
||||||
|
router: [
|
||||||
|
{ value: 'normal', content: `<p style="background:#fff;width:2px;height:30px;margin:0 14px;border-radius: 2px;"><script>console.log(111)</script></p>` },
|
||||||
|
{ value: 'orthogonal', content: '<p style="width:20px;height:30px;margin:0 5px;border-bottom: 2px solid #fff;border-left: 2px solid #fff;"/>' },
|
||||||
|
{ value: 'oneSide', content: '<p style="width:20px;height:30px;margin:0 5px;border: 2px solid #fff;border-top: none;"/>' }
|
||||||
|
],
|
||||||
|
|
||||||
|
connector: [
|
||||||
|
{ value: 'normal', content: '<p style="width:20px;height:20px;margin:5px;border-top:2px solid #fff;border-left:2px solid #fff;"/>' },
|
||||||
|
{ value: 'rounded', content: '<p style="width:20px;height:20px;margin:5px;border-top-left-radius:30%;border-top:2px solid #fff;border-left:2px solid #fff;"/>' },
|
||||||
|
{ value: 'smooth', content: '<p style="width:20px;height:20px;margin:5px;border-top-left-radius:100%;border-top:2px solid #fff;border-left:2px solid #fff;"/>' }
|
||||||
|
],
|
||||||
|
|
||||||
|
labelPosition: [
|
||||||
|
{ value: 30, content: 'Close to source' },
|
||||||
|
{ value: 0.5, content: 'In the middle' },
|
||||||
|
{ value: -30, content: 'Close to target' },
|
||||||
|
],
|
||||||
|
|
||||||
|
portMarkup: [{
|
||||||
|
value: [{
|
||||||
|
tagName: 'rect',
|
||||||
|
selector: 'portBody',
|
||||||
|
attributes: {
|
||||||
|
'width': 20,
|
||||||
|
'height': 20,
|
||||||
|
'x': -10,
|
||||||
|
'y': -10
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
content: 'Rectangle'
|
||||||
|
}, {
|
||||||
|
value: [{
|
||||||
|
tagName: 'circle',
|
||||||
|
selector: 'portBody',
|
||||||
|
attributes: {
|
||||||
|
'r': 10
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
content: 'Circle'
|
||||||
|
}, {
|
||||||
|
value: [{
|
||||||
|
tagName: 'path',
|
||||||
|
selector: 'portBody',
|
||||||
|
attributes: {
|
||||||
|
'd': 'M -10 -10 10 -10 0 10 z'
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
content: 'Triangle'
|
||||||
|
}]
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
var attrLabel = {
|
||||||
|
text: {
|
||||||
|
type: 'content-editable',
|
||||||
|
label: '文字内容',
|
||||||
|
group: 'text',
|
||||||
|
index: 1
|
||||||
|
},
|
||||||
|
fontSize: {
|
||||||
|
type: 'range',
|
||||||
|
min: 5,
|
||||||
|
max: 80,
|
||||||
|
unit: '像素',
|
||||||
|
label: '文字大小',
|
||||||
|
group: 'text',
|
||||||
|
// inspector 依靠when参数中定义的表达式来基于其他输入的值切换输入字段的可见性。每当输入字段的表达式的计算结果为false（表示不满足条件）时，该输入字段就会被隐藏。否则，将显示输入字段
|
||||||
|
// when 只能控制是否显示当前的检查项
|
||||||
|
when: { ne: { 'attrs/label/text': '' } },
|
||||||
|
index: 2
|
||||||
|
},
|
||||||
|
fontFamily: {
|
||||||
|
type: 'select-box',
|
||||||
|
options: options.fontFamily,
|
||||||
|
label: '字体',
|
||||||
|
group: 'text',
|
||||||
|
when: { ne: { 'attrs/label/text': '' } },
|
||||||
|
index: 3
|
||||||
|
},
|
||||||
|
fontWeight: {
|
||||||
|
type: 'select-box',
|
||||||
|
options: options.fontWeight,
|
||||||
|
label: '文字加粗',
|
||||||
|
group: 'text',
|
||||||
|
when: { ne: { 'attrs/label/text': '' } },
|
||||||
|
index: 4
|
||||||
|
},
|
||||||
|
fill: {
|
||||||
|
type: 'color-palette',
|
||||||
|
options: options.colorPalette,
|
||||||
|
label: '文字颜色',
|
||||||
|
group: 'text',
|
||||||
|
when: { ne: { 'attrs/label/text': '' } },
|
||||||
|
index: 5
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
var attrBody = {
|
||||||
|
fill: {
|
||||||
|
type: 'color-palette',
|
||||||
|
options: options.colorPalette,
|
||||||
|
label: '填充色',
|
||||||
|
group: 'presentation',
|
||||||
|
index: 1
|
||||||
|
},
|
||||||
|
stroke: {
|
||||||
|
type: 'color-palette',
|
||||||
|
options: options.colorPalette,
|
||||||
|
label: '边框色',
|
||||||
|
group: 'presentation',
|
||||||
|
index: 2
|
||||||
|
},
|
||||||
|
strokeWidth: {
|
||||||
|
type: 'range',
|
||||||
|
min: 0,
|
||||||
|
max: 30,
|
||||||
|
step: 1,
|
||||||
|
defaultValue: 1,
|
||||||
|
unit: '像素',
|
||||||
|
label: '边框粗细',
|
||||||
|
group: 'presentation',
|
||||||
|
when: { ne: { 'attrs/body/stroke': 'transparent' } },
|
||||||
|
index: 3
|
||||||
|
},
|
||||||
|
strokeDasharray: {
|
||||||
|
type: 'select-box',
|
||||||
|
options: options.strokeStyle,
|
||||||
|
label: '边框类型',
|
||||||
|
group: 'presentation',
|
||||||
|
when: {
|
||||||
|
and: [
|
||||||
|
{ ne: { 'attrs/body/stroke': 'transparent' } },
|
||||||
|
{ ne: { 'attrs/body/strokeWidth': 0 } }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
index: 4
|
||||||
|
},
|
||||||
|
'fillOpacity': {
|
||||||
|
type: 'range',
|
||||||
|
group: 'presentation',
|
||||||
|
label: '背景色透明度',
|
||||||
|
min: 0,
|
||||||
|
max: 1,
|
||||||
|
step: 0.1
|
||||||
|
},
|
||||||
|
'strokeOpacity': {
|
||||||
|
type: 'range',
|
||||||
|
group: 'presentation',
|
||||||
|
label: '边框透明度',
|
||||||
|
min: 0,
|
||||||
|
max: 1,
|
||||||
|
step: 0.1
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
|
inspector = {
|
||||||
|
// 文本
|
||||||
|
'standard.TextBlock': {
|
||||||
|
inputs: {
|
||||||
|
attrs: {
|
||||||
|
label: {
|
||||||
|
text: {
|
||||||
|
type: 'content-editable',
|
||||||
|
label: '文字内容',
|
||||||
|
group: 'text',
|
||||||
|
index: 1
|
||||||
|
},
|
||||||
|
style: {
|
||||||
|
fontSize: {
|
||||||
|
type: 'range',
|
||||||
|
min: 5,
|
||||||
|
max: 80,
|
||||||
|
unit: '像素',
|
||||||
|
label: '文字大小',
|
||||||
|
group: 'text',
|
||||||
|
// inspector 依靠when参数中定义的表达式来基于其他输入的值切换输入字段的可见性。每当输入字段的表达式的计算结果为false（表示不满足条件）时，该输入字段就会被隐藏。否则，将显示输入字段
|
||||||
|
// when 只能控制是否显示当前的检查项
|
||||||
|
when: { ne: { 'attrs/label/text': '' } },
|
||||||
|
index: 2
|
||||||
|
},
|
||||||
|
fontFamily: {
|
||||||
|
type: 'select-box',
|
||||||
|
options: options.fontFamily,
|
||||||
|
label: '字体',
|
||||||
|
group: 'text',
|
||||||
|
when: { ne: { 'attrs/label/text': '' } },
|
||||||
|
index: 3
|
||||||
|
},
|
||||||
|
fontWeight: {
|
||||||
|
type: 'select-box',
|
||||||
|
options: options.fontWeight,
|
||||||
|
label: '文字加粗',
|
||||||
|
group: 'text',
|
||||||
|
when: { ne: { 'attrs/label/text': '' } },
|
||||||
|
index: 4
|
||||||
|
},
|
||||||
|
color: {
|
||||||
|
type: 'color-palette',
|
||||||
|
options: options.colorPalette,
|
||||||
|
label: '文字颜色',
|
||||||
|
group: 'text',
|
||||||
|
when: { ne: { 'attrs/label/text': '' } },
|
||||||
|
index: 5
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
body: {
|
||||||
|
fill: {
|
||||||
|
type: 'color-palette',
|
||||||
|
options: options.colorPalette,
|
||||||
|
label: '填充色',
|
||||||
|
group: 'presentation',
|
||||||
|
index: 1
|
||||||
|
},
|
||||||
|
stroke: {
|
||||||
|
type: 'color-palette',
|
||||||
|
options: options.colorPalette,
|
||||||
|
label: '边框色',
|
||||||
|
group: 'presentation',
|
||||||
|
index: 2
|
||||||
|
},
|
||||||
|
strokeWidth: {
|
||||||
|
type: 'range',
|
||||||
|
min: 0,
|
||||||
|
max: 30,
|
||||||
|
step: 1,
|
||||||
|
defaultValue: 1,
|
||||||
|
unit: '像素',
|
||||||
|
label: '边框粗细',
|
||||||
|
group: 'presentation',
|
||||||
|
when: { ne: { 'attrs/body/stroke': 'transparent' } },
|
||||||
|
index: 3
|
||||||
|
},
|
||||||
|
strokeDasharray: {
|
||||||
|
type: 'select-box',
|
||||||
|
options: options.strokeStyle,
|
||||||
|
label: '边框类型',
|
||||||
|
group: 'presentation',
|
||||||
|
when: {
|
||||||
|
and: [
|
||||||
|
{ ne: { 'attrs/body/stroke': 'transparent' } },
|
||||||
|
{ ne: { 'attrs/body/strokeWidth': 0 } }
|
||||||
|
]
|
||||||
|
},
|
||||||
|
index: 4
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
tagOptions: tagEditorOptions,
|
||||||
|
},
|
||||||
|
groups: groups,
|
||||||
|
renderFieldContent: renderFieldContent,
|
||||||
|
validateInput: function (el, path, type, inspector) {
|
||||||
|
var $el = $(el)
|
||||||
|
var value = inspector.parse(type, inspector.getFieldValue(el, type), el)
|
||||||
|
$el.removeClass('error').parent().find('error').remove()
|
||||||
|
var error = inspector.options.validateProperty(path, value)
|
||||||
|
if (error) {
|
||||||
|
var $error = $('<error/>').text(error)
|
||||||
|
$el.addClass('error').before($error)
|
||||||
|
}
|
||||||
|
return !error
|
||||||
|
},
|
||||||
|
validateProperty: function (path, value) {
|
||||||
|
switch (path) {
|
||||||
|
|
||||||
|
// case 'tagOptions/tagValue/isShowTagValue':
|
||||||
|
// if(value && !$('#tagName').val()) {
|
||||||
|
// return '请选择变量';
|
||||||
|
// }
|
||||||
|
// break;
|
||||||
|
// case 'tagOptions/tagValue/showTagValue':
|
||||||
|
// console.log(777)
|
||||||
|
// let isShowTagValue = $('#isShowTagValue')[0].checked
|
||||||
|
// if (isShowTagValue) {
|
||||||
|
// return '请选择变量';
|
||||||
|
// }else{
|
||||||
|
// break;
|
||||||
|
// }
|
||||||
|
|
||||||
|
|
||||||
|
// case 'attrs/body/strokeWidth':
|
||||||
|
// if (_.isNumber(value) && value >= 0) break;
|
||||||
|
// return 'Invalid Stroke Width (A positive number)';
|
||||||
|
// case 'phoneNumber':
|
||||||
|
// if (this.REGEX_PHONE_NUMBER.test(value)) break;
|
||||||
|
// return 'Invalid Phone Number (e.g. 123-456-7890)';
|
||||||
|
// case 'emailAddress':
|
||||||
|
// if (this.REGEX_EMAIL_ADDRESS.test(value)) break;
|
||||||
|
// return 'Invalid Email Address.';
|
||||||
|
}
|
||||||
|
return null
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// 矩形
|
||||||
|
'standard.Rectangle': {
|
||||||
|
inputs: {
|
||||||
|
attrs: {
|
||||||
|
label: attrLabel,
|
||||||
|
body: attrBody,
|
||||||
|
|
||||||
|
},
|
||||||
|
tagOptions: tagEditorOptions,
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
groups: groups,
|
||||||
|
renderFieldContent: renderFieldContent
|
||||||
|
|
||||||
|
},
|
||||||
|
// 椭圆
|
||||||
|
'standard.Ellipse': {
|
||||||
|
inputs: {
|
||||||
|
attrs: {
|
||||||
|
label: attrLabel,
|
||||||
|
body: attrBody
|
||||||
|
},
|
||||||
|
tagOptions: tagEditorOptions,
|
||||||
|
},
|
||||||
|
groups: groups,
|
||||||
|
renderFieldContent: renderFieldContent
|
||||||
|
},
|
||||||
|
// 菱形
|
||||||
|
'standard.Polygon': {
|
||||||
|
inputs: {
|
||||||
|
attrs: {
|
||||||
|
label: attrLabel,
|
||||||
|
body: attrBody
|
||||||
|
},
|
||||||
|
tagOptions: tagEditorOptions,
|
||||||
|
},
|
||||||
|
groups: groups,
|
||||||
|
renderFieldContent: renderFieldContent
|
||||||
|
|
||||||
|
},
|
||||||
|
// 圆
|
||||||
|
'standard.Circle': {
|
||||||
|
inputs: {
|
||||||
|
attrs: {
|
||||||
|
label: attrLabel,
|
||||||
|
body: attrBody
|
||||||
|
},
|
||||||
|
tagOptions: tagEditorOptions,
|
||||||
|
},
|
||||||
|
groups: groups,
|
||||||
|
renderFieldContent: renderFieldContent
|
||||||
|
},
|
||||||
|
'customPath': function (cell) {
|
||||||
|
return {
|
||||||
|
cellView: cell,
|
||||||
|
// theme: 'dark',
|
||||||
|
stateKey: function (model) {
|
||||||
|
return model.get('type')
|
||||||
|
},
|
||||||
|
inputs: {
|
||||||
|
attrs: {
|
||||||
|
path: attrBody
|
||||||
|
},
|
||||||
|
tagOptions: tagEditorOptions,
|
||||||
|
},
|
||||||
|
groups: groups,
|
||||||
|
renderFieldContent: renderFieldContent
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
|
||||||
|
})()
|
||||||
|
|
||||||
|
export { inspector }
|
||||||
@ -0,0 +1,236 @@
|
|||||||
|
// 定义“圆形”，“矩形”上锚点，以及由锚点引出的链接线的属性
|
||||||
|
(function(joint) {
|
||||||
|
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
joint.shapes.standard.Ellipse.define('app.CircularModel', {
|
||||||
|
attrs: {
|
||||||
|
root: {
|
||||||
|
magnet: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
ports: {
|
||||||
|
groups: {
|
||||||
|
'in': {
|
||||||
|
markup: [{
|
||||||
|
tagName: 'circle',
|
||||||
|
selector: 'portBody',
|
||||||
|
attributes: {
|
||||||
|
'r': 10
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
attrs: {
|
||||||
|
portBody: {
|
||||||
|
magnet: true,
|
||||||
|
fill: '#61549c',
|
||||||
|
strokeWidth: 0
|
||||||
|
},
|
||||||
|
portLabel: {
|
||||||
|
fontSize: 11,
|
||||||
|
fill: '#61549c',
|
||||||
|
fontWeight: 800
|
||||||
|
}
|
||||||
|
},
|
||||||
|
position: {
|
||||||
|
name: 'ellipse',
|
||||||
|
args: {
|
||||||
|
startAngle: 0,
|
||||||
|
step: 30
|
||||||
|
}
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
position: {
|
||||||
|
name: 'radial',
|
||||||
|
args: null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'out': {
|
||||||
|
markup: [{
|
||||||
|
tagName: 'circle',
|
||||||
|
selector: 'portBody',
|
||||||
|
attributes: {
|
||||||
|
'r': 10
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
attrs: {
|
||||||
|
portBody: {
|
||||||
|
magnet: true,
|
||||||
|
fill: '#61549c',
|
||||||
|
strokeWidth: 0
|
||||||
|
},
|
||||||
|
portLabel: {
|
||||||
|
fontSize: 11,
|
||||||
|
fill: '#61549c',
|
||||||
|
fontWeight: 800
|
||||||
|
}
|
||||||
|
},
|
||||||
|
position: {
|
||||||
|
name: 'ellipse',
|
||||||
|
args: {
|
||||||
|
startAngle: 180,
|
||||||
|
step: 30
|
||||||
|
}
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
position: {
|
||||||
|
name: 'radial',
|
||||||
|
args: null
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
portLabelMarkup: [{
|
||||||
|
tagName: 'text',
|
||||||
|
selector: 'portLabel'
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
|
||||||
|
joint.shapes.standard.Rectangle.define('app.RectangularModel', {
|
||||||
|
attrs: {
|
||||||
|
root: {
|
||||||
|
magnet: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
ports: {
|
||||||
|
groups: {
|
||||||
|
'in': {
|
||||||
|
markup: [{
|
||||||
|
tagName: 'circle',
|
||||||
|
selector: 'portBody',
|
||||||
|
attributes: {
|
||||||
|
'r': 10
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
attrs: {
|
||||||
|
portBody: {
|
||||||
|
magnet: true,
|
||||||
|
fill: '#61549c',
|
||||||
|
strokeWidth: 0
|
||||||
|
},
|
||||||
|
portLabel: {
|
||||||
|
fontSize: 110,
|
||||||
|
fill: '#61549c',
|
||||||
|
fontWeight: 800
|
||||||
|
}
|
||||||
|
},
|
||||||
|
position: {
|
||||||
|
name: 'left'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
position: {
|
||||||
|
name: 'left',
|
||||||
|
args: {
|
||||||
|
y: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
'out': {
|
||||||
|
markup: [{
|
||||||
|
tagName: 'circle',
|
||||||
|
selector: 'portBody',
|
||||||
|
attributes: {
|
||||||
|
'r': 10
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
position: {
|
||||||
|
name: 'right'
|
||||||
|
},
|
||||||
|
attrs: {
|
||||||
|
portBody: {
|
||||||
|
magnet: true,
|
||||||
|
fill: '#61549c',
|
||||||
|
strokeWidth: 0
|
||||||
|
},
|
||||||
|
portLabel: {
|
||||||
|
fontSize: 11,
|
||||||
|
fill: '#61549c',
|
||||||
|
fontWeight: 800
|
||||||
|
}
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
position: {
|
||||||
|
name: 'right',
|
||||||
|
args: {
|
||||||
|
y: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
portLabelMarkup: [{
|
||||||
|
tagName: 'text',
|
||||||
|
selector: 'portLabel'
|
||||||
|
}]
|
||||||
|
});
|
||||||
|
|
||||||
|
joint.shapes.standard.Link.define('app.Link', {
|
||||||
|
router: {
|
||||||
|
name: 'normal'
|
||||||
|
},
|
||||||
|
connector: {
|
||||||
|
name: 'rounded'
|
||||||
|
},
|
||||||
|
labels: [],
|
||||||
|
attrs: {
|
||||||
|
line: {
|
||||||
|
stroke: '#8f8f8f',
|
||||||
|
strokeDasharray: '0',
|
||||||
|
strokeWidth: 2,
|
||||||
|
fill: 'none',
|
||||||
|
sourceMarker: {
|
||||||
|
type: 'path',
|
||||||
|
d: 'M 0 0 0 0',
|
||||||
|
stroke: 'none'
|
||||||
|
},
|
||||||
|
targetMarker: {
|
||||||
|
type: 'path',
|
||||||
|
d: 'M 0 -5 -10 0 0 5 z',
|
||||||
|
stroke: 'none'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
defaultLabel: {
|
||||||
|
attrs: {
|
||||||
|
rect: {
|
||||||
|
fill: '#ffffff',
|
||||||
|
stroke: '#8f8f8f',
|
||||||
|
strokeWidth: 1,
|
||||||
|
refWidth: 10,
|
||||||
|
refHeight: 10,
|
||||||
|
refX: -5,
|
||||||
|
refY: -5
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
getMarkerWidth: function(type) {
|
||||||
|
var d = (type === 'source') ? this.attr('line/sourceMarker/d') : this.attr('line/targetMarker/d');
|
||||||
|
return this.getDataWidth(d);
|
||||||
|
},
|
||||||
|
|
||||||
|
getDataWidth: _.memoize(function(d) {
|
||||||
|
return (new g.Path(d)).bbox().width;
|
||||||
|
})
|
||||||
|
|
||||||
|
}, {
|
||||||
|
|
||||||
|
connectionPoint: function(line, view, magnet, opt, type, linkView) {
|
||||||
|
var markerWidth = linkView.model.getMarkerWidth(type);
|
||||||
|
opt = { offset: markerWidth, stroke: true };
|
||||||
|
// connection point for UML shapes lies on the root group containg all the shapes components
|
||||||
|
var modelType = view.model.get('type');
|
||||||
|
if (modelType.indexOf('uml') === 0) opt.selector = 'root';
|
||||||
|
// taking the border stroke-width into account
|
||||||
|
if (modelType === 'standard.InscribedImage') opt.selector = 'border';
|
||||||
|
return joint.connectionPoints.boundary.call(this, line, view, magnet, opt, type, linkView);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
})(joint);
|
||||||
1069
dwt-circuit/webpack-circuit/src/pages/draw/config/main.js
Normal file
1069
dwt-circuit/webpack-circuit/src/pages/draw/config/main.js
Normal file
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,53 @@
|
|||||||
|
// 右下角 缩略图 的定义
|
||||||
|
(function(joint, util) {
|
||||||
|
|
||||||
|
joint.shapes.app.NavigatorElementView = joint.dia.ElementView.extend({
|
||||||
|
|
||||||
|
body: null,
|
||||||
|
|
||||||
|
markup: [{
|
||||||
|
tagName: 'rect',
|
||||||
|
selector: 'body',
|
||||||
|
attributes: {
|
||||||
|
'fill': '#31d0c6'
|
||||||
|
}
|
||||||
|
}],
|
||||||
|
|
||||||
|
initFlag: ['RENDER', 'UPDATE', 'TRANSFORM'],
|
||||||
|
|
||||||
|
presentationAttributes: {
|
||||||
|
size: ['UPDATE'],
|
||||||
|
position: ['TRANSFORM'],
|
||||||
|
angle: ['TRANSFORM']
|
||||||
|
},
|
||||||
|
|
||||||
|
confirmUpdate: function(flags) {
|
||||||
|
|
||||||
|
if (this.hasFlag(flags, 'RENDER')) this.render();
|
||||||
|
if (this.hasFlag(flags, 'UPDATE')) this.update();
|
||||||
|
if (this.hasFlag(flags, 'TRANSFORM')) this.updateTransformation();
|
||||||
|
},
|
||||||
|
|
||||||
|
render: function() {
|
||||||
|
var doc = util.parseDOMJSON(this.markup);
|
||||||
|
this.body = doc.selectors.body;
|
||||||
|
this.el.appendChild(doc.fragment);
|
||||||
|
},
|
||||||
|
|
||||||
|
update: function() {
|
||||||
|
var size = this.model.size();
|
||||||
|
this.body.setAttribute('width', size.width);
|
||||||
|
this.body.setAttribute('height', size.height);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
joint.shapes.app.NavigatorLinkView = joint.dia.LinkView.extend({
|
||||||
|
|
||||||
|
initialize: util.noop,
|
||||||
|
|
||||||
|
render: util.noop,
|
||||||
|
|
||||||
|
update: util.noop
|
||||||
|
});
|
||||||
|
|
||||||
|
})(joint, joint.util);
|
||||||
61
dwt-circuit/webpack-circuit/src/pages/draw/config/path.js
Normal file
61
dwt-circuit/webpack-circuit/src/pages/draw/config/path.js
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
require ('../../../assets/js/jquery.js')
|
||||||
|
require ('../../../assets/js/lodash.js')
|
||||||
|
require ('../../../assets/js/backbone.js')
|
||||||
|
require ('../../../assets/js/graphlib.core.js')
|
||||||
|
require ('../../../assets/js/dagre.core.js')
|
||||||
|
require ('../../../assets/js/rappid.js')
|
||||||
|
var path;
|
||||||
|
(function() {
|
||||||
|
'use strict'
|
||||||
|
var V = joint.V
|
||||||
|
var g = joint.g
|
||||||
|
path = joint.dia.Element.define('Path', {
|
||||||
|
attrs: {
|
||||||
|
path: {
|
||||||
|
strokeMiterlimit: 4,
|
||||||
|
strokeLinejoin: 'miter',
|
||||||
|
strokeLinecap: 'butt',
|
||||||
|
strokeOpacity: 1,
|
||||||
|
strokeDasharray: 'none',
|
||||||
|
fillOpacity: 1,
|
||||||
|
fillRule: 'nonzero'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
|
||||||
|
markup: 'path',
|
||||||
|
|
||||||
|
updateBBox: function(bbox, opt) {
|
||||||
|
|
||||||
|
this.position(bbox.x, bbox.y, opt);
|
||||||
|
this.resize(bbox.width || 1, bbox.height || 1, opt);
|
||||||
|
},
|
||||||
|
|
||||||
|
updatePathData: function(paper) {
|
||||||
|
|
||||||
|
var view = this.findView(paper);
|
||||||
|
var path = view.vel.findOne('path');
|
||||||
|
var untransformedBBox = path.getBBox({ target: view.el });
|
||||||
|
var transformedBBox = path.getBBox({ target: paper.layers });
|
||||||
|
var position = transformedBBox.center().difference(untransformedBBox.center().difference(untransformedBBox.topLeft()));
|
||||||
|
this.attr('path/refD', path.attr('d'), {
|
||||||
|
nextBBox: new g.Rect(position.x, position.y, untransformedBBox.width, untransformedBBox.height),
|
||||||
|
prevBBox: this.getBBox()
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
|
||||||
|
createFromNode: function(pathNode, paper) {
|
||||||
|
|
||||||
|
var bbox = V.transformRect(pathNode.getBBox(), paper.matrix().inverse());
|
||||||
|
var p = new this({
|
||||||
|
position: { x: bbox.x, y: bbox.y },
|
||||||
|
size: { width: bbox.width, height: bbox.height },
|
||||||
|
attrs: { path: { refD: pathNode.getAttribute('d') }}
|
||||||
|
});
|
||||||
|
|
||||||
|
return p;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})()
|
||||||
|
export {path}
|
||||||
File diff suppressed because one or more lines are too long
@ -0,0 +1,63 @@
|
|||||||
|
//
|
||||||
|
var selection;
|
||||||
|
|
||||||
|
(function() {
|
||||||
|
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
selection = {
|
||||||
|
|
||||||
|
handles: [{
|
||||||
|
name: 'remove',
|
||||||
|
position: 'nw',
|
||||||
|
events: {
|
||||||
|
pointerdown: 'removeElements'
|
||||||
|
},
|
||||||
|
attrs: {
|
||||||
|
'.handle': {
|
||||||
|
'data-tooltip-class-name': 'small',
|
||||||
|
'data-tooltip': '删除',
|
||||||
|
'data-tooltip-position': 'right',
|
||||||
|
'data-tooltip-padding': 15
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
name: 'rotate',
|
||||||
|
position: 'sw',
|
||||||
|
events: {
|
||||||
|
pointerdown: 'startRotating',
|
||||||
|
pointermove: 'doRotate',
|
||||||
|
pointerup: 'stopBatch'
|
||||||
|
},
|
||||||
|
attrs: {
|
||||||
|
'.handle': {
|
||||||
|
'data-tooltip-class-name': 'small',
|
||||||
|
'data-tooltip': '旋转',
|
||||||
|
'data-tooltip-position': 'right',
|
||||||
|
'data-tooltip-padding': 15
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}, {
|
||||||
|
name: 'resize',
|
||||||
|
position: 'se',
|
||||||
|
events: {
|
||||||
|
pointerdown: 'startResizing',
|
||||||
|
pointermove: 'doResize',
|
||||||
|
pointerup: 'stopBatch'
|
||||||
|
},
|
||||||
|
attrs: {
|
||||||
|
'.handle': {
|
||||||
|
'data-tooltip-class-name': 'small',
|
||||||
|
'data-tooltip': '缩放',
|
||||||
|
'data-tooltip-position': 'left',
|
||||||
|
'data-tooltip-padding': 15
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}]
|
||||||
|
};
|
||||||
|
|
||||||
|
})();
|
||||||
|
|
||||||
|
export { selection };
|
||||||
162
dwt-circuit/webpack-circuit/src/pages/draw/config/stencil.js
Normal file
162
dwt-circuit/webpack-circuit/src/pages/draw/config/stencil.js
Normal file
@ -0,0 +1,162 @@
|
|||||||
|
// 左侧组件库
|
||||||
|
var stencil;
|
||||||
|
|
||||||
|
(function () {
|
||||||
|
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
stencil = {};
|
||||||
|
|
||||||
|
stencil.groups = {
|
||||||
|
standard: { index: 1, label: '基础图形' },
|
||||||
|
};
|
||||||
|
|
||||||
|
stencil.shapes = {};
|
||||||
|
|
||||||
|
stencil.shapes.standard = [
|
||||||
|
//
|
||||||
|
{
|
||||||
|
type: 'standard.TextBlock',
|
||||||
|
size: { width: 5, height: 3 },
|
||||||
|
attrs: {
|
||||||
|
root: {
|
||||||
|
dataTooltip: '文本',
|
||||||
|
dataTooltipPosition: 'left',
|
||||||
|
dataTooltipPositionSelector: '.joint-stencil'
|
||||||
|
},
|
||||||
|
body: {
|
||||||
|
rx: 2,
|
||||||
|
ry: 2,
|
||||||
|
width: 50,
|
||||||
|
height: 30,
|
||||||
|
fill: 'transparent',
|
||||||
|
// stroke: '#31d0c6',
|
||||||
|
strokeWidth: 0,
|
||||||
|
strokeDasharray: '0'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
text: '文本框',
|
||||||
|
style: {
|
||||||
|
color: '#c6c7e2',
|
||||||
|
fontFamily: 'Roboto Condensed',
|
||||||
|
fontWeight: 'Normal',
|
||||||
|
fontSize: 11,
|
||||||
|
strokeWidth: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 矩形
|
||||||
|
{
|
||||||
|
type: 'standard.Rectangle',
|
||||||
|
size: { width: 5, height: 3 },
|
||||||
|
attrs: {
|
||||||
|
root: {
|
||||||
|
dataTooltip: '矩形',
|
||||||
|
dataTooltipPosition: 'left',
|
||||||
|
dataTooltipPositionSelector: '.joint-stencil'
|
||||||
|
},
|
||||||
|
body: {
|
||||||
|
rx: 2,
|
||||||
|
ry: 2,
|
||||||
|
width: 50,
|
||||||
|
height: 30,
|
||||||
|
fill: 'transparent',
|
||||||
|
stroke: '#31d0c6',
|
||||||
|
strokeWidth: 2,
|
||||||
|
strokeDasharray: '0'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
text: '',
|
||||||
|
fill: '#c6c7e2',
|
||||||
|
fontFamily: 'Roboto Condensed',
|
||||||
|
fontWeight: 'Normal',
|
||||||
|
fontSize: 11,
|
||||||
|
strokeWidth: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'standard.Polygon',
|
||||||
|
size: { width: 5, height: 3 },
|
||||||
|
attrs: {
|
||||||
|
root: {
|
||||||
|
dataTooltip: '菱形',
|
||||||
|
dataTooltipPosition: 'left',
|
||||||
|
dataTooltipPositionSelector: '.joint-stencil'
|
||||||
|
},
|
||||||
|
body: {
|
||||||
|
refPoints: '50,0 100,50 50,100 0,50',
|
||||||
|
fill: 'transparent',
|
||||||
|
stroke: '#31d0c6',
|
||||||
|
strokeWidth: 2,
|
||||||
|
strokeDasharray: '0'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
fill: '#c6c7e2',
|
||||||
|
fontFamily: 'Roboto Condensed',
|
||||||
|
fontWeight: 'Normal',
|
||||||
|
fontSize: 11,
|
||||||
|
strokeWidth: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 椭圆
|
||||||
|
{
|
||||||
|
type: 'standard.Ellipse',
|
||||||
|
size: { width: 5, height: 3 },
|
||||||
|
attrs: {
|
||||||
|
root: {
|
||||||
|
dataTooltip: '椭圆形',
|
||||||
|
dataTooltipPosition: 'left',
|
||||||
|
dataTooltipPositionSelector: '.joint-stencil'
|
||||||
|
},
|
||||||
|
body: {
|
||||||
|
width: 50,
|
||||||
|
height: 30,
|
||||||
|
fill: 'transparent',
|
||||||
|
stroke: '#31d0c6',
|
||||||
|
strokeWidth: 2,
|
||||||
|
strokeDasharray: '0'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
text: '',
|
||||||
|
fill: '#c6c7e2',
|
||||||
|
fontFamily: 'Roboto Condensed',
|
||||||
|
fontWeight: 'Normal',
|
||||||
|
fontSize: 11,
|
||||||
|
strokeWidth: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'standard.Circle',
|
||||||
|
size: { width: 5, height: 5 },
|
||||||
|
attrs: {
|
||||||
|
root: {
|
||||||
|
dataTooltip: '圆形',
|
||||||
|
dataTooltipPosition: 'left',
|
||||||
|
dataTooltipPositionSelector: '.joint-stencil'
|
||||||
|
},
|
||||||
|
body: {
|
||||||
|
width: 50,
|
||||||
|
height: 50,
|
||||||
|
fill: 'transparent',
|
||||||
|
stroke: '#31d0c6',
|
||||||
|
strokeWidth: 2,
|
||||||
|
strokeDasharray: '0'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
fill: '#c6c7e2',
|
||||||
|
fontFamily: 'Roboto Condensed',
|
||||||
|
fontWeight: 'Normal',
|
||||||
|
fontSize: 11,
|
||||||
|
strokeWidth: 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
];
|
||||||
|
|
||||||
|
})();
|
||||||
|
|
||||||
|
export { stencil };
|
||||||
@ -0,0 +1,86 @@
|
|||||||
|
import { AttrFnMap } from '../../../common/attr-fn-map'
|
||||||
|
|
||||||
|
var SubPub;
|
||||||
|
|
||||||
|
(function () {
|
||||||
|
SubPub = {
|
||||||
|
/**
|
||||||
|
* subs 需要保存到数据库
|
||||||
|
*
|
||||||
|
* subs = {
|
||||||
|
* cell1: {
|
||||||
|
* var1: {
|
||||||
|
* showVal: fnName,
|
||||||
|
* fnName1: {
|
||||||
|
* t_color: color1,
|
||||||
|
* f_color: color2
|
||||||
|
* },
|
||||||
|
* fnName2: {
|
||||||
|
* t_color: color3,
|
||||||
|
* f_color: color4
|
||||||
|
* },
|
||||||
|
* fnName3: {
|
||||||
|
* t_opacity: 0,
|
||||||
|
* f_opacity: 1
|
||||||
|
* }
|
||||||
|
* }
|
||||||
|
* },
|
||||||
|
* cell2: {...}
|
||||||
|
* }
|
||||||
|
*
|
||||||
|
* Object.keys(obj).length ====== 对象长度
|
||||||
|
*/
|
||||||
|
subs: {},
|
||||||
|
// 订阅
|
||||||
|
subscribe () {},
|
||||||
|
// 发布
|
||||||
|
/* res = {
|
||||||
|
varId1: 1,
|
||||||
|
varId2: false,
|
||||||
|
varId3: 100
|
||||||
|
.
|
||||||
|
.
|
||||||
|
.
|
||||||
|
}
|
||||||
|
*/
|
||||||
|
publish (res, graph, subs) {
|
||||||
|
// 遍历 cell 图形元素
|
||||||
|
for (let cell in subs) {
|
||||||
|
if (subs.hasOwnProperty(cell)) {
|
||||||
|
let cellId = cell
|
||||||
|
let cellItem = subs[cell]
|
||||||
|
|
||||||
|
// 遍历 绑定的变量 tag
|
||||||
|
for (let tag in cellItem) {
|
||||||
|
if (cellItem.hasOwnProperty(tag)) {
|
||||||
|
let val = res[tag]
|
||||||
|
let tagItem = cellItem[tag]
|
||||||
|
|
||||||
|
// 遍历 绑定的函数 fn
|
||||||
|
for (let fn in tagItem) {
|
||||||
|
if (tagItem.hasOwnProperty(fn)) {
|
||||||
|
|
||||||
|
// showVal 改变数值的函数
|
||||||
|
if (fn == 'showVal' && tagItem[fn]) {
|
||||||
|
AttrFnMap[fn]({graph: graph, cellId: cellId, val: val})
|
||||||
|
} else {
|
||||||
|
let params = Object.assign({graph: graph, cellId: cellId, val: val}, tagItem[fn])
|
||||||
|
AttrFnMap[fn](params)
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
// 取消订阅 (将 subs 对象中对应的属性更新)
|
||||||
|
unSubscribe () {}
|
||||||
|
}
|
||||||
|
})()
|
||||||
|
|
||||||
|
export { SubPub };
|
||||||
148
dwt-circuit/webpack-circuit/src/pages/draw/config/tag-options.js
Normal file
148
dwt-circuit/webpack-circuit/src/pages/draw/config/tag-options.js
Normal file
@ -0,0 +1,148 @@
|
|||||||
|
import { menu } from '../../../common/menu'
|
||||||
|
let getTagOptions = function (cell, options) {
|
||||||
|
if (!options) return
|
||||||
|
let store = window.Store
|
||||||
|
let cellOptions = {}
|
||||||
|
// 变量数值显示 检测
|
||||||
|
let tagValue = options.tagValue
|
||||||
|
if (tagValue && !tagValue.isShowTagValue) {
|
||||||
|
// if(store.varJson){
|
||||||
|
// store[cell.id][]
|
||||||
|
// }
|
||||||
|
} else if (tagValue && tagValue.isShowTagValue && !tagValue.showTagValue) {
|
||||||
|
// 如果开启了变量数值显示 但没有关联变量 给出关联变量的提示
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'alert',
|
||||||
|
closeAnimation: { delay: 3000 },
|
||||||
|
width: 100,
|
||||||
|
modal: false,
|
||||||
|
title: '提示',
|
||||||
|
content: '请选择关联变量'
|
||||||
|
})).open()
|
||||||
|
} else if (tagValue && tagValue.isShowTagValue && tagValue.showTagValue) {
|
||||||
|
// 如果开启了变量数值显示 且关联了变量 则将值存储
|
||||||
|
let showTagValue = tagValue.showTagValue
|
||||||
|
if (!cellOptions[showTagValue]) {
|
||||||
|
cellOptions[showTagValue] = {}
|
||||||
|
}
|
||||||
|
// console.log(tagValue, 'tagValue')
|
||||||
|
cellOptions[showTagValue]['showVal'] = menu.text_val
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
// 动态文本色 检测
|
||||||
|
let dynamicTextColor = options.dynamicTextColor
|
||||||
|
// 如果开启了动态文本色 但是没有选择对应变量 给出选择对应变量的提示
|
||||||
|
if (dynamicTextColor && !dynamicTextColor.isDynamicTextColor) {
|
||||||
|
|
||||||
|
} if (dynamicTextColor && dynamicTextColor.isDynamicTextColor && !dynamicTextColor.textColorTag) {
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'alert',
|
||||||
|
closeAnimation: { delay: 3000 },
|
||||||
|
width: 100,
|
||||||
|
modal: false,
|
||||||
|
title: '提示',
|
||||||
|
content: '请选择对应变量'
|
||||||
|
})).open()
|
||||||
|
} else if (dynamicTextColor && dynamicTextColor.isDynamicTextColor && dynamicTextColor.textColorTag && dynamicTextColor.textColorOptions && dynamicTextColor.textColorOptions.length >= 2) {
|
||||||
|
// 如果选择了对应变量 且添加了对应的颜色和值
|
||||||
|
let textColorTag = dynamicTextColor.textColorTag
|
||||||
|
let textColorOptions = dynamicTextColor.textColorOptions
|
||||||
|
if (!cellOptions[textColorTag]) {
|
||||||
|
cellOptions[textColorTag] = {}
|
||||||
|
}
|
||||||
|
let textColor = menu.text_color
|
||||||
|
cellOptions[textColorTag][textColor] = {
|
||||||
|
t_color: textColorOptions[1]['textColor'],
|
||||||
|
f_color: textColorOptions[0]['textColor']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 动态边框色 检测
|
||||||
|
let dynamicStrokeColor = options.dynamicStrokeColor
|
||||||
|
// 如果开启了动态边框色 但是没有选择对应变量 给出选择对应变量的提示
|
||||||
|
if (dynamicStrokeColor && dynamicStrokeColor.isDynamicStrokeColor && !dynamicStrokeColor.strokeColorTag) {
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'alert',
|
||||||
|
closeAnimation: { delay: 3000 },
|
||||||
|
width: 100,
|
||||||
|
modal: false,
|
||||||
|
title: '提示',
|
||||||
|
content: '请选择对应变量'
|
||||||
|
})).open()
|
||||||
|
} else if (dynamicStrokeColor && dynamicStrokeColor.isDynamicStrokeColor && dynamicStrokeColor.strokeColorTag && dynamicStrokeColor.textColorOptions && dynamicStrokeColor.textColorOptions.length >= 2) {
|
||||||
|
// 如果选择了对应变量 且添加了对应的颜色和值
|
||||||
|
let strokeColorTag = dynamicStrokeColor.strokeColorTag
|
||||||
|
let textColorOptions = dynamicStrokeColor.textColorOptions
|
||||||
|
if (!cellOptions[strokeColorTag]) {
|
||||||
|
cellOptions[strokeColorTag] = {}
|
||||||
|
}
|
||||||
|
let strokecColor = menu.border_color
|
||||||
|
cellOptions[strokeColorTag][strokecColor] = {
|
||||||
|
t_color: textColorOptions[1]['textColor'],
|
||||||
|
f_color: textColorOptions[0]['textColor']
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 动态背景色 检测
|
||||||
|
let dynamicBackgroundColor = options.dynamicBackgroundColor
|
||||||
|
// 如果开启了动态边框色 但是没有选择对应变量 给出选择对应变量的提示
|
||||||
|
if (dynamicBackgroundColor && dynamicBackgroundColor.isDynamicBackgroundColor && !dynamicBackgroundColor.backgroundColorTag) {
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'alert',
|
||||||
|
closeAnimation: { delay: 3000 },
|
||||||
|
width: 100,
|
||||||
|
modal: false,
|
||||||
|
title: '提示',
|
||||||
|
content: '请选择对应变量'
|
||||||
|
})).open()
|
||||||
|
} else if (dynamicBackgroundColor && dynamicBackgroundColor.isDynamicBackgroundColor && dynamicBackgroundColor.backgroundColorTag && dynamicBackgroundColor.textColorOptions && dynamicBackgroundColor.textColorOptions.length >= 2) {
|
||||||
|
// 如果选择了对应变量 且添加了对应的颜色和值
|
||||||
|
let backgroundColorTag = dynamicBackgroundColor.backgroundColorTag
|
||||||
|
let textColorOptions = dynamicBackgroundColor.textColorOptions
|
||||||
|
if (!cellOptions[backgroundColorTag]) {
|
||||||
|
cellOptions[backgroundColorTag] = {}
|
||||||
|
}
|
||||||
|
let fillColor = menu.fill_color
|
||||||
|
cellOptions[backgroundColorTag][fillColor] = {
|
||||||
|
t_color: textColorOptions[1]['textColor'],
|
||||||
|
f_color: textColorOptions[0]['textColor']
|
||||||
|
}
|
||||||
|
console.log(cellOptions, 'cellOptions')
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// 可见性 检测
|
||||||
|
let dynamicVisibility = options.dynamicVisibility
|
||||||
|
// 如果开启了动态边框色 但是没有选择对应变量 给出选择对应变量的提示
|
||||||
|
if (dynamicVisibility && dynamicVisibility.isDynamicVisibility && !dynamicVisibility.mainTag) {
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'alert',
|
||||||
|
closeAnimation: { delay: 3000 },
|
||||||
|
width: 100,
|
||||||
|
modal: false,
|
||||||
|
title: '提示',
|
||||||
|
content: '请选择主控制变量'
|
||||||
|
})).open()
|
||||||
|
} else if (dynamicVisibility && dynamicVisibility.isDynamicVisibility && dynamicVisibility.mainTag && dynamicVisibility.compareValue) {
|
||||||
|
let mainTag = dynamicVisibility.mainTag
|
||||||
|
if (!cellOptions[mainTag]) {
|
||||||
|
cellOptions[mainTag] = {}
|
||||||
|
}
|
||||||
|
let visible = menu.visible
|
||||||
|
cellOptions[mainTag][visible] = {
|
||||||
|
compareValue: dynamicVisibility.compareValue,
|
||||||
|
condition: dynamicVisibility.condition
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (!store.varJson) store.varJson = {}
|
||||||
|
store.varJson[cell.id] = cellOptions
|
||||||
|
// 如果对应元素没有绑定任何变量 则删除该元素的数据绑定
|
||||||
|
if (!Object.keys(cellOptions).length) {
|
||||||
|
delete store.varJson[cell.id]
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
export { getTagOptions }
|
||||||
@ -0,0 +1,71 @@
|
|||||||
|
// 右下方“Modern”、“Dark”、“Material” 按钮功能
|
||||||
|
require('../../../assets/js/jquery.js')
|
||||||
|
require('../../../assets/js/lodash.js')
|
||||||
|
require('../../../assets/js/backbone.js')
|
||||||
|
require('../../../assets/js/graphlib.core.js')
|
||||||
|
require('../../../assets/js/dagre.core.js')
|
||||||
|
require('../../../assets/js/rappid.js')
|
||||||
|
var ThemePicker;
|
||||||
|
|
||||||
|
(function (_, joint) {
|
||||||
|
|
||||||
|
ThemePicker = joint.ui.Toolbar.extend({
|
||||||
|
|
||||||
|
className: function () {
|
||||||
|
return _.result(joint.ui.Toolbar.prototype, 'className') + ' theme-picker'
|
||||||
|
},
|
||||||
|
|
||||||
|
options: {
|
||||||
|
mainView: null // an instance of App.MainView
|
||||||
|
},
|
||||||
|
|
||||||
|
themes: {
|
||||||
|
type: 'select-button-group',
|
||||||
|
name: 'theme-picker',
|
||||||
|
multi: false,
|
||||||
|
options: [
|
||||||
|
{ value: 'modern', content: 'Modern' },
|
||||||
|
{ value: 'dark', content: 'Dark' },
|
||||||
|
{ value: 'material', content: 'Material' }
|
||||||
|
],
|
||||||
|
attrs: {
|
||||||
|
'.joint-select-button-group': {
|
||||||
|
'data-tooltip': 'Change Theme',
|
||||||
|
'data-tooltip-position': 'bottom'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
init: function () {
|
||||||
|
|
||||||
|
this.themes.selected = _.findIndex(this.themes.options, { value: this.defaultTheme })
|
||||||
|
this.options.tools = [this.themes]
|
||||||
|
this.on('theme-picker:option:select', this.onThemeSelected, this)
|
||||||
|
|
||||||
|
joint.ui.Toolbar.prototype.init.apply(this, arguments)
|
||||||
|
},
|
||||||
|
|
||||||
|
onThemeSelected: function (option) {
|
||||||
|
// console.log(option, 'option')
|
||||||
|
joint.setTheme(option.value)
|
||||||
|
if (this.options.mainView) {
|
||||||
|
this.adjustAppToTheme(this.options.mainView, option.value)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
adjustAppToTheme: function (app, theme) {
|
||||||
|
|
||||||
|
// Material design has no grid shown.
|
||||||
|
if (theme === 'material') {
|
||||||
|
app.paper.options.drawGrid = false
|
||||||
|
app.paper.clearGrid()
|
||||||
|
} else {
|
||||||
|
app.paper.options.drawGrid = true
|
||||||
|
app.paper.drawGrid()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
})(_, joint)
|
||||||
|
|
||||||
|
export { ThemePicker }
|
||||||
197
dwt-circuit/webpack-circuit/src/pages/draw/config/toolbar.js
Normal file
197
dwt-circuit/webpack-circuit/src/pages/draw/config/toolbar.js
Normal file
@ -0,0 +1,197 @@
|
|||||||
|
// 画板顶部“撤销”、“导出SVG”。。。等一系列按钮
|
||||||
|
var toolbar;
|
||||||
|
|
||||||
|
(function () {
|
||||||
|
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
toolbar = {
|
||||||
|
groups: {
|
||||||
|
'diagram-creat': { index: 1 },
|
||||||
|
'diagram-edit': { index: 2 },
|
||||||
|
'diagram-toggle': { index: 3 },
|
||||||
|
'undo-redo': { index: 4 },
|
||||||
|
'clear': { index: 5 },
|
||||||
|
'export': { index: 6 },
|
||||||
|
'fullscreen': { index: 7 },
|
||||||
|
'zoom': { index: 8 },
|
||||||
|
'grid': { index: 9 },
|
||||||
|
'snapline': { index: 10 },
|
||||||
|
'draw': { index: 11 },
|
||||||
|
'save': { index: 12 },
|
||||||
|
'delete': { index: 13 },
|
||||||
|
'preview': { index: 14 },
|
||||||
|
},
|
||||||
|
tools: [
|
||||||
|
{
|
||||||
|
type: 'checkbox',
|
||||||
|
name: 'draw',
|
||||||
|
group: 'draw',
|
||||||
|
label: '绘图',
|
||||||
|
value: false,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'draw-switch'
|
||||||
|
},
|
||||||
|
label: {
|
||||||
|
'data-tooltip': '点击画图',
|
||||||
|
'data-tooltip-position': 'top',
|
||||||
|
'data-tooltip-position-selector': '.toolbar-container'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'undo',
|
||||||
|
name: 'undo',
|
||||||
|
group: 'undo-redo',
|
||||||
|
attrs: {
|
||||||
|
button: {
|
||||||
|
'data-tooltip': '撤销',
|
||||||
|
'data-tooltip-position': 'top',
|
||||||
|
'data-tooltip-position-selector': '.toolbar-container'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'redo',
|
||||||
|
name: 'redo',
|
||||||
|
group: 'undo-redo',
|
||||||
|
attrs: {
|
||||||
|
button: {
|
||||||
|
'data-tooltip': '重做',
|
||||||
|
'data-tooltip-position': 'top',
|
||||||
|
'data-tooltip-position-selector': '.toolbar-container'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
name: 'clear',
|
||||||
|
text: '清空',
|
||||||
|
group: 'clear',
|
||||||
|
attrs: {
|
||||||
|
button: {
|
||||||
|
id: 'btn-clear',
|
||||||
|
'data-tooltip': '清空画布',
|
||||||
|
'data-tooltip-position': 'top',
|
||||||
|
'data-tooltip-position-selector': '.toolbar-container'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'label',
|
||||||
|
name: 'zoom-slider-label',
|
||||||
|
group: 'zoom',
|
||||||
|
text: '画布缩放:'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'zoom-slider',
|
||||||
|
name: 'zoom-slider',
|
||||||
|
group: 'zoom'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'label',
|
||||||
|
name: 'grid-size-label',
|
||||||
|
group: 'grid',
|
||||||
|
text: '网格密度:'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'range',
|
||||||
|
name: 'grid-size',
|
||||||
|
group: 'grid',
|
||||||
|
text: 'Grid size:',
|
||||||
|
min: 1,
|
||||||
|
max: 50,
|
||||||
|
step: 1,
|
||||||
|
value: 10
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'separator',
|
||||||
|
group: 'snapline'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
type: 'checkbox',
|
||||||
|
name: 'snapline',
|
||||||
|
group: 'snapline',
|
||||||
|
label: '辅助线:',
|
||||||
|
value: true,
|
||||||
|
attrs: {
|
||||||
|
input: {
|
||||||
|
id: 'snapline-switch'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 全屏
|
||||||
|
{
|
||||||
|
type: 'fullscreen',
|
||||||
|
name: 'fullscreen',
|
||||||
|
group: 'fullscreen',
|
||||||
|
attrs: {
|
||||||
|
button: {
|
||||||
|
'data-tooltip': '全屏',
|
||||||
|
'data-tooltip-position': 'top',
|
||||||
|
'data-tooltip-position-selector': '.toolbar-container'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 新建画布
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
name: 'diagram-creat',
|
||||||
|
text: '新建画布',
|
||||||
|
group: 'diagram-creat'
|
||||||
|
},
|
||||||
|
// 编辑画布
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
name: 'diagram-edit',
|
||||||
|
text: '编辑画布',
|
||||||
|
group: 'diagram-edit'
|
||||||
|
},
|
||||||
|
// 画布列表
|
||||||
|
// {
|
||||||
|
// type: 'select-box',
|
||||||
|
// width: 150,
|
||||||
|
// options: [
|
||||||
|
// // {value: '0', content: '画布1'},
|
||||||
|
// // {value: '1', content: '画布2'},
|
||||||
|
// // {value: '2', content: '画布3'},
|
||||||
|
// ],
|
||||||
|
// group: 'diagram-list',
|
||||||
|
// placeholder: '画布列表',
|
||||||
|
// selected: -1,
|
||||||
|
// name: 'diagram-list'
|
||||||
|
// },
|
||||||
|
// 切换画布
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
name: 'diagram-toggle',
|
||||||
|
text: '画布切换',
|
||||||
|
group: 'diagram-toggle'
|
||||||
|
},
|
||||||
|
// 保存
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
name: 'save',
|
||||||
|
text: '保存画布',
|
||||||
|
group: 'save'
|
||||||
|
},
|
||||||
|
// 删除
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
name: 'delete',
|
||||||
|
text: '删除画布',
|
||||||
|
group: 'delete'
|
||||||
|
},
|
||||||
|
// 预览
|
||||||
|
{
|
||||||
|
type: 'button',
|
||||||
|
name: 'preview',
|
||||||
|
text: '预览',
|
||||||
|
group: 'preview'
|
||||||
|
},
|
||||||
|
]
|
||||||
|
};
|
||||||
|
})();
|
||||||
|
|
||||||
|
export { toolbar };
|
||||||
32
dwt-circuit/webpack-circuit/src/pages/draw/draw.html
Normal file
32
dwt-circuit/webpack-circuit/src/pages/draw/draw.html
Normal file
@ -0,0 +1,32 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<title>一次接线图绘制</title>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div id="app">
|
||||||
|
<div class="app-header">
|
||||||
|
<div class="app-title">
|
||||||
|
<h1>绘图</h1>
|
||||||
|
</div>
|
||||||
|
<!-- 头部工具栏 -->
|
||||||
|
<div class="toolbar-container"></div>
|
||||||
|
</div>
|
||||||
|
<div class="app-body">
|
||||||
|
<!-- 拖拽组件 -->
|
||||||
|
<div class="stencil-container"></div>
|
||||||
|
<!-- 画布 -->
|
||||||
|
<div class="paper-container"></div>
|
||||||
|
<!-- 监听器 元素操作 -->
|
||||||
|
<div class="inspector-container">
|
||||||
|
</div>
|
||||||
|
<!-- 导航预览区域 -->
|
||||||
|
<!-- <div class="navigator-container"></div> -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
34
dwt-circuit/webpack-circuit/src/pages/draw/index.css
Normal file
34
dwt-circuit/webpack-circuit/src/pages/draw/index.css
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
@import '../../assets/css/common.css';
|
||||||
|
@import '../../assets/css/rappid.css';
|
||||||
|
@import '../../assets/css/style.css';
|
||||||
|
@import '../../assets/css/theme-picker.css';
|
||||||
|
@import '../../assets/css/style.dark.css';
|
||||||
|
@import '../../assets/css/style.material.css';
|
||||||
|
@import '../../assets/css/style.modern.css';
|
||||||
|
/* .tag-group {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.tag-group .title{
|
||||||
|
white-space: nowrap;
|
||||||
|
}
|
||||||
|
.tag-group .tag-input{
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
.item {
|
||||||
|
padding-bottom: 20px;
|
||||||
|
}
|
||||||
|
.add{
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
|
.tagEditor{
|
||||||
|
width: 500px;
|
||||||
|
height: 500px;
|
||||||
|
} */
|
||||||
|
.inspector-container {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0px; /* navigator height */
|
||||||
|
width: 240px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
}
|
||||||
28
dwt-circuit/webpack-circuit/src/pages/draw/index.js
Normal file
28
dwt-circuit/webpack-circuit/src/pages/draw/index.js
Normal file
@ -0,0 +1,28 @@
|
|||||||
|
|
||||||
|
import './index.css'
|
||||||
|
import './template/creat-diagram-dialog/style.css'
|
||||||
|
import './template/edit-diagram-dialog/style.css'
|
||||||
|
import './template/toggle-diagram-dialog/style.css'
|
||||||
|
|
||||||
|
require ('./config/sample-graphs')
|
||||||
|
import { App } from './config/main'
|
||||||
|
// import { ThemePicker } from './config/theme-picker'
|
||||||
|
require ('./config/joint.shapes.app')
|
||||||
|
require ('./config/navigator')
|
||||||
|
|
||||||
|
import SubPub from './config/subscribe-publish'
|
||||||
|
|
||||||
|
|
||||||
|
// App.ThemePicker = ThemePicker
|
||||||
|
|
||||||
|
// 全局设置主题
|
||||||
|
joint.setTheme('dark');
|
||||||
|
let app = new App.MainView({ el: document.getElementById('app') });
|
||||||
|
// themePicker = new App.ThemePicker({ mainView: app });
|
||||||
|
// themePicker.render().$el.appendTo(document.body);
|
||||||
|
window.addEventListener('load', function() {
|
||||||
|
let graph = localStorage.getItem('graph')
|
||||||
|
if(!graph) return
|
||||||
|
// app.graph.fromJSON(JSON.parse(App.config.sampleGraphs.emergencyProcedure));
|
||||||
|
app.graph.fromJSON(JSON.parse(graph));
|
||||||
|
});
|
||||||
@ -0,0 +1,68 @@
|
|||||||
|
import request from '../../../utils/request'
|
||||||
|
|
||||||
|
let model = {}
|
||||||
|
|
||||||
|
|
||||||
|
// 保存画布
|
||||||
|
model.addCircuit = (data) => {
|
||||||
|
return request({
|
||||||
|
url: '/ems/rest/circuit/add',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取画布列表
|
||||||
|
model.getCircuitList = (query) => {
|
||||||
|
return request({
|
||||||
|
url: '/ems/rest/circuit/list',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除画布
|
||||||
|
model.delCircuit = (data) => {
|
||||||
|
return request({
|
||||||
|
url: '/ems/rest/circuit/remove',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 修改画布
|
||||||
|
model.editCircuit = (data) => {
|
||||||
|
return request({
|
||||||
|
url: '/ems/rest/circuit/edit',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询画布详情
|
||||||
|
model.getCircuitDetail = (query) => {
|
||||||
|
return request({
|
||||||
|
url: '/ems/rest/circuit/detail',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取变量列表
|
||||||
|
model.getTagList = (query) => {
|
||||||
|
return request({
|
||||||
|
url: '/ems/rest/var/page',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取配电室列表
|
||||||
|
model.getPrList = (query) => {
|
||||||
|
return request({
|
||||||
|
url: '/ems/rest/power/room/list',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
export { model }
|
||||||
@ -0,0 +1,198 @@
|
|||||||
|
import { subscribe, publish, saveDiagram } from '../../common/common.js'
|
||||||
|
|
||||||
|
import { creatDialogTmp } from './tmp'
|
||||||
|
import { model } from '../../service/service'
|
||||||
|
|
||||||
|
let store
|
||||||
|
|
||||||
|
function getStore () {
|
||||||
|
store = window.Store
|
||||||
|
}
|
||||||
|
|
||||||
|
subscribe(getStore)
|
||||||
|
|
||||||
|
function creatDiagramClick () {
|
||||||
|
// 创建弹框
|
||||||
|
let dialog = new joint.ui.Dialog({
|
||||||
|
width: '20%',
|
||||||
|
title: '新建画布',
|
||||||
|
content: '<div style="text-align: center;">是否保存当前画布？</div>',
|
||||||
|
type: 'neutral',
|
||||||
|
buttons: [
|
||||||
|
{ action: 'confirm', content: '保存', position: 'right' },
|
||||||
|
{ action: 'cancel', content: '不保存', position: 'right' },
|
||||||
|
],
|
||||||
|
draggable: true,
|
||||||
|
closeButton: true,
|
||||||
|
|
||||||
|
})
|
||||||
|
dialog.open()
|
||||||
|
|
||||||
|
dialog.on({
|
||||||
|
// "保存"
|
||||||
|
'action:confirm': function () {
|
||||||
|
saveDiagram(creatDiagram.bind(this))
|
||||||
|
|
||||||
|
dialog.close()
|
||||||
|
},
|
||||||
|
// "不保存"
|
||||||
|
'action:cancel': function () {
|
||||||
|
dialog.close()
|
||||||
|
store.graph.clear()
|
||||||
|
console.log(store, 'store')
|
||||||
|
creatDiagram()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
function creatDiagram () {
|
||||||
|
|
||||||
|
// 创建弹框
|
||||||
|
let dialog = new joint.ui.Dialog({
|
||||||
|
width: '50%',
|
||||||
|
title: '新建画布',
|
||||||
|
content: creatDialogTmp,
|
||||||
|
type: 'neutral',
|
||||||
|
buttons: [
|
||||||
|
{ action: 'confirm', content: '保存', position: 'right' },
|
||||||
|
{ action: 'cancel', content: '取消', position: 'right' },
|
||||||
|
],
|
||||||
|
draggable: true,
|
||||||
|
closeButton: true,
|
||||||
|
|
||||||
|
})
|
||||||
|
dialog.open()
|
||||||
|
// 获取并渲染配电室下拉列表
|
||||||
|
let prlistBox = $('#creat-diagram-prlist')
|
||||||
|
let selectBox = new joint.ui.SelectBox({
|
||||||
|
width: 200,
|
||||||
|
placeholder: '配电室列表',
|
||||||
|
selected: -1,
|
||||||
|
options: []
|
||||||
|
})
|
||||||
|
prlistBox.append(selectBox.render().el)
|
||||||
|
getPrList(prlistBox)
|
||||||
|
|
||||||
|
// 绑定事件
|
||||||
|
$('.creat-diagram-dialog .color-inp').on('change', function () {
|
||||||
|
$('.creat-diagram-dialog .color-sel').val($(this).val())
|
||||||
|
})
|
||||||
|
|
||||||
|
$('.creat-diagram-dialog .color-sel').on('change', function () {
|
||||||
|
$('.creat-diagram-dialog .color-inp').val($(this).val())
|
||||||
|
})
|
||||||
|
|
||||||
|
dialog.on({
|
||||||
|
// "保存"
|
||||||
|
'action:confirm': function () {
|
||||||
|
store.currentCirId = null
|
||||||
|
|
||||||
|
store.paperAttr.circuitName = $('.creat-diagram-dialog .name').val()
|
||||||
|
store.paperAttr.width = $('.creat-diagram-dialog .width').val()
|
||||||
|
store.paperAttr.height = $('.creat-diagram-dialog .height').val()
|
||||||
|
store.paperAttr.color = $('.creat-diagram-dialog .color-inp').val()
|
||||||
|
store.paperAttr.prId = store.prInf.prId
|
||||||
|
store.paperAttr.prName = store.prInf.prName
|
||||||
|
|
||||||
|
store.varJson = null
|
||||||
|
|
||||||
|
store.graph.clear() // 清空画布
|
||||||
|
|
||||||
|
store.commandManager.reset() // 重置 上一步、下一步
|
||||||
|
|
||||||
|
publish()
|
||||||
|
|
||||||
|
saveDiagram()
|
||||||
|
|
||||||
|
dialog.close()
|
||||||
|
|
||||||
|
// if (!checkPaperAttr()) return
|
||||||
|
|
||||||
|
// // 调用新建接口
|
||||||
|
// let data = {
|
||||||
|
// prId: store.paperAttr.prId,
|
||||||
|
// prName: store.paperAttr.prName,
|
||||||
|
// circuitName: store.paperAttr.circuitName,
|
||||||
|
// paperJson: JSON.stringify(store.paperAttr),
|
||||||
|
// varJson: JSON.stringify(store.varJson),
|
||||||
|
// graphJson: JSON.stringify(store.graph.toJSON())
|
||||||
|
// }
|
||||||
|
|
||||||
|
// model.addCircuit(data).then(res => {
|
||||||
|
// if (res.code && res.code == 200) {
|
||||||
|
// // 更新画布对应的属性
|
||||||
|
// store.paper.drawBackground({
|
||||||
|
// color: store.paperAttr.color
|
||||||
|
// })
|
||||||
|
// store.paper.setDimensions(store.paperAttr.width, store.paperAttr.height)
|
||||||
|
|
||||||
|
// store.currentCirId = res.body;
|
||||||
|
|
||||||
|
// (new joint.ui.FlashMessage({
|
||||||
|
// type: 'success',
|
||||||
|
// closeAnimation: {delay: 2000},
|
||||||
|
// width: 100,
|
||||||
|
// modal: true,
|
||||||
|
// title: '提示',
|
||||||
|
// content: '保存成功'
|
||||||
|
// })).open()
|
||||||
|
|
||||||
|
// dialog.close()
|
||||||
|
|
||||||
|
// publish()
|
||||||
|
// } else {
|
||||||
|
// (new joint.ui.FlashMessage({
|
||||||
|
// type: 'alert',
|
||||||
|
// closeAnimation: {delay: 2000},
|
||||||
|
// width: 100,
|
||||||
|
// modal: true,
|
||||||
|
// title: '提示',
|
||||||
|
// content: '保存失败'
|
||||||
|
// })).open()
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
|
||||||
|
},
|
||||||
|
// "取消"
|
||||||
|
'action:cancel': function () {
|
||||||
|
dialog.close()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function getPrList (container) {
|
||||||
|
model.getPrList().then(res => {
|
||||||
|
if (res.code && res.code == 200) {
|
||||||
|
renderPrList(res.body, container)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
function renderPrList (prList, container) {
|
||||||
|
let optionArr = []
|
||||||
|
|
||||||
|
prList.forEach((pr, index) => {
|
||||||
|
optionArr.push({ value: pr.prId, content: pr.prName })
|
||||||
|
})
|
||||||
|
|
||||||
|
let prListSelectBox = new joint.ui.SelectBox({
|
||||||
|
width: 200,
|
||||||
|
placeholder: '配电室列表',
|
||||||
|
selected: -1,
|
||||||
|
options: optionArr
|
||||||
|
})
|
||||||
|
container.html('')
|
||||||
|
container.append(prListSelectBox.render().el)
|
||||||
|
|
||||||
|
// 绑定事件
|
||||||
|
prListSelectBox.on('option:select', (arg) => {
|
||||||
|
// 将当前选择的配电室临时保存
|
||||||
|
store.prInf.prId = arg.value
|
||||||
|
store.prInf.prName = arg.content
|
||||||
|
|
||||||
|
publish()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export { creatDiagramClick }
|
||||||
@ -0,0 +1,25 @@
|
|||||||
|
.creat-diagram-dialog {
|
||||||
|
padding: 10px 20px;
|
||||||
|
}
|
||||||
|
.creat-diagram-dialog li {
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
}
|
||||||
|
.creat-diagram-dialog li.pr-list {
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.creat-diagram-dialog input {
|
||||||
|
border: none;
|
||||||
|
border-bottom: 1px solid #aaa;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.creat-diagram-dialog input[type=color] {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
.creat-diagram-dialog span {
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
@ -0,0 +1,19 @@
|
|||||||
|
let creatDialogTmp = `
|
||||||
|
<ul class="creat-diagram-dialog">
|
||||||
|
<li class="pr-list">
|
||||||
|
<span>所属配电室：</span>
|
||||||
|
<span id="creat-diagram-prlist"></span>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<label><span>画布名：</span> <input type="text" class="name" placeholder="请输入画布名"/></label>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span>画布大小：</span> <input type="text" class="width" placeholder="请输入宽度" value="1920"/> × <input type="text" class="height" placeholder="请输入高度" value="1080"/> （单位：像素）
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span>画布背景色：</span> <input type="text" class="color-inp" placeholder="请输入颜色，如：#60a3a4" value="#60a3a4"/> <input type="color" class="color-sel" value="#60a3a4">
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
`
|
||||||
|
|
||||||
|
export { creatDialogTmp }
|
||||||
@ -0,0 +1,177 @@
|
|||||||
|
import { subscribe, publish, saveDiagram } from '../../common/common.js'
|
||||||
|
|
||||||
|
import { editDialogTmp } from './tmp'
|
||||||
|
import { model } from '../../service/service'
|
||||||
|
|
||||||
|
let store
|
||||||
|
|
||||||
|
function getStore() {
|
||||||
|
store = window.Store
|
||||||
|
}
|
||||||
|
|
||||||
|
subscribe(getStore)
|
||||||
|
|
||||||
|
function editDiagramClick() {
|
||||||
|
// 创建弹框
|
||||||
|
let dialog = new joint.ui.Dialog({
|
||||||
|
width: '50%',
|
||||||
|
title: '编辑画布',
|
||||||
|
content: editDialogTmp,
|
||||||
|
type: 'neutral',
|
||||||
|
buttons: [
|
||||||
|
{ action: 'confirm', content: '保存', position: 'right' },
|
||||||
|
{ action: 'cancel', content: '取消', position: 'right' },
|
||||||
|
],
|
||||||
|
draggable: true,
|
||||||
|
closeButton: true,
|
||||||
|
})
|
||||||
|
dialog.open()
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
$('.edit-diagram-dialog #edit-diagram-prName').text(store.paperAttr.prName)
|
||||||
|
$('.edit-diagram-dialog .name').val(store.paperAttr.circuitName)
|
||||||
|
$('.edit-diagram-dialog .width').val(store.paperAttr.width)
|
||||||
|
$('.edit-diagram-dialog .height').val(store.paperAttr.height)
|
||||||
|
$('.edit-diagram-dialog .color-inp').val(store.paperAttr.color)
|
||||||
|
$('.edit-diagram-dialog .color-sel').val(store.paperAttr.color)
|
||||||
|
|
||||||
|
// 事件绑定
|
||||||
|
$('#edit-diagram-btn').on('click', () => {
|
||||||
|
|
||||||
|
if ($('#edit-diagram-prlist').css('display') == 'block') {
|
||||||
|
$('#edit-diagram-prlist').css('display', 'none')
|
||||||
|
$('#edit-diagram-btn').text('修改')
|
||||||
|
} else {
|
||||||
|
$('#edit-diagram-prlist').css('display', 'block')
|
||||||
|
$('#edit-diagram-btn').text('取消')
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
$('.edit-diagram-dialog .color-inp').on('change', function () {
|
||||||
|
$('.edit-diagram-dialog .color-sel').val($(this).val())
|
||||||
|
})
|
||||||
|
|
||||||
|
$('.edit-diagram-dialog .color-sel').on('change', function () {
|
||||||
|
$('.edit-diagram-dialog .color-inp').val($(this).val())
|
||||||
|
})
|
||||||
|
|
||||||
|
// 获取并渲染配电室下拉列表
|
||||||
|
let prlistBox = $('#edit-diagram-prlist')
|
||||||
|
let selectBox = new joint.ui.SelectBox({
|
||||||
|
width: 200,
|
||||||
|
placeholder: '配电室列表',
|
||||||
|
selected: -1,
|
||||||
|
options: []
|
||||||
|
})
|
||||||
|
prlistBox.append(selectBox.render().el)
|
||||||
|
getPrList(prlistBox)
|
||||||
|
|
||||||
|
dialog.on({
|
||||||
|
// 保存
|
||||||
|
'action:confirm': function () {
|
||||||
|
store.paperAttr.circuitName = $('.edit-diagram-dialog .name').val()
|
||||||
|
store.paperAttr.width = $('.edit-diagram-dialog .width').val()
|
||||||
|
store.paperAttr.height = $('.edit-diagram-dialog .height').val()
|
||||||
|
store.paperAttr.color = $('.edit-diagram-dialog .color-inp').val()
|
||||||
|
store.paperAttr.prId = store.prInf.prId
|
||||||
|
store.paperAttr.prName = store.prInf.prName
|
||||||
|
|
||||||
|
saveDiagram()
|
||||||
|
|
||||||
|
dialog.close()
|
||||||
|
|
||||||
|
// if (!checkPaperAttr()) return
|
||||||
|
|
||||||
|
// // 调用新建接口
|
||||||
|
// let data = {
|
||||||
|
// circuitId: store.currentCirId,
|
||||||
|
// prId: store.paperAttr.prId,
|
||||||
|
// prName: store.paperAttr.prName,
|
||||||
|
// circuitName: store.paperAttr.circuitName,
|
||||||
|
// paperJson: JSON.stringify(store.paperAttr),
|
||||||
|
// varJson: JSON.stringify(store.varJson),
|
||||||
|
// graphJson: JSON.stringify(store.graph.toJSON())
|
||||||
|
// }
|
||||||
|
|
||||||
|
// model.editCircuit(data).then(res => {
|
||||||
|
// if (res.code && res.code == 200) {
|
||||||
|
// // 更新画布对应的属性
|
||||||
|
// store.paper.drawBackground({
|
||||||
|
// color: store.paperAttr.color
|
||||||
|
// })
|
||||||
|
// store.paper.setDimensions(store.paperAttr.width, store.paperAttr.height)
|
||||||
|
|
||||||
|
// $('.edit-diagram-dialog #edit-diagram-prName').text(store.paperAttr.prName);
|
||||||
|
|
||||||
|
// (new joint.ui.FlashMessage({
|
||||||
|
// type: 'success',
|
||||||
|
// closeAnimation: {delay: 2000},
|
||||||
|
// width: 100,
|
||||||
|
// modal: true,
|
||||||
|
// title: '提示',
|
||||||
|
// content: '编辑成功'
|
||||||
|
// })).open()
|
||||||
|
|
||||||
|
// dialog.close()
|
||||||
|
|
||||||
|
// publish()
|
||||||
|
// } else {
|
||||||
|
// (new joint.ui.FlashMessage({
|
||||||
|
// type: 'alert',
|
||||||
|
// closeAnimation: {delay: 2000},
|
||||||
|
// width: 100,
|
||||||
|
// modal: true,
|
||||||
|
// title: '提示',
|
||||||
|
// content: '保存失败'
|
||||||
|
// })).open()
|
||||||
|
// }
|
||||||
|
// })
|
||||||
|
|
||||||
|
},
|
||||||
|
// 取消
|
||||||
|
'action:cancel': function () {
|
||||||
|
dialog.close()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取配电室列表
|
||||||
|
function getPrList(container) {
|
||||||
|
model.getPrList().then(res => {
|
||||||
|
if (res.code && res.code == 200) {
|
||||||
|
renderPrList(res.body, container)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 渲染配电室列表
|
||||||
|
function renderPrList(prList, container) {
|
||||||
|
let optionArr = []
|
||||||
|
|
||||||
|
prList.forEach((pr, index) => {
|
||||||
|
optionArr.push({value: pr.prId, content: pr.prName})
|
||||||
|
})
|
||||||
|
|
||||||
|
let prListSelectBox = new joint.ui.SelectBox({
|
||||||
|
width: 200,
|
||||||
|
placeholder: '配电室列表',
|
||||||
|
selected: -1,
|
||||||
|
options: optionArr
|
||||||
|
})
|
||||||
|
container.html('')
|
||||||
|
container.append(prListSelectBox.render().el)
|
||||||
|
|
||||||
|
// 绑定事件
|
||||||
|
prListSelectBox.on('option:select', (arg) => {
|
||||||
|
// 将当前选择的配电室临时保存
|
||||||
|
store.prInf.prId = arg.value
|
||||||
|
store.prInf.prName = arg.content
|
||||||
|
|
||||||
|
$('#edit-diagram-prName').html(arg.content)
|
||||||
|
|
||||||
|
publish()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export { editDiagramClick }
|
||||||
@ -0,0 +1,39 @@
|
|||||||
|
.edit-diagram-dialog {
|
||||||
|
padding: 10px 20px;
|
||||||
|
}
|
||||||
|
.edit-diagram-dialog li {
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
}
|
||||||
|
.edit-diagram-dialog li.pr-list {
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.edit-diagram-dialog input {
|
||||||
|
border: none;
|
||||||
|
border-bottom: 1px solid #aaa;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.edit-diagram-dialog input[type=color] {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
.edit-diagram-dialog span {
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
#edit-diagram-prName {
|
||||||
|
padding: 0 50px;
|
||||||
|
border-bottom: 1px solid #aaa;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
#edit-diagram-btn {
|
||||||
|
color: #0d1cf8;
|
||||||
|
font-size: 14px;
|
||||||
|
border-bottom: 1px solid #0d1cf8;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
#edit-diagram-prlist{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
@ -0,0 +1,21 @@
|
|||||||
|
let editDialogTmp = `
|
||||||
|
<ul class="edit-diagram-dialog">
|
||||||
|
<li class="pr-list">
|
||||||
|
<span>所属配电室：</span>
|
||||||
|
<span id="edit-diagram-prName">（无）</span>
|
||||||
|
<span id="edit-diagram-btn">修改</span>
|
||||||
|
<span id="edit-diagram-prlist"></span>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<label><span>画布名：</span> <input type="text" class="name" placeholder="请输入画布名"/></label>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span>画布大小：</span> <input type="text" class="width" placeholder="请输入宽度" value="1920"/> × <input type="text" class="height" placeholder="请输入高度" value="1080"/> （单位：像素）
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span>画布背景色：</span> <input type="text" class="color-inp" placeholder="请输入颜色，如：#60a3a4" value="#60a3a4"/> <input type="color" class="color-sel" value="#60a3a4">
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
`
|
||||||
|
|
||||||
|
export { editDialogTmp }
|
||||||
@ -0,0 +1,63 @@
|
|||||||
|
|
||||||
|
/* 变量选择弹框 */
|
||||||
|
|
||||||
|
.tag-dialog-container .header{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: 1px solid #6a6c8b;
|
||||||
|
}
|
||||||
|
.tag-dialog-container .btn-group{
|
||||||
|
margin: 0 20px;
|
||||||
|
width: 150px;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.tag-dialog-container .btn{
|
||||||
|
height: 30px;
|
||||||
|
width: 50%;
|
||||||
|
padding: 0 15px;
|
||||||
|
background: #fff;
|
||||||
|
outline: none;
|
||||||
|
border: 1px solid #b2b2b2;
|
||||||
|
cursor: pointer;
|
||||||
|
line-height: 30px;
|
||||||
|
display: inline-block;
|
||||||
|
text-align: center;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.tag-dialog-container .btn:hover{
|
||||||
|
background-color:#6a6c8b ;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.tag-dialog-container .active{
|
||||||
|
background-color:#6a6c8b ;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
.tag-dialog-container .search-box{
|
||||||
|
line-height: 30px;
|
||||||
|
border-radius: 3px;
|
||||||
|
padding: 0 5px;
|
||||||
|
}
|
||||||
|
.tag-dialog-container .content {
|
||||||
|
padding: 10px;
|
||||||
|
|
||||||
|
}
|
||||||
|
.tag-dialog-container .radio-selector{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
max-height: 300px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
.tag-dialog-container .radio-selector .item {
|
||||||
|
margin: 10px ;
|
||||||
|
width: 280px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selectbox{
|
||||||
|
max-height: 300px;
|
||||||
|
overflow-y: auto;
|
||||||
|
}
|
||||||
|
.search-box {
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
@ -0,0 +1,177 @@
|
|||||||
|
import { renderTagDialog } from './tmp'
|
||||||
|
import { model } from '../../service/service'
|
||||||
|
|
||||||
|
|
||||||
|
var tagDialogModel = {
|
||||||
|
keyword: '',
|
||||||
|
// 初次打开 获取的变量内容
|
||||||
|
originContent: '',
|
||||||
|
// 生成的弹框变量内容
|
||||||
|
content: '',
|
||||||
|
// 配电室列表，配电室中的一个配电室id,变量类型AI:1,DI:2
|
||||||
|
prList: [],
|
||||||
|
somePrId: '',
|
||||||
|
varType: 1,
|
||||||
|
selectedVarYype: null,
|
||||||
|
// 选中的变量
|
||||||
|
selectedTagName: '',
|
||||||
|
init: function () {
|
||||||
|
this.getPrList()
|
||||||
|
},
|
||||||
|
// 获取配电室列表
|
||||||
|
getPrList: function () {
|
||||||
|
model.getPrList().then(res => {
|
||||||
|
res.body.forEach(item => {
|
||||||
|
let prOption = {}
|
||||||
|
if (item.prId === 5) {
|
||||||
|
prOption = {
|
||||||
|
content: item.prName,
|
||||||
|
value: item.prId,
|
||||||
|
selected: true
|
||||||
|
}
|
||||||
|
} else {
|
||||||
|
prOption = {
|
||||||
|
content: item.prName,
|
||||||
|
value: item.prId
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
tagDialogModel.prList.push(prOption)
|
||||||
|
})
|
||||||
|
// tagDialogModel.somePrId = res.body[0]['prId'];
|
||||||
|
}).then(() => {
|
||||||
|
// 获取配电室列表 同时选择一个配电室 获取其点
|
||||||
|
tagDialogModel.somePrId = 5
|
||||||
|
tagDialogModel.getTagList()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 获取变量列表
|
||||||
|
getTagList: function (updateTagDom) {
|
||||||
|
if (!this.keyword) {
|
||||||
|
this.keyword = null
|
||||||
|
}
|
||||||
|
model.getTagList(
|
||||||
|
{
|
||||||
|
varType: tagDialogModel.varType,
|
||||||
|
page: 1,
|
||||||
|
pageSize: 9999999,
|
||||||
|
prId: tagDialogModel.somePrId,
|
||||||
|
keyword: tagDialogModel.keyword
|
||||||
|
}
|
||||||
|
).then(res => {
|
||||||
|
var allTagList = res.body.records
|
||||||
|
tagDialogModel.content = tagDialogModel.getTagDialogTmp(allTagList)
|
||||||
|
if (!updateTagDom) {
|
||||||
|
// 初次渲染弹框 生成内容
|
||||||
|
tagDialogModel.originContent = tagDialogModel.getTagDialogTmp(allTagList)
|
||||||
|
} else {
|
||||||
|
// 当变量内容改变时，重新渲染变量所在的dom
|
||||||
|
updateTagDom()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 当变量内容改变时，重新渲染变量所在的dom
|
||||||
|
updateTagDom: function (varType, prId) {
|
||||||
|
$('#tagSelectorModalContent').html(tagDialogModel.content)
|
||||||
|
|
||||||
|
}
|
||||||
|
,
|
||||||
|
// 渲染内部变量列表
|
||||||
|
getTagDialogTmp: function (allTagList) {
|
||||||
|
let str = ''
|
||||||
|
allTagList.forEach(item => {
|
||||||
|
str += ` <div class="item">
|
||||||
|
<input type="radio" name="tag-list" class="tag-item" value="${item.varName}" data-type="${item.varType}" id="${item.varName}">
|
||||||
|
<label for="${item.varName}" title="${item.varCnName}">${item.varName}</label>
|
||||||
|
</div>`
|
||||||
|
})
|
||||||
|
return str
|
||||||
|
},
|
||||||
|
createTagDialog: function (applyCallback, cancelCallback) {
|
||||||
|
if (dialog) return
|
||||||
|
// 每次打开dialog 重置默认的配电室
|
||||||
|
tagDialogModel.somePrId = 5
|
||||||
|
var dialog = new joint.ui.Dialog({
|
||||||
|
width: '50%',
|
||||||
|
title: '选择变量',
|
||||||
|
draggable: true,
|
||||||
|
type: 'neutral',
|
||||||
|
closeButton: false,
|
||||||
|
content: renderTagDialog(tagDialogModel.originContent),
|
||||||
|
buttons: [{
|
||||||
|
content: '取消',
|
||||||
|
action: 'cancel'
|
||||||
|
}, {
|
||||||
|
content: '确定',
|
||||||
|
action: 'apply'
|
||||||
|
}]
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
dialog.on({
|
||||||
|
'action:cancel': function () {
|
||||||
|
//inspector.remove();
|
||||||
|
cancelCallback && cancelCallback(`${tagDialogModel.selectedTagName}/${tagDialogModel.selectedVarYype}`)
|
||||||
|
|
||||||
|
dialog.close()
|
||||||
|
},
|
||||||
|
'action:apply': function () {
|
||||||
|
|
||||||
|
applyCallback && applyCallback(`${tagDialogModel.selectedTagName}/${tagDialogModel.selectedVarYype}`)
|
||||||
|
dialog.close()
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
dialog.open()
|
||||||
|
// 生成并插入配电室选择下拉框
|
||||||
|
var selectBox = new joint.ui.SelectBox({
|
||||||
|
width: 200,
|
||||||
|
openPolicy: 'below',
|
||||||
|
selectBoxOptionsClass: 'selectbox',
|
||||||
|
options: tagDialogModel.prList
|
||||||
|
})
|
||||||
|
document.getElementById('prBox').appendChild(selectBox.render().el)
|
||||||
|
|
||||||
|
// 选中变量时候的操作
|
||||||
|
$('body').on('click', 'input[type="radio"]', function (e) {
|
||||||
|
e.stopPropagation()
|
||||||
|
if (this.checked) {
|
||||||
|
tagDialogModel.selectedTagName = $(this).val()
|
||||||
|
tagDialogModel.selectedVarYype = $(this).data('type')
|
||||||
|
$('#selectedTag').text(tagDialogModel.selectedTagName)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
// 点击变量类型按钮
|
||||||
|
$('.varTypeBtn').click(function () {
|
||||||
|
$('.varTypeBtn').removeClass('active')
|
||||||
|
$(this).addClass('active')
|
||||||
|
tagDialogModel.varType = $(this).val()
|
||||||
|
tagDialogModel.getTagList(tagDialogModel.updateTagDom)
|
||||||
|
})
|
||||||
|
// 切换配电室
|
||||||
|
selectBox.on({
|
||||||
|
'option:select': function () {
|
||||||
|
tagDialogModel.somePrId = selectBox.getSelectionValue()
|
||||||
|
tagDialogModel.getTagList(tagDialogModel.updateTagDom)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
$('#searchValue').on('input', function () {
|
||||||
|
tagDialogModel.keyword = $(this).val()
|
||||||
|
tagDialogModel.getTagList(tagDialogModel.updateTagDom)
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
};
|
||||||
|
|
||||||
|
(function () {
|
||||||
|
tagDialogModel.init()
|
||||||
|
})()
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
export let createTagDialog = tagDialogModel.createTagDialog
|
||||||
@ -0,0 +1,23 @@
|
|||||||
|
|
||||||
|
// 变量选择 modal
|
||||||
|
let renderTagDialog = function(listDom) {
|
||||||
|
return `<div class="tag-dialog-container">
|
||||||
|
<div class="header">
|
||||||
|
<div class="tag" >选择变量: <span id="selectedTag"></span></div>
|
||||||
|
<div class="btn-group">
|
||||||
|
<button class="btn varTypeBtn active" value="1">AI</button>
|
||||||
|
<button class="btn varTypeBtn" value="2">DI</button>
|
||||||
|
</div>
|
||||||
|
<div id="prBox"></div>
|
||||||
|
<input type="text" class="search-box" id="searchValue" placeholder="输入关键字搜索变量">
|
||||||
|
</div>
|
||||||
|
<div class="content" >
|
||||||
|
<div class="radio-selector" id="tagSelectorModalContent">
|
||||||
|
${listDom}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>`
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export {renderTagDialog }
|
||||||
@ -0,0 +1,221 @@
|
|||||||
|
import { subscribe, publish, saveDiagram, renderParperById } from '../../common/common.js'
|
||||||
|
|
||||||
|
import { toggleDialogTmp } from './tmp'
|
||||||
|
import { model } from '../../service/service'
|
||||||
|
|
||||||
|
let store
|
||||||
|
|
||||||
|
function getStore() {
|
||||||
|
store = window.Store
|
||||||
|
}
|
||||||
|
|
||||||
|
subscribe(getStore)
|
||||||
|
|
||||||
|
// "画布切换"点击 弹框提示保存
|
||||||
|
function toggleDiagramClick() {
|
||||||
|
// 创建弹框
|
||||||
|
let dialog = new joint.ui.Dialog({
|
||||||
|
width: '20%',
|
||||||
|
title: '画布切换',
|
||||||
|
content: '<div style="text-align: center;">是否保存当前画布？</div>',
|
||||||
|
type: 'neutral',
|
||||||
|
buttons: [
|
||||||
|
{ action: 'confirm', content: '保存', position: 'right' },
|
||||||
|
{ action: 'cancel', content: '不保存', position: 'right' },
|
||||||
|
],
|
||||||
|
draggable: true,
|
||||||
|
closeButton: true,
|
||||||
|
|
||||||
|
})
|
||||||
|
dialog.open()
|
||||||
|
|
||||||
|
dialog.on({
|
||||||
|
// "保存"
|
||||||
|
'action:confirm': function () {
|
||||||
|
saveDiagram(toggleDiagram.bind(this))
|
||||||
|
dialog.close()
|
||||||
|
},
|
||||||
|
// "不保存"
|
||||||
|
'action:cancel': function () {
|
||||||
|
dialog.close()
|
||||||
|
toggleDiagram()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// "画布切换"
|
||||||
|
function toggleDiagram() {
|
||||||
|
// 创建弹框
|
||||||
|
let dialog = new joint.ui.Dialog({
|
||||||
|
width: '50%',
|
||||||
|
title: '画布切换',
|
||||||
|
content: toggleDialogTmp,
|
||||||
|
type: 'neutral',
|
||||||
|
buttons: [
|
||||||
|
{ action: 'confirm', content: '确定', position: 'right' },
|
||||||
|
{ action: 'cancel', content: '取消', position: 'right' },
|
||||||
|
],
|
||||||
|
draggable: true,
|
||||||
|
closeButton: true,
|
||||||
|
})
|
||||||
|
dialog.open()
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
$('#toggle-diagram-prName').text(store.paperAttr.prName)
|
||||||
|
$('#toggle-diagram-circuitName').text(store.paperAttr.circuitName)
|
||||||
|
|
||||||
|
// 获取并渲染配电室下拉列表
|
||||||
|
let prlistBox = $('#toggle-diagram-prlist')
|
||||||
|
let selectBox = new joint.ui.SelectBox({
|
||||||
|
width: 200,
|
||||||
|
placeholder: '配电室列表',
|
||||||
|
selected: -1,
|
||||||
|
options: []
|
||||||
|
})
|
||||||
|
prlistBox.append(selectBox.render().el)
|
||||||
|
getPrList(prlistBox)
|
||||||
|
|
||||||
|
// 获取并渲染画布列表
|
||||||
|
let circuitlistBox = $('#toggle-diagram-circuitList')
|
||||||
|
let cirSelectBox = new joint.ui.SelectBox({
|
||||||
|
width: 200,
|
||||||
|
placeholder: '画布列表',
|
||||||
|
selected: -1,
|
||||||
|
options: []
|
||||||
|
})
|
||||||
|
circuitlistBox.append(cirSelectBox.render().el)
|
||||||
|
|
||||||
|
// 初始化
|
||||||
|
$('#toggle-diagram-prName').text(store.paperAttr.prName || '（无）')
|
||||||
|
$('#toggle-diagram-circuitName').text(store.paperAttr.circuitName || '（无）')
|
||||||
|
|
||||||
|
dialog.on({
|
||||||
|
'action:confirm': function () {
|
||||||
|
if (!store.cirInf.circuitId) {
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'alert',
|
||||||
|
closeAnimation: {delay: 2000},
|
||||||
|
width: 100,
|
||||||
|
modal: true,
|
||||||
|
title: '提示',
|
||||||
|
content: '请选择画布'
|
||||||
|
})).open()
|
||||||
|
|
||||||
|
return
|
||||||
|
}
|
||||||
|
store.currentCirId = store.cirInf.circuitId;
|
||||||
|
store.paperAttr.circuitName = store.cirInf.circuitName
|
||||||
|
store.paperAttr.prId = store.prInf.prId
|
||||||
|
store.paperAttr.prName = store.prInf.prName
|
||||||
|
|
||||||
|
// 切换画布成功以后 更新url的hash
|
||||||
|
window.location.hash = store.currentCirId ;
|
||||||
|
|
||||||
|
let query = {
|
||||||
|
circuitId: store.currentCirId
|
||||||
|
}
|
||||||
|
renderParperById(query).then(() => {
|
||||||
|
(new joint.ui.FlashMessage({
|
||||||
|
type: 'success',
|
||||||
|
closeAnimation: {delay: 2000},
|
||||||
|
width: 100,
|
||||||
|
modal: true,
|
||||||
|
title: '提示',
|
||||||
|
content: '切换成功'
|
||||||
|
})).open()
|
||||||
|
|
||||||
|
store.commandManager.reset()
|
||||||
|
|
||||||
|
dialog.close()
|
||||||
|
|
||||||
|
publish()
|
||||||
|
})
|
||||||
|
|
||||||
|
},
|
||||||
|
'action:cancel': function () {
|
||||||
|
dialog.close()
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取配电室列表
|
||||||
|
function getPrList(container) {
|
||||||
|
model.getPrList().then(res => {
|
||||||
|
if (res.code && res.code == 200) {
|
||||||
|
renderPrList(res.body, container)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 渲染配电室列表
|
||||||
|
function renderPrList(prList, container) {
|
||||||
|
let optionArr = []
|
||||||
|
|
||||||
|
prList.forEach((pr, index) => {
|
||||||
|
optionArr.push({value: pr.prId, content: pr.prName})
|
||||||
|
})
|
||||||
|
|
||||||
|
let prListSelectBox = new joint.ui.SelectBox({
|
||||||
|
width: 200,
|
||||||
|
placeholder: '配电室列表',
|
||||||
|
selected: -1,
|
||||||
|
options: optionArr
|
||||||
|
})
|
||||||
|
container.html('')
|
||||||
|
container.append(prListSelectBox.render().el)
|
||||||
|
|
||||||
|
// 绑定事件
|
||||||
|
prListSelectBox.on('option:select', (arg) => {
|
||||||
|
// 将当前选择的配电室临时保存
|
||||||
|
store.prInf.prId = arg.value
|
||||||
|
store.prInf.prName = arg.content
|
||||||
|
|
||||||
|
getCircuitList(arg.value, $('#toggle-diagram-circuitList'))
|
||||||
|
$('#toggle-diagram-prName').html(arg.content)
|
||||||
|
|
||||||
|
publish()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 获取画布列表
|
||||||
|
function getCircuitList(prId, container) {
|
||||||
|
let query = {
|
||||||
|
prId: prId
|
||||||
|
}
|
||||||
|
|
||||||
|
model.getCircuitList(query).then(res => {
|
||||||
|
if (res.code && res.code == 200) {
|
||||||
|
renderCircuitList(res.body, container)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 渲染画布列表
|
||||||
|
function renderCircuitList(circuitList, container) {
|
||||||
|
let optionArr = []
|
||||||
|
|
||||||
|
circuitList.forEach((circuit, index) => {
|
||||||
|
optionArr.push({value: circuit.circuitId, content: circuit.circuitName})
|
||||||
|
})
|
||||||
|
|
||||||
|
let circuitListSelectBox = new joint.ui.SelectBox({
|
||||||
|
width: 200,
|
||||||
|
placeholder: '画布列表',
|
||||||
|
selected: -1,
|
||||||
|
options: optionArr
|
||||||
|
})
|
||||||
|
container.html('')
|
||||||
|
container.append(circuitListSelectBox.render().el)
|
||||||
|
|
||||||
|
// 绑定事件
|
||||||
|
circuitListSelectBox.on('option:select', (arg) => {
|
||||||
|
store.cirInf.circuitId = arg.value
|
||||||
|
store.cirInf.circuitName = arg.content
|
||||||
|
|
||||||
|
$('#toggle-diagram-circuitName').html(arg.content)
|
||||||
|
|
||||||
|
publish()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export { toggleDiagramClick }
|
||||||
@ -0,0 +1,24 @@
|
|||||||
|
.toggle-diagram-dialog {
|
||||||
|
padding: 10px 20px;
|
||||||
|
}
|
||||||
|
.toggle-diagram-dialog li {
|
||||||
|
height: 32px;
|
||||||
|
line-height: 32px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.toggle-diagram-dialog span {
|
||||||
|
margin-right: 20px;
|
||||||
|
}
|
||||||
|
#toggle-diagram-prName, #toggle-diagram-circuitName {
|
||||||
|
padding: 0 50px;
|
||||||
|
border-bottom: 1px solid #aaa;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
#toggle-diagram-btn {
|
||||||
|
color: #0d1cf8;
|
||||||
|
font-size: 14px;
|
||||||
|
border-bottom: 1px solid #0d1cf8;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
@ -0,0 +1,16 @@
|
|||||||
|
let toggleDialogTmp = `
|
||||||
|
<ul class="toggle-diagram-dialog">
|
||||||
|
<li class="pr-list">
|
||||||
|
<span>配电室：</span>
|
||||||
|
<span id="toggle-diagram-prName">（无）</span>
|
||||||
|
<span id="toggle-diagram-prlist"></span>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<span>画布：</span>
|
||||||
|
<span id="toggle-diagram-circuitName">（无）</span>
|
||||||
|
<span id="toggle-diagram-circuitList"></span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
`
|
||||||
|
|
||||||
|
export { toggleDialogTmp }
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user