parent
7310fbe23f
commit
41503b3b49
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,62 +1,5 @@
|
||||
"use strict";
|
||||
(self["webpackChunk"] = self["webpackChunk"] || []).push([[71798],{
|
||||
|
||||
/***/ 31917:
|
||||
/*!*****************************************!*\
|
||||
!*** ./src/components/NoData/index.tsx ***!
|
||||
\*****************************************/
|
||||
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
||||
|
||||
/* harmony import */ var _root_workspace_ppte5yg23_SJ5m_develop_node_modules_babel_runtime_7_23_2_babel_runtime_helpers_objectSpread2_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./node_modules/_@babel_runtime@7.23.2@@babel/runtime/helpers/objectSpread2.js */ 26801);
|
||||
/* harmony import */ var _root_workspace_ppte5yg23_SJ5m_develop_node_modules_babel_runtime_7_23_2_babel_runtime_helpers_objectSpread2_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_root_workspace_ppte5yg23_SJ5m_develop_node_modules_babel_runtime_7_23_2_babel_runtime_helpers_objectSpread2_js__WEBPACK_IMPORTED_MODULE_0__);
|
||||
/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ 59301);
|
||||
/* harmony import */ var _assets_images_icons_nodata_png__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @/assets/images/icons/nodata.png */ 4977);
|
||||
/* harmony import */ var antd__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! antd */ 3113);
|
||||
/* harmony import */ var react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react/jsx-runtime */ 37712);
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
var noData = function noData(_ref) {
|
||||
var img = _ref.img,
|
||||
_ref$buttonProps = _ref.buttonProps,
|
||||
buttonProps = _ref$buttonProps === void 0 ? {} : _ref$buttonProps,
|
||||
_ref$styles = _ref.styles,
|
||||
styles = _ref$styles === void 0 ? {} : _ref$styles,
|
||||
customText = _ref.customText,
|
||||
ButtonText = _ref.ButtonText,
|
||||
ButtonClick = _ref.ButtonClick,
|
||||
Buttonclass = _ref.Buttonclass,
|
||||
ButtonTwo = _ref.ButtonTwo,
|
||||
imgStyles = _ref.imgStyles,
|
||||
_ref$loading = _ref.loading,
|
||||
loading = _ref$loading === void 0 ? false : _ref$loading;
|
||||
return /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsxs)("section", {
|
||||
className: "tc animated fadeIn",
|
||||
style: _root_workspace_ppte5yg23_SJ5m_develop_node_modules_babel_runtime_7_23_2_babel_runtime_helpers_objectSpread2_js__WEBPACK_IMPORTED_MODULE_0___default()(_root_workspace_ppte5yg23_SJ5m_develop_node_modules_babel_runtime_7_23_2_babel_runtime_helpers_objectSpread2_js__WEBPACK_IMPORTED_MODULE_0___default()({}, {
|
||||
color: '#999',
|
||||
margin: '100px auto',
|
||||
visibility: loading ? 'hidden' : 'visible'
|
||||
}), styles),
|
||||
children: [/*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("img", {
|
||||
src: img || _assets_images_icons_nodata_png__WEBPACK_IMPORTED_MODULE_2__,
|
||||
style: _root_workspace_ppte5yg23_SJ5m_develop_node_modules_babel_runtime_7_23_2_babel_runtime_helpers_objectSpread2_js__WEBPACK_IMPORTED_MODULE_0___default()({}, imgStyles)
|
||||
}), /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)("p", {
|
||||
className: "mt20 font14",
|
||||
children: customText || '暂时还没有相关数据哦!'
|
||||
}), ButtonText && /*#__PURE__*/(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_3__.jsx)(antd__WEBPACK_IMPORTED_MODULE_4__/* ["default"] */ .ZP, _root_workspace_ppte5yg23_SJ5m_develop_node_modules_babel_runtime_7_23_2_babel_runtime_helpers_objectSpread2_js__WEBPACK_IMPORTED_MODULE_0___default()(_root_workspace_ppte5yg23_SJ5m_develop_node_modules_babel_runtime_7_23_2_babel_runtime_helpers_objectSpread2_js__WEBPACK_IMPORTED_MODULE_0___default()({
|
||||
className: Buttonclass,
|
||||
onClick: ButtonClick
|
||||
}, buttonProps), {}, {
|
||||
children: ButtonText
|
||||
})), ButtonTwo && ButtonTwo]
|
||||
});
|
||||
};
|
||||
/* harmony default export */ __webpack_exports__.Z = (noData);
|
||||
|
||||
/***/ }),
|
||||
(self["webpackChunk"] = self["webpackChunk"] || []).push([[18575],{
|
||||
|
||||
/***/ 18575:
|
||||
/*!***************************************************************!*\
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
@ -1,559 +0,0 @@
|
||||
"use strict";
|
||||
(self["webpackChunk"] = self["webpackChunk"] || []).push([[36981],{
|
||||
|
||||
/***/ 36981:
|
||||
/*!********************************************************!*\
|
||||
!*** ./src/components/AddPoints/index.tsx + 2 modules ***!
|
||||
\********************************************************/
|
||||
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
||||
|
||||
|
||||
// EXPORTS
|
||||
__webpack_require__.d(__webpack_exports__, {
|
||||
Z: function() { return /* binding */ AddPoints; }
|
||||
});
|
||||
|
||||
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.2@@babel/runtime/helpers/regeneratorRuntime.js
|
||||
var regeneratorRuntime = __webpack_require__(10574);
|
||||
var regeneratorRuntime_default = /*#__PURE__*/__webpack_require__.n(regeneratorRuntime);
|
||||
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.2@@babel/runtime/helpers/objectSpread2.js
|
||||
var objectSpread2 = __webpack_require__(26801);
|
||||
var objectSpread2_default = /*#__PURE__*/__webpack_require__.n(objectSpread2);
|
||||
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.2@@babel/runtime/helpers/toConsumableArray.js
|
||||
var toConsumableArray = __webpack_require__(93923);
|
||||
var toConsumableArray_default = /*#__PURE__*/__webpack_require__.n(toConsumableArray);
|
||||
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.2@@babel/runtime/helpers/asyncToGenerator.js
|
||||
var asyncToGenerator = __webpack_require__(39343);
|
||||
var asyncToGenerator_default = /*#__PURE__*/__webpack_require__.n(asyncToGenerator);
|
||||
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.2@@babel/runtime/helpers/slicedToArray.js
|
||||
var slicedToArray = __webpack_require__(11006);
|
||||
var slicedToArray_default = /*#__PURE__*/__webpack_require__.n(slicedToArray);
|
||||
// EXTERNAL MODULE: ./node_modules/_react@17.0.2@react/index.js
|
||||
var _react_17_0_2_react = __webpack_require__(59301);
|
||||
// EXTERNAL MODULE: ./src/.umi-production/exports.ts + 14 modules
|
||||
var _umi_production_exports = __webpack_require__(98426);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/checkbox/index.js + 3 modules
|
||||
var es_checkbox = __webpack_require__(24905);
|
||||
// EXTERNAL MODULE: ./node_modules/_@ant-design_icons@5.2.6@@ant-design/icons/es/icons/MinusCircleOutlined.js + 1 modules
|
||||
var MinusCircleOutlined = __webpack_require__(87306);
|
||||
// EXTERNAL MODULE: ./node_modules/_@ant-design_icons@5.2.6@@ant-design/icons/es/icons/PlusCircleOutlined.js + 1 modules
|
||||
var PlusCircleOutlined = __webpack_require__(71029);
|
||||
// EXTERNAL MODULE: ./src/utils/fetch.ts
|
||||
var fetch = __webpack_require__(4781);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/form/index.js + 19 modules
|
||||
var es_form = __webpack_require__(78241);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/select/index.js
|
||||
var es_select = __webpack_require__(57809);
|
||||
;// CONCATENATED MODULE: ./src/components/AddPoints/index.less?modules
|
||||
// extracted by mini-css-extract-plugin
|
||||
/* harmony default export */ var AddPointsmodules = ({});
|
||||
// EXTERNAL MODULE: ./node_modules/_react@17.0.2@react/jsx-runtime.js
|
||||
var jsx_runtime = __webpack_require__(37712);
|
||||
;// CONCATENATED MODULE: ./src/components/AddPoints/item.tsx
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
var CheckboxGroup = es_checkbox/* default */.Z.Group;
|
||||
var ShixunsListPage = function ShixunsListPage(_ref) {
|
||||
var _params$zydatas, _params$zydatas2, _params$jbdatas, _params$jbdatas2, _params$kcdatas, _params$kcdatas2, _params$zsdatas, _params$zsdatas2;
|
||||
var classroomList = _ref.classroomList,
|
||||
loading = _ref.loading,
|
||||
user = _ref.user,
|
||||
_ref$exercise_id = _ref.exercise_id,
|
||||
exercise_id = _ref$exercise_id === void 0 ? null : _ref$exercise_id,
|
||||
_ref$homework_common_ = _ref.homework_common_id,
|
||||
homework_common_id = _ref$homework_common_ === void 0 ? null : _ref$homework_common_,
|
||||
setitem = _ref.setitem,
|
||||
item = _ref.item,
|
||||
type = _ref.type,
|
||||
rz = _ref.rz,
|
||||
dispatch = _ref.dispatch;
|
||||
var _useState = (0,_react_17_0_2_react.useState)([]),
|
||||
_useState2 = slicedToArray_default()(_useState, 2),
|
||||
datas = _useState2[0],
|
||||
setdatas = _useState2[1];
|
||||
var _useState3 = (0,_react_17_0_2_react.useState)({
|
||||
zydatas: [],
|
||||
jbdatas: [],
|
||||
kcdatas: [],
|
||||
zsdatas: [],
|
||||
page: 1,
|
||||
per_page: 20
|
||||
}),
|
||||
_useState4 = slicedToArray_default()(_useState3, 2),
|
||||
params = _useState4[0],
|
||||
setparams = _useState4[1];
|
||||
var param = (0,_umi_production_exports.useParams)();
|
||||
var _useState5 = (0,_react_17_0_2_react.useState)(false),
|
||||
_useState6 = slicedToArray_default()(_useState5, 2),
|
||||
isshowmodal = _useState6[0],
|
||||
setisshowmodal = _useState6[1];
|
||||
var _useState7 = (0,_react_17_0_2_react.useState)(false),
|
||||
_useState8 = slicedToArray_default()(_useState7, 2),
|
||||
isloading = _useState8[0],
|
||||
setisloading = _useState8[1];
|
||||
var _Form$useForm = es_form/* default */.Z.useForm(),
|
||||
_Form$useForm2 = slicedToArray_default()(_Form$useForm, 1),
|
||||
form = _Form$useForm2[0];
|
||||
|
||||
// // console.log(params);
|
||||
// useEffect(()=>{
|
||||
// if(homework_common_id||exercise_id){
|
||||
// getdatas();
|
||||
// // getrz();
|
||||
|
||||
// }
|
||||
// },[exercise_id,homework_common_id])
|
||||
|
||||
(0,_react_17_0_2_react.useEffect)(function () {
|
||||
if (rz) {
|
||||
// getrz();
|
||||
params.zydatas = rz;
|
||||
setparams(objectSpread2_default()({}, params));
|
||||
if (item !== null && item !== void 0 && item.ec_course_id) {
|
||||
setdata();
|
||||
}
|
||||
}
|
||||
}, [item, rz]);
|
||||
function setdata() {
|
||||
return _setdata.apply(this, arguments);
|
||||
} //获取认证届别
|
||||
function _setdata() {
|
||||
_setdata = asyncToGenerator_default()( /*#__PURE__*/regeneratorRuntime_default()().mark(function _callee3() {
|
||||
return regeneratorRuntime_default()().wrap(function _callee3$(_context3) {
|
||||
while (1) switch (_context3.prev = _context3.next) {
|
||||
case 0:
|
||||
console.log('----', item);
|
||||
_context3.next = 3;
|
||||
return getjb(item === null || item === void 0 ? void 0 : item.ec_major_school_id);
|
||||
case 3:
|
||||
_context3.next = 5;
|
||||
return getcourse(item === null || item === void 0 ? void 0 : item.ec_year_id);
|
||||
case 5:
|
||||
_context3.next = 7;
|
||||
return getec_points(item === null || item === void 0 ? void 0 : item.ec_course_id);
|
||||
case 7:
|
||||
form.setFieldsValue({
|
||||
ec_course_id: item === null || item === void 0 ? void 0 : item.ec_course_id,
|
||||
ec_major_school_id: item === null || item === void 0 ? void 0 : item.ec_major_school_id,
|
||||
ec_point_ids: item === null || item === void 0 ? void 0 : item.ec_point_ids,
|
||||
ec_year_id: item === null || item === void 0 ? void 0 : item.ec_year_id
|
||||
});
|
||||
case 8:
|
||||
case "end":
|
||||
return _context3.stop();
|
||||
}
|
||||
}, _callee3);
|
||||
}));
|
||||
return _setdata.apply(this, arguments);
|
||||
}
|
||||
function getjb(_x) {
|
||||
return _getjb.apply(this, arguments);
|
||||
} //获取关联课程
|
||||
function _getjb() {
|
||||
_getjb = asyncToGenerator_default()( /*#__PURE__*/regeneratorRuntime_default()().mark(function _callee4(key) {
|
||||
var res;
|
||||
return regeneratorRuntime_default()().wrap(function _callee4$(_context4) {
|
||||
while (1) switch (_context4.prev = _context4.next) {
|
||||
case 0:
|
||||
_context4.next = 2;
|
||||
return (0,fetch/* default */.ZP)("/api/ec_major_schools/".concat(key, "/ec_years/get_year_list.json"), {
|
||||
method: 'get'
|
||||
});
|
||||
case 2:
|
||||
res = _context4.sent;
|
||||
params.jbdatas = res === null || res === void 0 ? void 0 : res.data;
|
||||
setparams(objectSpread2_default()({}, params));
|
||||
form.setFieldsValue({
|
||||
ec_year_id: '',
|
||||
ec_course_id: '',
|
||||
ec_point_ids: []
|
||||
});
|
||||
case 6:
|
||||
case "end":
|
||||
return _context4.stop();
|
||||
}
|
||||
}, _callee4);
|
||||
}));
|
||||
return _getjb.apply(this, arguments);
|
||||
}
|
||||
function getcourse(_x2) {
|
||||
return _getcourse.apply(this, arguments);
|
||||
} //获取知识点
|
||||
function _getcourse() {
|
||||
_getcourse = asyncToGenerator_default()( /*#__PURE__*/regeneratorRuntime_default()().mark(function _callee5(key) {
|
||||
var res;
|
||||
return regeneratorRuntime_default()().wrap(function _callee5$(_context5) {
|
||||
while (1) switch (_context5.prev = _context5.next) {
|
||||
case 0:
|
||||
_context5.next = 2;
|
||||
return (0,fetch/* default */.ZP)("/api/ec_years/".concat(key, "/ec_courses/get_courses.json"), {
|
||||
method: 'get'
|
||||
});
|
||||
case 2:
|
||||
res = _context5.sent;
|
||||
params.kcdatas = res === null || res === void 0 ? void 0 : res.data;
|
||||
setparams(objectSpread2_default()({}, params));
|
||||
form.setFieldsValue({
|
||||
ec_course_id: '',
|
||||
ec_point_ids: []
|
||||
});
|
||||
case 6:
|
||||
case "end":
|
||||
return _context5.stop();
|
||||
}
|
||||
}, _callee5);
|
||||
}));
|
||||
return _getcourse.apply(this, arguments);
|
||||
}
|
||||
var getec_points = /*#__PURE__*/function () {
|
||||
var _ref2 = asyncToGenerator_default()( /*#__PURE__*/regeneratorRuntime_default()().mark(function _callee(record) {
|
||||
var res;
|
||||
return regeneratorRuntime_default()().wrap(function _callee$(_context) {
|
||||
while (1) switch (_context.prev = _context.next) {
|
||||
case 0:
|
||||
_context.next = 2;
|
||||
return (0,fetch/* default */.ZP)("/api/ec_courses/".concat(record, "/ec_points.json"), {
|
||||
method: 'get',
|
||||
params: {
|
||||
ec_course_id: record
|
||||
}
|
||||
});
|
||||
case 2:
|
||||
res = _context.sent;
|
||||
params.zsdatas = res === null || res === void 0 ? void 0 : res.data;
|
||||
setparams(objectSpread2_default()({}, params));
|
||||
case 5:
|
||||
case "end":
|
||||
return _context.stop();
|
||||
}
|
||||
}, _callee);
|
||||
}));
|
||||
return function getec_points(_x3) {
|
||||
return _ref2.apply(this, arguments);
|
||||
};
|
||||
}();
|
||||
return /*#__PURE__*/(0,jsx_runtime.jsx)("div", {
|
||||
className: AddPointsmodules.from,
|
||||
children: /*#__PURE__*/(0,jsx_runtime.jsxs)(es_form/* default */.Z, {
|
||||
form: form,
|
||||
layout: "inline",
|
||||
onValuesChange: function onValuesChange(value) {
|
||||
console.log('----', value);
|
||||
if (value.ec_major_school_id) {
|
||||
params.jbdatas = [];
|
||||
params.kcdatas = [];
|
||||
params.zsdatas = [];
|
||||
setparams(objectSpread2_default()({}, params));
|
||||
getjb(value.ec_major_school_id);
|
||||
}
|
||||
if (value.ec_year_id) {
|
||||
params.kcdatas = [];
|
||||
params.zsdatas = [];
|
||||
setparams(objectSpread2_default()({}, params));
|
||||
getcourse(value.ec_year_id);
|
||||
}
|
||||
if (value.ec_course_id) {
|
||||
params.zsdatas = [];
|
||||
setparams(objectSpread2_default()({}, params));
|
||||
getec_points(value.ec_course_id);
|
||||
}
|
||||
},
|
||||
onFinish: /*#__PURE__*/function () {
|
||||
var _ref3 = asyncToGenerator_default()( /*#__PURE__*/regeneratorRuntime_default()().mark(function _callee2(value) {
|
||||
return regeneratorRuntime_default()().wrap(function _callee2$(_context2) {
|
||||
while (1) switch (_context2.prev = _context2.next) {
|
||||
case 0:
|
||||
setitem(value);
|
||||
case 1:
|
||||
case "end":
|
||||
return _context2.stop();
|
||||
}
|
||||
}, _callee2);
|
||||
}));
|
||||
return function (_x4) {
|
||||
return _ref3.apply(this, arguments);
|
||||
};
|
||||
}(),
|
||||
children: [/*#__PURE__*/(0,jsx_runtime.jsx)(es_form/* default */.Z.Item, {
|
||||
label: "\u8BA4\u8BC1\u4E13\u4E1A",
|
||||
name: "ec_major_school_id",
|
||||
children: /*#__PURE__*/(0,jsx_runtime.jsx)(es_select["default"], {
|
||||
style: {
|
||||
width: 150
|
||||
},
|
||||
disabled: ((_params$zydatas = params.zydatas) === null || _params$zydatas === void 0 ? void 0 : _params$zydatas.length) <= 0,
|
||||
placeholder: "\u8BF7\u9009\u62E9\u8BA4\u8BC1\u4E13\u4E1A",
|
||||
children: params === null || params === void 0 || (_params$zydatas2 = params.zydatas) === null || _params$zydatas2 === void 0 ? void 0 : _params$zydatas2.map(function (item, index) {
|
||||
return /*#__PURE__*/(0,jsx_runtime.jsx)(es_select["default"].Option, {
|
||||
value: item === null || item === void 0 ? void 0 : item.ec_major_school_id,
|
||||
children: item === null || item === void 0 ? void 0 : item.name
|
||||
}, index);
|
||||
})
|
||||
})
|
||||
}), /*#__PURE__*/(0,jsx_runtime.jsx)(es_form/* default */.Z.Item, {
|
||||
label: "\u8BA4\u8BC1\u5C4A\u522B",
|
||||
name: "ec_year_id",
|
||||
children: /*#__PURE__*/(0,jsx_runtime.jsx)(es_select["default"], {
|
||||
style: {
|
||||
width: 150
|
||||
},
|
||||
disabled: ((_params$jbdatas = params.jbdatas) === null || _params$jbdatas === void 0 ? void 0 : _params$jbdatas.length) <= 0,
|
||||
placeholder: "\u8BF7\u9009\u62E9\u8BA4\u8BC1\u5C4A\u522B",
|
||||
children: params === null || params === void 0 || (_params$jbdatas2 = params.jbdatas) === null || _params$jbdatas2 === void 0 ? void 0 : _params$jbdatas2.map(function (item, index) {
|
||||
return /*#__PURE__*/(0,jsx_runtime.jsx)(es_select["default"].Option, {
|
||||
value: item === null || item === void 0 ? void 0 : item.ec_year_id,
|
||||
children: item === null || item === void 0 ? void 0 : item.year
|
||||
}, index);
|
||||
})
|
||||
})
|
||||
}), /*#__PURE__*/(0,jsx_runtime.jsx)(es_form/* default */.Z.Item, {
|
||||
label: "\u8BFE\u7A0B",
|
||||
name: "ec_course_id",
|
||||
children: /*#__PURE__*/(0,jsx_runtime.jsx)(es_select["default"], {
|
||||
style: {
|
||||
width: 150
|
||||
},
|
||||
disabled: ((_params$kcdatas = params.kcdatas) === null || _params$kcdatas === void 0 ? void 0 : _params$kcdatas.length) <= 0,
|
||||
placeholder: "\u8BF7\u9009\u62E9\u8BFE\u7A0B",
|
||||
children: params === null || params === void 0 || (_params$kcdatas2 = params.kcdatas) === null || _params$kcdatas2 === void 0 ? void 0 : _params$kcdatas2.map(function (item, index) {
|
||||
return /*#__PURE__*/(0,jsx_runtime.jsx)(es_select["default"].Option, {
|
||||
value: item === null || item === void 0 ? void 0 : item.id,
|
||||
children: item === null || item === void 0 ? void 0 : item.name
|
||||
}, index);
|
||||
})
|
||||
})
|
||||
}), /*#__PURE__*/(0,jsx_runtime.jsx)(es_form/* default */.Z.Item, {
|
||||
label: "\u77E5\u8BC6\u70B9",
|
||||
name: "ec_point_ids",
|
||||
children: /*#__PURE__*/(0,jsx_runtime.jsx)(es_select["default"], {
|
||||
onChange: function onChange() {
|
||||
form.submit();
|
||||
},
|
||||
style: {
|
||||
width: 150
|
||||
},
|
||||
mode: "multiple",
|
||||
disabled: ((_params$zsdatas = params.zsdatas) === null || _params$zsdatas === void 0 ? void 0 : _params$zsdatas.length) <= 0,
|
||||
placeholder: "\u8BF7\u9009\u62E9\u77E5\u8BC6\u70B9",
|
||||
children: params === null || params === void 0 || (_params$zsdatas2 = params.zsdatas) === null || _params$zsdatas2 === void 0 ? void 0 : _params$zsdatas2.map(function (item, index) {
|
||||
return /*#__PURE__*/(0,jsx_runtime.jsx)(es_select["default"].Option, {
|
||||
value: item === null || item === void 0 ? void 0 : item.id,
|
||||
children: item === null || item === void 0 ? void 0 : item.name
|
||||
}, index);
|
||||
})
|
||||
})
|
||||
})]
|
||||
})
|
||||
});
|
||||
};
|
||||
/* harmony default export */ var AddPoints_item = ((0,_umi_production_exports.connect)(function (_ref4) {
|
||||
var classroomList = _ref4.classroomList,
|
||||
loading = _ref4.loading,
|
||||
globalSetting = _ref4.globalSetting,
|
||||
user = _ref4.user;
|
||||
return {
|
||||
classroomList: classroomList,
|
||||
globalSetting: globalSetting,
|
||||
loading: loading.effects,
|
||||
user: user
|
||||
};
|
||||
})(ShixunsListPage));
|
||||
;// CONCATENATED MODULE: ./src/components/AddPoints/index.tsx
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
var AddPoints_CheckboxGroup = es_checkbox/* default */.Z.Group;
|
||||
var AddPoints_ShixunsListPage = function ShixunsListPage(_ref) {
|
||||
var _user$userInfo2, _user$userInfo$course;
|
||||
var classroomList = _ref.classroomList,
|
||||
loading = _ref.loading,
|
||||
user = _ref.user,
|
||||
_ref$exercise_id = _ref.exercise_id,
|
||||
exercise_id = _ref$exercise_id === void 0 ? null : _ref$exercise_id,
|
||||
_ref$homework_common_ = _ref.homework_common_id,
|
||||
homework_common_id = _ref$homework_common_ === void 0 ? null : _ref$homework_common_,
|
||||
_setitem = _ref.setitem,
|
||||
type = _ref.type,
|
||||
dispatch = _ref.dispatch;
|
||||
var _useState = (0,_react_17_0_2_react.useState)([{}]),
|
||||
_useState2 = slicedToArray_default()(_useState, 2),
|
||||
datas = _useState2[0],
|
||||
setdatas = _useState2[1];
|
||||
var _useState3 = (0,_react_17_0_2_react.useState)([]),
|
||||
_useState4 = slicedToArray_default()(_useState3, 2),
|
||||
rz = _useState4[0],
|
||||
setrz = _useState4[1];
|
||||
function getdatas() {
|
||||
return _getdatas.apply(this, arguments);
|
||||
}
|
||||
function _getdatas() {
|
||||
_getdatas = asyncToGenerator_default()( /*#__PURE__*/regeneratorRuntime_default()().mark(function _callee() {
|
||||
var _res$data;
|
||||
var res, _res$data2, _res$data3, ec_point_ids;
|
||||
return regeneratorRuntime_default()().wrap(function _callee$(_context) {
|
||||
while (1) switch (_context.prev = _context.next) {
|
||||
case 0:
|
||||
_context.next = 2;
|
||||
return (0,fetch/* default */.ZP)("/api/ec_courses/".concat(0, "/ec_points/get_work_points.json"), {
|
||||
method: 'get',
|
||||
params: {
|
||||
exercise_id: exercise_id,
|
||||
homework_common_id: homework_common_id
|
||||
}
|
||||
});
|
||||
case 2:
|
||||
res = _context.sent;
|
||||
// console.log(res?.data?.[0]);
|
||||
|
||||
if ((res === null || res === void 0 || (_res$data = res.data) === null || _res$data === void 0 ? void 0 : _res$data.length) > 0) {
|
||||
ec_point_ids = [];
|
||||
res === null || res === void 0 || (_res$data2 = res.data) === null || _res$data2 === void 0 || _res$data2.map(function (ite) {
|
||||
var _ite$ec_point_ids2;
|
||||
ite === null || ite === void 0 || (_ite$ec_point_ids2 = ite.ec_point_ids) === null || _ite$ec_point_ids2 === void 0 || _ite$ec_point_ids2.map(function (j) {
|
||||
ec_point_ids.push(j);
|
||||
});
|
||||
});
|
||||
_setitem(objectSpread2_default()(objectSpread2_default()({}, res === null || res === void 0 || (_res$data3 = res.data) === null || _res$data3 === void 0 ? void 0 : _res$data3[0]), {}, {
|
||||
ec_point_ids: ec_point_ids
|
||||
}));
|
||||
// setitem({...res?.data?.[0]});
|
||||
setdatas(res === null || res === void 0 ? void 0 : res.data);
|
||||
}
|
||||
case 4:
|
||||
case "end":
|
||||
return _context.stop();
|
||||
}
|
||||
}, _callee);
|
||||
}));
|
||||
return _getdatas.apply(this, arguments);
|
||||
}
|
||||
(0,_react_17_0_2_react.useEffect)(function () {
|
||||
var _user$userInfo;
|
||||
if (user !== null && user !== void 0 && (_user$userInfo = user.userInfo) !== null && _user$userInfo !== void 0 && (_user$userInfo = _user$userInfo.course) !== null && _user$userInfo !== void 0 && _user$userInfo.course_school_id) {
|
||||
getrz();
|
||||
}
|
||||
}, [user === null || user === void 0 || (_user$userInfo2 = user.userInfo) === null || _user$userInfo2 === void 0 || (_user$userInfo2 = _user$userInfo2.course) === null || _user$userInfo2 === void 0 ? void 0 : _user$userInfo2.course_school_id]);
|
||||
function getrz() {
|
||||
return _getrz.apply(this, arguments);
|
||||
}
|
||||
function _getrz() {
|
||||
_getrz = asyncToGenerator_default()( /*#__PURE__*/regeneratorRuntime_default()().mark(function _callee2() {
|
||||
var _user$userInfo3;
|
||||
var res;
|
||||
return regeneratorRuntime_default()().wrap(function _callee2$(_context2) {
|
||||
while (1) switch (_context2.prev = _context2.next) {
|
||||
case 0:
|
||||
_context2.next = 2;
|
||||
return (0,fetch/* default */.ZP)("/api/schools/".concat(user === null || user === void 0 || (_user$userInfo3 = user.userInfo) === null || _user$userInfo3 === void 0 || (_user$userInfo3 = _user$userInfo3.course) === null || _user$userInfo3 === void 0 ? void 0 : _user$userInfo3.course_school_id, "/ec_majors/get_major_list.json"), {
|
||||
method: 'get'
|
||||
});
|
||||
case 2:
|
||||
res = _context2.sent;
|
||||
setrz(res === null || res === void 0 ? void 0 : res.data);
|
||||
if (homework_common_id || exercise_id) {
|
||||
getdatas();
|
||||
// getrz();
|
||||
}
|
||||
case 5:
|
||||
case "end":
|
||||
return _context2.stop();
|
||||
}
|
||||
}, _callee2);
|
||||
}));
|
||||
return _getrz.apply(this, arguments);
|
||||
}
|
||||
return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
||||
style: {
|
||||
display: (_user$userInfo$course = user.userInfo.course) !== null && _user$userInfo$course !== void 0 && _user$userInfo$course.is_openengineering ? '' : 'none'
|
||||
},
|
||||
children: [/*#__PURE__*/(0,jsx_runtime.jsx)("p", {
|
||||
style: {
|
||||
fontSize: '16px',
|
||||
fontWeight: 400
|
||||
},
|
||||
children: "\u5DE5\u7A0B\u8BA4\u8BC1\u8003\u6838\u77E5\u8BC6\u70B9"
|
||||
}), datas === null || datas === void 0 ? void 0 : datas.map(function (item, index) {
|
||||
return /*#__PURE__*/(0,jsx_runtime.jsxs)("div", {
|
||||
style: {
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
marginBottom: '10px'
|
||||
},
|
||||
children: [/*#__PURE__*/(0,jsx_runtime.jsx)(AddPoints_item, {
|
||||
rz: rz,
|
||||
item: item,
|
||||
type: index,
|
||||
setitem: function setitem(value) {
|
||||
// item=value
|
||||
// console.log('---',item,datas);
|
||||
datas.splice(index, 1, value);
|
||||
setdatas(toConsumableArray_default()(datas));
|
||||
var ec_point_ids = [];
|
||||
datas === null || datas === void 0 || datas.map(function (ite) {
|
||||
var _ite$ec_point_ids;
|
||||
ite === null || ite === void 0 || (_ite$ec_point_ids = ite.ec_point_ids) === null || _ite$ec_point_ids === void 0 || _ite$ec_point_ids.map(function (j) {
|
||||
ec_point_ids.push(j);
|
||||
});
|
||||
});
|
||||
_setitem(objectSpread2_default()(objectSpread2_default()({}, value), {}, {
|
||||
ec_point_ids: ec_point_ids
|
||||
}));
|
||||
}
|
||||
}), index != 0 && /*#__PURE__*/(0,jsx_runtime.jsx)(MinusCircleOutlined/* default */.Z, {
|
||||
onClick: function onClick() {
|
||||
datas.splice(index, 1);
|
||||
setdatas(toConsumableArray_default()(datas));
|
||||
},
|
||||
style: {
|
||||
marginLeft: 10,
|
||||
fontSize: '20px'
|
||||
}
|
||||
}), /*#__PURE__*/(0,jsx_runtime.jsx)(PlusCircleOutlined/* default */.Z, {
|
||||
onClick: function onClick() {
|
||||
datas.push({});
|
||||
setdatas(toConsumableArray_default()(datas));
|
||||
},
|
||||
style: {
|
||||
marginLeft: 10,
|
||||
fontSize: '20px'
|
||||
}
|
||||
})]
|
||||
}, index);
|
||||
})]
|
||||
});
|
||||
};
|
||||
/* harmony default export */ var AddPoints = ((0,_umi_production_exports.connect)(function (_ref2) {
|
||||
var classroomList = _ref2.classroomList,
|
||||
loading = _ref2.loading,
|
||||
globalSetting = _ref2.globalSetting,
|
||||
user = _ref2.user;
|
||||
return {
|
||||
classroomList: classroomList,
|
||||
globalSetting: globalSetting,
|
||||
loading: loading.effects,
|
||||
user: user
|
||||
};
|
||||
})(AddPoints_ShixunsListPage));
|
||||
|
||||
/***/ })
|
||||
|
||||
}]);
|
||||
@ -1,4 +0,0 @@
|
||||
/*!*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
|
||||
!*** css ./node_modules/_css-loader@6.7.1@css-loader/dist/cjs.js??ruleSet[1].rules[5].oneOf[0].use[1]!./node_modules/_@umijs_bundler-webpack@4.0.88@@umijs/bundler-webpack/compiled/postcss-loader/index.js??ruleSet[1].rules[5].oneOf[0].use[2]!./node_modules/_@umijs_bundler-webpack@4.0.88@@umijs/bundler-webpack/compiled/less-loader/index.js??ruleSet[1].rules[5].oneOf[0].use[3]!./src/components/AddPoints/index.less?modules ***!
|
||||
\*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -1,679 +0,0 @@
|
||||
(self["webpackChunk"] = self["webpackChunk"] || []).push([[92113],{
|
||||
|
||||
/***/ 88011:
|
||||
/*!**********************************************************************************************************!*\
|
||||
!*** ./node_modules/_@ant-design_icons@5.2.6@@ant-design/icons/es/icons/FileTextOutlined.js + 1 modules ***!
|
||||
\**********************************************************************************************************/
|
||||
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
||||
|
||||
"use strict";
|
||||
|
||||
// EXPORTS
|
||||
__webpack_require__.d(__webpack_exports__, {
|
||||
Z: function() { return /* binding */ icons_FileTextOutlined; }
|
||||
});
|
||||
|
||||
// EXTERNAL MODULE: ./node_modules/_@babel_runtime@7.23.4@@babel/runtime/helpers/esm/extends.js
|
||||
var esm_extends = __webpack_require__(23015);
|
||||
// EXTERNAL MODULE: ./node_modules/_react@17.0.2@react/index.js
|
||||
var _react_17_0_2_react = __webpack_require__(59301);
|
||||
;// CONCATENATED MODULE: ./node_modules/_@ant-design_icons-svg@4.3.1@@ant-design/icons-svg/es/asn/FileTextOutlined.js
|
||||
// This icon file is generated automatically.
|
||||
var FileTextOutlined = { "icon": { "tag": "svg", "attrs": { "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M854.6 288.6L639.4 73.4c-6-6-14.1-9.4-22.6-9.4H192c-17.7 0-32 14.3-32 32v832c0 17.7 14.3 32 32 32h640c17.7 0 32-14.3 32-32V311.3c0-8.5-3.4-16.7-9.4-22.7zM790.2 326H602V137.8L790.2 326zm1.8 562H232V136h302v216a42 42 0 0042 42h216v494zM504 618H320c-4.4 0-8 3.6-8 8v48c0 4.4 3.6 8 8 8h184c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8zM312 490v48c0 4.4 3.6 8 8 8h384c4.4 0 8-3.6 8-8v-48c0-4.4-3.6-8-8-8H320c-4.4 0-8 3.6-8 8z" } }] }, "name": "file-text", "theme": "outlined" };
|
||||
/* harmony default export */ var asn_FileTextOutlined = (FileTextOutlined);
|
||||
|
||||
// EXTERNAL MODULE: ./node_modules/_@ant-design_icons@5.2.6@@ant-design/icons/es/components/AntdIcon.js + 3 modules
|
||||
var AntdIcon = __webpack_require__(91851);
|
||||
;// CONCATENATED MODULE: ./node_modules/_@ant-design_icons@5.2.6@@ant-design/icons/es/icons/FileTextOutlined.js
|
||||
|
||||
// GENERATE BY ./scripts/generate.ts
|
||||
// DON NOT EDIT IT MANUALLY
|
||||
|
||||
|
||||
|
||||
|
||||
var FileTextOutlined_FileTextOutlined = function FileTextOutlined(props, ref) {
|
||||
return /*#__PURE__*/_react_17_0_2_react.createElement(AntdIcon/* default */.Z, (0,esm_extends/* default */.Z)({}, props, {
|
||||
ref: ref,
|
||||
icon: asn_FileTextOutlined
|
||||
}));
|
||||
};
|
||||
if (false) {}
|
||||
/* harmony default export */ var icons_FileTextOutlined = (/*#__PURE__*/_react_17_0_2_react.forwardRef(FileTextOutlined_FileTextOutlined));
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ 31797:
|
||||
/*!*************************************************************************!*\
|
||||
!*** ./node_modules/_antd@5.9.0@antd/es/statistic/index.js + 5 modules ***!
|
||||
\*************************************************************************/
|
||||
/***/ (function(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
|
||||
|
||||
"use strict";
|
||||
|
||||
// EXPORTS
|
||||
__webpack_require__.d(__webpack_exports__, {
|
||||
Z: function() { return /* binding */ es_statistic; }
|
||||
});
|
||||
|
||||
// EXTERNAL MODULE: ./node_modules/_react@17.0.2@react/index.js
|
||||
var _react_17_0_2_react = __webpack_require__(59301);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/_util/hooks/useForceUpdate.js
|
||||
var useForceUpdate = __webpack_require__(56762);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/_util/reactNode.js
|
||||
var reactNode = __webpack_require__(92343);
|
||||
// EXTERNAL MODULE: ./node_modules/_classnames@2.3.2@classnames/index.js
|
||||
var _classnames_2_3_2_classnames = __webpack_require__(12124);
|
||||
var _classnames_2_3_2_classnames_default = /*#__PURE__*/__webpack_require__.n(_classnames_2_3_2_classnames);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/config-provider/context.js
|
||||
var context = __webpack_require__(36355);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/skeleton/index.js + 12 modules
|
||||
var skeleton = __webpack_require__(59981);
|
||||
;// CONCATENATED MODULE: ./node_modules/_antd@5.9.0@antd/es/statistic/Number.js
|
||||
"use client";
|
||||
|
||||
|
||||
const StatisticNumber = props => {
|
||||
const {
|
||||
value,
|
||||
formatter,
|
||||
precision,
|
||||
decimalSeparator,
|
||||
groupSeparator = '',
|
||||
prefixCls
|
||||
} = props;
|
||||
let valueNode;
|
||||
if (typeof formatter === 'function') {
|
||||
// Customize formatter
|
||||
valueNode = formatter(value);
|
||||
} else {
|
||||
// Internal formatter
|
||||
const val = String(value);
|
||||
const cells = val.match(/^(-?)(\d*)(\.(\d+))?$/);
|
||||
// Process if illegal number
|
||||
if (!cells || val === '-') {
|
||||
valueNode = val;
|
||||
} else {
|
||||
const negative = cells[1];
|
||||
let int = cells[2] || '0';
|
||||
let decimal = cells[4] || '';
|
||||
int = int.replace(/\B(?=(\d{3})+(?!\d))/g, groupSeparator);
|
||||
if (typeof precision === 'number') {
|
||||
decimal = decimal.padEnd(precision, '0').slice(0, precision > 0 ? precision : 0);
|
||||
}
|
||||
if (decimal) {
|
||||
decimal = `${decimalSeparator}${decimal}`;
|
||||
}
|
||||
valueNode = [/*#__PURE__*/_react_17_0_2_react.createElement("span", {
|
||||
key: "int",
|
||||
className: `${prefixCls}-content-value-int`
|
||||
}, negative, int), decimal && /*#__PURE__*/_react_17_0_2_react.createElement("span", {
|
||||
key: "decimal",
|
||||
className: `${prefixCls}-content-value-decimal`
|
||||
}, decimal)];
|
||||
}
|
||||
}
|
||||
return /*#__PURE__*/_react_17_0_2_react.createElement("span", {
|
||||
className: `${prefixCls}-content-value`
|
||||
}, valueNode);
|
||||
};
|
||||
/* harmony default export */ var statistic_Number = (StatisticNumber);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/style/index.js
|
||||
var style = __webpack_require__(17313);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/theme/util/genComponentStyleHook.js
|
||||
var genComponentStyleHook = __webpack_require__(83116);
|
||||
// EXTERNAL MODULE: ./node_modules/_antd@5.9.0@antd/es/theme/util/statistic.js
|
||||
var statistic = __webpack_require__(37613);
|
||||
;// CONCATENATED MODULE: ./node_modules/_antd@5.9.0@antd/es/statistic/style/index.js
|
||||
"use client";
|
||||
|
||||
|
||||
|
||||
const genStatisticStyle = token => {
|
||||
const {
|
||||
componentCls,
|
||||
marginXXS,
|
||||
padding,
|
||||
colorTextDescription,
|
||||
titleFontSize,
|
||||
colorTextHeading,
|
||||
contentFontSize,
|
||||
fontFamily
|
||||
} = token;
|
||||
return {
|
||||
[`${componentCls}`]: Object.assign(Object.assign({}, (0,style/* resetComponent */.Wf)(token)), {
|
||||
[`${componentCls}-title`]: {
|
||||
marginBottom: marginXXS,
|
||||
color: colorTextDescription,
|
||||
fontSize: titleFontSize
|
||||
},
|
||||
[`${componentCls}-skeleton`]: {
|
||||
paddingTop: padding
|
||||
},
|
||||
[`${componentCls}-content`]: {
|
||||
color: colorTextHeading,
|
||||
fontSize: contentFontSize,
|
||||
fontFamily,
|
||||
[`${componentCls}-content-value`]: {
|
||||
display: 'inline-block',
|
||||
direction: 'ltr'
|
||||
},
|
||||
[`${componentCls}-content-prefix, ${componentCls}-content-suffix`]: {
|
||||
display: 'inline-block'
|
||||
},
|
||||
[`${componentCls}-content-prefix`]: {
|
||||
marginInlineEnd: marginXXS
|
||||
},
|
||||
[`${componentCls}-content-suffix`]: {
|
||||
marginInlineStart: marginXXS
|
||||
}
|
||||
}
|
||||
})
|
||||
};
|
||||
};
|
||||
// ============================== Export ==============================
|
||||
/* harmony default export */ var statistic_style = ((0,genComponentStyleHook/* default */.Z)('Statistic', token => {
|
||||
const statisticToken = (0,statistic/* merge */.TS)(token, {});
|
||||
return [genStatisticStyle(statisticToken)];
|
||||
}, token => {
|
||||
const {
|
||||
fontSizeHeading3,
|
||||
fontSize
|
||||
} = token;
|
||||
return {
|
||||
titleFontSize: fontSize,
|
||||
contentFontSize: fontSizeHeading3
|
||||
};
|
||||
}));
|
||||
;// CONCATENATED MODULE: ./node_modules/_antd@5.9.0@antd/es/statistic/Statistic.js
|
||||
"use client";
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const Statistic = props => {
|
||||
const {
|
||||
prefixCls: customizePrefixCls,
|
||||
className,
|
||||
rootClassName,
|
||||
style,
|
||||
valueStyle,
|
||||
value = 0,
|
||||
title,
|
||||
valueRender,
|
||||
prefix,
|
||||
suffix,
|
||||
loading = false,
|
||||
onMouseEnter,
|
||||
onMouseLeave,
|
||||
decimalSeparator = '.',
|
||||
groupSeparator = ','
|
||||
} = props;
|
||||
const {
|
||||
getPrefixCls,
|
||||
direction,
|
||||
statistic
|
||||
} = _react_17_0_2_react.useContext(context/* ConfigContext */.E_);
|
||||
const prefixCls = getPrefixCls('statistic', customizePrefixCls);
|
||||
const [wrapSSR, hashId] = statistic_style(prefixCls);
|
||||
const valueNode = /*#__PURE__*/_react_17_0_2_react.createElement(statistic_Number, Object.assign({
|
||||
decimalSeparator: decimalSeparator,
|
||||
groupSeparator: groupSeparator,
|
||||
prefixCls: prefixCls
|
||||
}, props, {
|
||||
value: value
|
||||
}));
|
||||
const cls = _classnames_2_3_2_classnames_default()(prefixCls, {
|
||||
[`${prefixCls}-rtl`]: direction === 'rtl'
|
||||
}, statistic === null || statistic === void 0 ? void 0 : statistic.className, className, rootClassName, hashId);
|
||||
return wrapSSR( /*#__PURE__*/_react_17_0_2_react.createElement("div", {
|
||||
className: cls,
|
||||
style: Object.assign(Object.assign({}, statistic === null || statistic === void 0 ? void 0 : statistic.style), style),
|
||||
onMouseEnter: onMouseEnter,
|
||||
onMouseLeave: onMouseLeave
|
||||
}, title && /*#__PURE__*/_react_17_0_2_react.createElement("div", {
|
||||
className: `${prefixCls}-title`
|
||||
}, title), /*#__PURE__*/_react_17_0_2_react.createElement(skeleton/* default */.Z, {
|
||||
paragraph: false,
|
||||
loading: loading,
|
||||
className: `${prefixCls}-skeleton`
|
||||
}, /*#__PURE__*/_react_17_0_2_react.createElement("div", {
|
||||
style: valueStyle,
|
||||
className: `${prefixCls}-content`
|
||||
}, prefix && /*#__PURE__*/_react_17_0_2_react.createElement("span", {
|
||||
className: `${prefixCls}-content-prefix`
|
||||
}, prefix), valueRender ? valueRender(valueNode) : valueNode, suffix && /*#__PURE__*/_react_17_0_2_react.createElement("span", {
|
||||
className: `${prefixCls}-content-suffix`
|
||||
}, suffix)))));
|
||||
};
|
||||
if (false) {}
|
||||
/* harmony default export */ var statistic_Statistic = (Statistic);
|
||||
;// CONCATENATED MODULE: ./node_modules/_antd@5.9.0@antd/es/statistic/utils.js
|
||||
// Countdown
|
||||
const timeUnits = [['Y', 1000 * 60 * 60 * 24 * 365], ['M', 1000 * 60 * 60 * 24 * 30], ['D', 1000 * 60 * 60 * 24], ['H', 1000 * 60 * 60], ['m', 1000 * 60], ['s', 1000], ['S', 1] // million seconds
|
||||
];
|
||||
|
||||
function formatTimeStr(duration, format) {
|
||||
let leftDuration = duration;
|
||||
const escapeRegex = /\[[^\]]*]/g;
|
||||
const keepList = (format.match(escapeRegex) || []).map(str => str.slice(1, -1));
|
||||
const templateText = format.replace(escapeRegex, '[]');
|
||||
const replacedText = timeUnits.reduce((current, _ref) => {
|
||||
let [name, unit] = _ref;
|
||||
if (current.includes(name)) {
|
||||
const value = Math.floor(leftDuration / unit);
|
||||
leftDuration -= value * unit;
|
||||
return current.replace(new RegExp(`${name}+`, 'g'), match => {
|
||||
const len = match.length;
|
||||
return value.toString().padStart(len, '0');
|
||||
});
|
||||
}
|
||||
return current;
|
||||
}, templateText);
|
||||
let index = 0;
|
||||
return replacedText.replace(escapeRegex, () => {
|
||||
const match = keepList[index];
|
||||
index += 1;
|
||||
return match;
|
||||
});
|
||||
}
|
||||
function formatCountdown(value, config) {
|
||||
const {
|
||||
format = ''
|
||||
} = config;
|
||||
const target = new Date(value).getTime();
|
||||
const current = Date.now();
|
||||
const diff = Math.max(target - current, 0);
|
||||
return formatTimeStr(diff, format);
|
||||
}
|
||||
;// CONCATENATED MODULE: ./node_modules/_antd@5.9.0@antd/es/statistic/Countdown.js
|
||||
"use client";
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
const REFRESH_INTERVAL = 1000 / 30;
|
||||
function getTime(value) {
|
||||
return new Date(value).getTime();
|
||||
}
|
||||
const Countdown = props => {
|
||||
const {
|
||||
value,
|
||||
format = 'HH:mm:ss',
|
||||
onChange,
|
||||
onFinish
|
||||
} = props;
|
||||
const forceUpdate = (0,useForceUpdate/* default */.Z)();
|
||||
const countdown = _react_17_0_2_react.useRef(null);
|
||||
const stopTimer = () => {
|
||||
onFinish === null || onFinish === void 0 ? void 0 : onFinish();
|
||||
if (countdown.current) {
|
||||
clearInterval(countdown.current);
|
||||
countdown.current = null;
|
||||
}
|
||||
};
|
||||
const syncTimer = () => {
|
||||
const timestamp = getTime(value);
|
||||
if (timestamp >= Date.now()) {
|
||||
countdown.current = setInterval(() => {
|
||||
forceUpdate();
|
||||
onChange === null || onChange === void 0 ? void 0 : onChange(timestamp - Date.now());
|
||||
if (timestamp < Date.now()) {
|
||||
stopTimer();
|
||||
}
|
||||
}, REFRESH_INTERVAL);
|
||||
}
|
||||
};
|
||||
_react_17_0_2_react.useEffect(() => {
|
||||
syncTimer();
|
||||
return () => {
|
||||
if (countdown.current) {
|
||||
clearInterval(countdown.current);
|
||||
countdown.current = null;
|
||||
}
|
||||
};
|
||||
}, [value]);
|
||||
const formatter = (formatValue, config) => formatCountdown(formatValue, Object.assign(Object.assign({}, config), {
|
||||
format
|
||||
}));
|
||||
const valueRender = node => (0,reactNode/* cloneElement */.Tm)(node, {
|
||||
title: undefined
|
||||
});
|
||||
return /*#__PURE__*/_react_17_0_2_react.createElement(statistic_Statistic, Object.assign({}, props, {
|
||||
valueRender: valueRender,
|
||||
formatter: formatter
|
||||
}));
|
||||
};
|
||||
/* harmony default export */ var statistic_Countdown = (/*#__PURE__*/_react_17_0_2_react.memo(Countdown));
|
||||
;// CONCATENATED MODULE: ./node_modules/_antd@5.9.0@antd/es/statistic/index.js
|
||||
"use client";
|
||||
|
||||
|
||||
|
||||
statistic_Statistic.Countdown = statistic_Countdown;
|
||||
/* harmony default export */ var es_statistic = (statistic_Statistic);
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ 51581:
|
||||
/*!****************************************************************************************************!*\
|
||||
!*** ./node_modules/_react-infinite-scroller@1.2.4@react-infinite-scroller/dist/InfiniteScroll.js ***!
|
||||
\****************************************************************************************************/
|
||||
/***/ (function(module, exports, __webpack_require__) {
|
||||
|
||||
"use strict";
|
||||
|
||||
|
||||
Object.defineProperty(exports, "__esModule", ({
|
||||
value: true
|
||||
}));
|
||||
|
||||
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
|
||||
|
||||
var _react = __webpack_require__(/*! react */ 59301);
|
||||
|
||||
var _react2 = _interopRequireDefault(_react);
|
||||
|
||||
var _propTypes = __webpack_require__(/*! prop-types */ 12708);
|
||||
|
||||
var _propTypes2 = _interopRequireDefault(_propTypes);
|
||||
|
||||
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
||||
|
||||
function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }
|
||||
|
||||
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
||||
|
||||
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
|
||||
|
||||
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
|
||||
|
||||
var InfiniteScroll = function (_Component) {
|
||||
_inherits(InfiniteScroll, _Component);
|
||||
|
||||
function InfiniteScroll(props) {
|
||||
_classCallCheck(this, InfiniteScroll);
|
||||
|
||||
var _this = _possibleConstructorReturn(this, (InfiniteScroll.__proto__ || Object.getPrototypeOf(InfiniteScroll)).call(this, props));
|
||||
|
||||
_this.scrollListener = _this.scrollListener.bind(_this);
|
||||
_this.eventListenerOptions = _this.eventListenerOptions.bind(_this);
|
||||
_this.mousewheelListener = _this.mousewheelListener.bind(_this);
|
||||
return _this;
|
||||
}
|
||||
|
||||
_createClass(InfiniteScroll, [{
|
||||
key: 'componentDidMount',
|
||||
value: function componentDidMount() {
|
||||
this.pageLoaded = this.props.pageStart;
|
||||
this.options = this.eventListenerOptions();
|
||||
this.attachScrollListener();
|
||||
}
|
||||
}, {
|
||||
key: 'componentDidUpdate',
|
||||
value: function componentDidUpdate() {
|
||||
if (this.props.isReverse && this.loadMore) {
|
||||
var parentElement = this.getParentElement(this.scrollComponent);
|
||||
parentElement.scrollTop = parentElement.scrollHeight - this.beforeScrollHeight + this.beforeScrollTop;
|
||||
this.loadMore = false;
|
||||
}
|
||||
this.attachScrollListener();
|
||||
}
|
||||
}, {
|
||||
key: 'componentWillUnmount',
|
||||
value: function componentWillUnmount() {
|
||||
this.detachScrollListener();
|
||||
this.detachMousewheelListener();
|
||||
}
|
||||
}, {
|
||||
key: 'isPassiveSupported',
|
||||
value: function isPassiveSupported() {
|
||||
var passive = false;
|
||||
|
||||
var testOptions = {
|
||||
get passive() {
|
||||
passive = true;
|
||||
}
|
||||
};
|
||||
|
||||
try {
|
||||
document.addEventListener('test', null, testOptions);
|
||||
document.removeEventListener('test', null, testOptions);
|
||||
} catch (e) {
|
||||
// ignore
|
||||
}
|
||||
return passive;
|
||||
}
|
||||
}, {
|
||||
key: 'eventListenerOptions',
|
||||
value: function eventListenerOptions() {
|
||||
var options = this.props.useCapture;
|
||||
|
||||
if (this.isPassiveSupported()) {
|
||||
options = {
|
||||
useCapture: this.props.useCapture,
|
||||
passive: true
|
||||
};
|
||||
}
|
||||
return options;
|
||||
}
|
||||
|
||||
// Set a defaut loader for all your `InfiniteScroll` components
|
||||
|
||||
}, {
|
||||
key: 'setDefaultLoader',
|
||||
value: function setDefaultLoader(loader) {
|
||||
this.defaultLoader = loader;
|
||||
}
|
||||
}, {
|
||||
key: 'detachMousewheelListener',
|
||||
value: function detachMousewheelListener() {
|
||||
var scrollEl = window;
|
||||
if (this.props.useWindow === false) {
|
||||
scrollEl = this.scrollComponent.parentNode;
|
||||
}
|
||||
|
||||
scrollEl.removeEventListener('mousewheel', this.mousewheelListener, this.options ? this.options : this.props.useCapture);
|
||||
}
|
||||
}, {
|
||||
key: 'detachScrollListener',
|
||||
value: function detachScrollListener() {
|
||||
var scrollEl = window;
|
||||
if (this.props.useWindow === false) {
|
||||
scrollEl = this.getParentElement(this.scrollComponent);
|
||||
}
|
||||
|
||||
scrollEl.removeEventListener('scroll', this.scrollListener, this.options ? this.options : this.props.useCapture);
|
||||
scrollEl.removeEventListener('resize', this.scrollListener, this.options ? this.options : this.props.useCapture);
|
||||
}
|
||||
}, {
|
||||
key: 'getParentElement',
|
||||
value: function getParentElement(el) {
|
||||
var scrollParent = this.props.getScrollParent && this.props.getScrollParent();
|
||||
if (scrollParent != null) {
|
||||
return scrollParent;
|
||||
}
|
||||
return el && el.parentNode;
|
||||
}
|
||||
}, {
|
||||
key: 'filterProps',
|
||||
value: function filterProps(props) {
|
||||
return props;
|
||||
}
|
||||
}, {
|
||||
key: 'attachScrollListener',
|
||||
value: function attachScrollListener() {
|
||||
var parentElement = this.getParentElement(this.scrollComponent);
|
||||
|
||||
if (!this.props.hasMore || !parentElement) {
|
||||
return;
|
||||
}
|
||||
|
||||
var scrollEl = window;
|
||||
if (this.props.useWindow === false) {
|
||||
scrollEl = parentElement;
|
||||
}
|
||||
|
||||
scrollEl.addEventListener('mousewheel', this.mousewheelListener, this.options ? this.options : this.props.useCapture);
|
||||
scrollEl.addEventListener('scroll', this.scrollListener, this.options ? this.options : this.props.useCapture);
|
||||
scrollEl.addEventListener('resize', this.scrollListener, this.options ? this.options : this.props.useCapture);
|
||||
|
||||
if (this.props.initialLoad) {
|
||||
this.scrollListener();
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: 'mousewheelListener',
|
||||
value: function mousewheelListener(e) {
|
||||
// Prevents Chrome hangups
|
||||
// See: https://stackoverflow.com/questions/47524205/random-high-content-download-time-in-chrome/47684257#47684257
|
||||
if (e.deltaY === 1 && !this.isPassiveSupported()) {
|
||||
e.preventDefault();
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: 'scrollListener',
|
||||
value: function scrollListener() {
|
||||
var el = this.scrollComponent;
|
||||
var scrollEl = window;
|
||||
var parentNode = this.getParentElement(el);
|
||||
|
||||
var offset = void 0;
|
||||
if (this.props.useWindow) {
|
||||
var doc = document.documentElement || document.body.parentNode || document.body;
|
||||
var scrollTop = scrollEl.pageYOffset !== undefined ? scrollEl.pageYOffset : doc.scrollTop;
|
||||
if (this.props.isReverse) {
|
||||
offset = scrollTop;
|
||||
} else {
|
||||
offset = this.calculateOffset(el, scrollTop);
|
||||
}
|
||||
} else if (this.props.isReverse) {
|
||||
offset = parentNode.scrollTop;
|
||||
} else {
|
||||
offset = el.scrollHeight - parentNode.scrollTop - parentNode.clientHeight;
|
||||
}
|
||||
|
||||
// Here we make sure the element is visible as well as checking the offset
|
||||
if (offset < Number(this.props.threshold) && el && el.offsetParent !== null) {
|
||||
this.detachScrollListener();
|
||||
this.beforeScrollHeight = parentNode.scrollHeight;
|
||||
this.beforeScrollTop = parentNode.scrollTop;
|
||||
// Call loadMore after detachScrollListener to allow for non-async loadMore functions
|
||||
if (typeof this.props.loadMore === 'function') {
|
||||
this.props.loadMore(this.pageLoaded += 1);
|
||||
this.loadMore = true;
|
||||
}
|
||||
}
|
||||
}
|
||||
}, {
|
||||
key: 'calculateOffset',
|
||||
value: function calculateOffset(el, scrollTop) {
|
||||
if (!el) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
return this.calculateTopPosition(el) + (el.offsetHeight - scrollTop - window.innerHeight);
|
||||
}
|
||||
}, {
|
||||
key: 'calculateTopPosition',
|
||||
value: function calculateTopPosition(el) {
|
||||
if (!el) {
|
||||
return 0;
|
||||
}
|
||||
return el.offsetTop + this.calculateTopPosition(el.offsetParent);
|
||||
}
|
||||
}, {
|
||||
key: 'render',
|
||||
value: function render() {
|
||||
var _this2 = this;
|
||||
|
||||
var renderProps = this.filterProps(this.props);
|
||||
|
||||
var children = renderProps.children,
|
||||
element = renderProps.element,
|
||||
hasMore = renderProps.hasMore,
|
||||
initialLoad = renderProps.initialLoad,
|
||||
isReverse = renderProps.isReverse,
|
||||
loader = renderProps.loader,
|
||||
loadMore = renderProps.loadMore,
|
||||
pageStart = renderProps.pageStart,
|
||||
ref = renderProps.ref,
|
||||
threshold = renderProps.threshold,
|
||||
useCapture = renderProps.useCapture,
|
||||
useWindow = renderProps.useWindow,
|
||||
getScrollParent = renderProps.getScrollParent,
|
||||
props = _objectWithoutProperties(renderProps, ['children', 'element', 'hasMore', 'initialLoad', 'isReverse', 'loader', 'loadMore', 'pageStart', 'ref', 'threshold', 'useCapture', 'useWindow', 'getScrollParent']);
|
||||
|
||||
props.ref = function (node) {
|
||||
_this2.scrollComponent = node;
|
||||
if (ref) {
|
||||
ref(node);
|
||||
}
|
||||
};
|
||||
|
||||
var childrenArray = [children];
|
||||
if (hasMore) {
|
||||
if (loader) {
|
||||
isReverse ? childrenArray.unshift(loader) : childrenArray.push(loader);
|
||||
} else if (this.defaultLoader) {
|
||||
isReverse ? childrenArray.unshift(this.defaultLoader) : childrenArray.push(this.defaultLoader);
|
||||
}
|
||||
}
|
||||
return _react2.default.createElement(element, props, childrenArray);
|
||||
}
|
||||
}]);
|
||||
|
||||
return InfiniteScroll;
|
||||
}(_react.Component);
|
||||
|
||||
InfiniteScroll.propTypes = {
|
||||
children: _propTypes2.default.node.isRequired,
|
||||
element: _propTypes2.default.node,
|
||||
hasMore: _propTypes2.default.bool,
|
||||
initialLoad: _propTypes2.default.bool,
|
||||
isReverse: _propTypes2.default.bool,
|
||||
loader: _propTypes2.default.node,
|
||||
loadMore: _propTypes2.default.func.isRequired,
|
||||
pageStart: _propTypes2.default.number,
|
||||
ref: _propTypes2.default.func,
|
||||
getScrollParent: _propTypes2.default.func,
|
||||
threshold: _propTypes2.default.number,
|
||||
useCapture: _propTypes2.default.bool,
|
||||
useWindow: _propTypes2.default.bool
|
||||
};
|
||||
InfiniteScroll.defaultProps = {
|
||||
element: 'div',
|
||||
hasMore: false,
|
||||
initialLoad: true,
|
||||
pageStart: 0,
|
||||
ref: null,
|
||||
threshold: 250,
|
||||
useWindow: true,
|
||||
isReverse: false,
|
||||
useCapture: false,
|
||||
loader: null,
|
||||
getScrollParent: null
|
||||
};
|
||||
exports["default"] = InfiniteScroll;
|
||||
module.exports = exports['default'];
|
||||
|
||||
|
||||
/***/ }),
|
||||
|
||||
/***/ 26724:
|
||||
/*!**************************************************************************************!*\
|
||||
!*** ./node_modules/_react-infinite-scroller@1.2.4@react-infinite-scroller/index.js ***!
|
||||
\**************************************************************************************/
|
||||
/***/ (function(module, __unused_webpack_exports, __webpack_require__) {
|
||||
|
||||
module.exports = __webpack_require__(/*! ./dist/InfiniteScroll */ 51581)
|
||||
|
||||
|
||||
/***/ })
|
||||
|
||||
}]);
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
@ -0,0 +1,657 @@
|
||||
"use strict";
|
||||
/*
|
||||
* Copyright (C) 1998-2023 by Northwoods Software Corporation. All Rights Reserved.
|
||||
*/
|
||||
|
||||
/*
|
||||
* This is an extension and not part of the main GoJS library.
|
||||
* Note that the API for this class may change with any version, even point releases.
|
||||
* If you intend to use an extension in production, you should copy the code to your own source directory.
|
||||
* Extensions can be found in the GoJS kit under the extensions or extensionsJSM folders.
|
||||
* See the Extensions intro page (https://gojs.net/latest/intro/extensions.html) for more information.
|
||||
*/
|
||||
|
||||
/**
|
||||
* @constructor
|
||||
* @extends CommandHandler
|
||||
* @class
|
||||
* This CommandHandler class allows the user to position selected Parts in a diagram
|
||||
* relative to the first part selected, in addition to overriding the doKeyDown method
|
||||
* of the CommandHandler for handling the arrow keys in additional manners.
|
||||
* <p>
|
||||
* Typical usage:
|
||||
* <pre>
|
||||
* new go.Diagram("myDiagramDiv",
|
||||
* {
|
||||
* commandHandler: $(DrawCommandHandler),
|
||||
* . . .
|
||||
* }
|
||||
* )
|
||||
* </pre>
|
||||
* or:
|
||||
* <pre>
|
||||
* myDiagram.commandHandler = new DrawCommandHandler();
|
||||
* </pre>
|
||||
*/
|
||||
function DrawCommandHandler() {
|
||||
go.CommandHandler.call(this);
|
||||
this._arrowKeyBehavior = "move";
|
||||
this._pasteOffset = new go.Point(10, 10);
|
||||
this._lastPasteOffset = new go.Point(0, 0);
|
||||
}
|
||||
go.Diagram.inherit(DrawCommandHandler, go.CommandHandler);
|
||||
|
||||
/**
|
||||
* This controls whether or not the user can invoke the {@link #alignLeft}, {@link #alignRight},
|
||||
* {@link #alignTop}, {@link #alignBottom}, {@link #alignCenterX}, {@link #alignCenterY} commands.
|
||||
* @this {DrawCommandHandler}
|
||||
* @return {boolean}
|
||||
* This returns true:
|
||||
* if the diagram is not {@link Diagram#isReadOnly},
|
||||
* if the model is not {@link Model#isReadOnly}, and
|
||||
* if there are at least two selected {@link Part}s.
|
||||
*/
|
||||
DrawCommandHandler.prototype.canAlignSelection = function() {
|
||||
var diagram = this.diagram;
|
||||
if (diagram === null || diagram.isReadOnly || diagram.isModelReadOnly) return false;
|
||||
if (diagram.selection.count < 2) return false;
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Aligns selected parts along the left-most edge of the left-most part.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype.alignLeft = function() {
|
||||
var diagram = this.diagram;
|
||||
diagram.startTransaction("aligning left");
|
||||
var minPosition = Infinity;
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
minPosition = Math.min(current.position.x, minPosition);
|
||||
});
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
current.move(new go.Point(minPosition, current.position.y));
|
||||
});
|
||||
diagram.commitTransaction("aligning left");
|
||||
};
|
||||
|
||||
/**
|
||||
* Aligns selected parts at the right-most edge of the right-most part.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype.alignRight = function() {
|
||||
var diagram = this.diagram;
|
||||
diagram.startTransaction("aligning right");
|
||||
var maxPosition = -Infinity;
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
var rightSideLoc = current.actualBounds.x + current.actualBounds.width;
|
||||
maxPosition = Math.max(rightSideLoc, maxPosition);
|
||||
});
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
current.move(new go.Point(maxPosition - current.actualBounds.width, current.position.y));
|
||||
});
|
||||
diagram.commitTransaction("aligning right");
|
||||
};
|
||||
|
||||
/**
|
||||
* Aligns selected parts at the top-most edge of the top-most part.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype.alignTop = function() {
|
||||
var diagram = this.diagram;
|
||||
diagram.startTransaction("alignTop");
|
||||
var minPosition = Infinity;
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
minPosition = Math.min(current.position.y, minPosition);
|
||||
});
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
current.move(new go.Point(current.position.x, minPosition));
|
||||
});
|
||||
diagram.commitTransaction("alignTop");
|
||||
};
|
||||
|
||||
/**
|
||||
* Aligns selected parts at the bottom-most edge of the bottom-most part.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype.alignBottom = function() {
|
||||
var diagram = this.diagram;
|
||||
diagram.startTransaction("aligning bottom");
|
||||
var maxPosition = -Infinity;
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
var bottomSideLoc = current.actualBounds.y + current.actualBounds.height;
|
||||
maxPosition = Math.max(bottomSideLoc, maxPosition);
|
||||
});
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
current.move(new go.Point(current.actualBounds.x, maxPosition - current.actualBounds.height));
|
||||
});
|
||||
diagram.commitTransaction("aligning bottom");
|
||||
};
|
||||
|
||||
/**
|
||||
* Aligns selected parts at the x-value of the center point of the first selected part.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype.alignCenterX = function() {
|
||||
var diagram = this.diagram;
|
||||
var firstSelection = diagram.selection.first();
|
||||
if (!firstSelection) return;
|
||||
diagram.startTransaction("aligning Center X");
|
||||
var centerX = firstSelection.actualBounds.x + firstSelection.actualBounds.width / 2;
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
current.move(new go.Point(centerX - current.actualBounds.width / 2, current.actualBounds.y));
|
||||
});
|
||||
diagram.commitTransaction("aligning Center X");
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Aligns selected parts at the y-value of the center point of the first selected part.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype.alignCenterY = function() {
|
||||
var diagram = this.diagram;
|
||||
var firstSelection = diagram.selection.first();
|
||||
if (!firstSelection) return;
|
||||
diagram.startTransaction("aligning Center Y");
|
||||
var centerY = firstSelection.actualBounds.y + firstSelection.actualBounds.height / 2;
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
current.move(new go.Point(current.actualBounds.x, centerY - current.actualBounds.height / 2));
|
||||
});
|
||||
diagram.commitTransaction("aligning Center Y");
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Aligns selected parts top-to-bottom in order of the order selected.
|
||||
* Distance between parts can be specified. Default distance is 0.
|
||||
* @this {DrawCommandHandler}
|
||||
* @param {number} distance
|
||||
*/
|
||||
DrawCommandHandler.prototype.alignColumn = function(distance) {
|
||||
var diagram = this.diagram;
|
||||
diagram.startTransaction("align Column");
|
||||
if (distance === undefined) distance = 0; // for aligning edge to edge
|
||||
distance = parseFloat(distance);
|
||||
var selectedParts = new Array();
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
selectedParts.push(current);
|
||||
});
|
||||
for (var i = 0; i < selectedParts.length - 1; i++) {
|
||||
var current = selectedParts[i];
|
||||
// adds distance specified between parts
|
||||
var curBottomSideLoc = current.actualBounds.y + current.actualBounds.height + distance;
|
||||
var next = selectedParts[i + 1];
|
||||
next.move(new go.Point(current.actualBounds.x, curBottomSideLoc));
|
||||
}
|
||||
diagram.commitTransaction("align Column");
|
||||
};
|
||||
|
||||
/**
|
||||
* Aligns selected parts left-to-right in order of the order selected.
|
||||
* Distance between parts can be specified. Default distance is 0.
|
||||
* @this {DrawCommandHandler}
|
||||
* @param {number} distance
|
||||
*/
|
||||
DrawCommandHandler.prototype.alignRow = function(distance) {
|
||||
if (distance === undefined) distance = 0; // for aligning edge to edge
|
||||
distance = parseFloat(distance);
|
||||
var diagram = this.diagram;
|
||||
diagram.startTransaction("align Row");
|
||||
var selectedParts = new Array();
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link) return; // skips over go.Link
|
||||
selectedParts.push(current);
|
||||
});
|
||||
for (var i = 0; i < selectedParts.length - 1; i++) {
|
||||
var current = selectedParts[i];
|
||||
// adds distance specified between parts
|
||||
var curRightSideLoc = current.actualBounds.x + current.actualBounds.width + distance;
|
||||
var next = selectedParts[i + 1];
|
||||
next.move(new go.Point(curRightSideLoc, current.actualBounds.y));
|
||||
}
|
||||
diagram.commitTransaction("align Row");
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* This controls whether or not the user can invoke the {@link #rotate} command.
|
||||
* @this {DrawCommandHandler}
|
||||
* @param {number=} angle the positive (clockwise) or negative (counter-clockwise) change in the rotation angle of each Part, in degrees.
|
||||
* @return {boolean}
|
||||
* This returns true:
|
||||
* if the diagram is not {@link Diagram#isReadOnly},
|
||||
* if the model is not {@link Model#isReadOnly}, and
|
||||
* if there is at least one selected {@link Part}.
|
||||
*/
|
||||
DrawCommandHandler.prototype.canRotate = function(number) {
|
||||
var diagram = this.diagram;
|
||||
if (diagram === null || diagram.isReadOnly || diagram.isModelReadOnly) return false;
|
||||
if (diagram.selection.count < 1) return false;
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Change the angle of the parts connected with the given part. This is in the command handler
|
||||
* so it can be easily accessed for the purpose of creating commands that change the rotation of a part.
|
||||
* @this {DrawCommandHandler}
|
||||
* @param {number=} angle the positive (clockwise) or negative (counter-clockwise) change in the rotation angle of each Part, in degrees.
|
||||
*/
|
||||
DrawCommandHandler.prototype.rotate = function(angle) {
|
||||
if (angle === undefined) angle = 90;
|
||||
var diagram = this.diagram;
|
||||
diagram.startTransaction("rotate " + angle.toString());
|
||||
var diagram = this.diagram;
|
||||
diagram.selection.each(function(current) {
|
||||
if (current instanceof go.Link || current instanceof go.Group) return; // skips over Links and Groups
|
||||
current.angle += angle;
|
||||
});
|
||||
diagram.commitTransaction("rotate " + angle.toString());
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Change the z-ordering of selected parts to pull them forward, in front of all other parts
|
||||
* in their respective layers.
|
||||
* All unselected parts in each layer with a selected Part with a non-numeric {@link Part#zOrder} will get a zOrder of zero.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype.pullToFront = function() {
|
||||
var diagram = this.diagram;
|
||||
diagram.startTransaction("pullToFront");
|
||||
// find the affected Layers
|
||||
var layers = new go.Map();
|
||||
diagram.selection.each(function(part) {
|
||||
layers.set(part.layer, 0);
|
||||
});
|
||||
// find the maximum zOrder in each Layer
|
||||
layers.iteratorKeys.each(function(layer) {
|
||||
var max = 0;
|
||||
layer.parts.each(function(part) {
|
||||
if (part.isSelected) return;
|
||||
var z = part.zOrder;
|
||||
if (isNaN(z)) {
|
||||
part.zOrder = 0;
|
||||
} else {
|
||||
max = Math.max(max, z);
|
||||
}
|
||||
});
|
||||
layers.set(layer, max);
|
||||
});
|
||||
// assign each selected Part.zOrder to the computed value for each Layer
|
||||
diagram.selection.each(function(part) {
|
||||
DrawCommandHandler._assignZOrder(part, layers.get(part.layer) + 1);
|
||||
});
|
||||
diagram.commitTransaction("pullToFront");
|
||||
};
|
||||
|
||||
/**
|
||||
* Change the z-ordering of selected parts to push them backward, behind of all other parts
|
||||
* in their respective layers.
|
||||
* All unselected parts in each layer with a selected Part with a non-numeric {@link Part#zOrder} will get a zOrder of zero.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype.pushToBack = function() {
|
||||
var diagram = this.diagram;
|
||||
diagram.startTransaction("pushToBack");
|
||||
// find the affected Layers
|
||||
var layers = new go.Map();
|
||||
diagram.selection.each(function(part) {
|
||||
layers.set(part.layer, 0);
|
||||
});
|
||||
// find the minimum zOrder in each Layer
|
||||
layers.iteratorKeys.each(function(layer) {
|
||||
var min = 0;
|
||||
layer.parts.each(function(part) {
|
||||
if (part.isSelected) return;
|
||||
var z = part.zOrder;
|
||||
if (isNaN(z)) {
|
||||
part.zOrder = 0;
|
||||
} else {
|
||||
min = Math.min(min, z);
|
||||
}
|
||||
});
|
||||
layers.set(layer, min);
|
||||
});
|
||||
// assign each selected Part.zOrder to the computed value for each Layer
|
||||
diagram.selection.each(function(part) {
|
||||
DrawCommandHandler._assignZOrder(part,
|
||||
// make sure a group's nested nodes are also behind everything else
|
||||
layers.get(part.layer) - 1 - DrawCommandHandler._findGroupDepth(part));
|
||||
});
|
||||
diagram.commitTransaction("pushToBack");
|
||||
};
|
||||
|
||||
DrawCommandHandler._assignZOrder = function(part, z, root) {
|
||||
if (root === undefined) root = part;
|
||||
if (part.layer === root.layer) part.zOrder = z;
|
||||
if (part instanceof go.Group) {
|
||||
part.memberParts.each(function(m) {
|
||||
DrawCommandHandler._assignZOrder(m, z+1, root);
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
DrawCommandHandler._findGroupDepth = function(part) {
|
||||
if (part instanceof go.Group) {
|
||||
var d = 0;
|
||||
part.memberParts.each(function(m) {
|
||||
d = Math.max(d, DrawCommandHandler._findGroupDepth(m));
|
||||
});
|
||||
return d+1;
|
||||
} else {
|
||||
return 0;
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* This implements custom behaviors for arrow key keyboard events.
|
||||
* Set {@link #arrowKeyBehavior} to "select", "move" (the default), "scroll" (the standard behavior), or "none"
|
||||
* to affect the behavior when the user types an arrow key.
|
||||
* @this {DrawCommandHandler}*/
|
||||
DrawCommandHandler.prototype.doKeyDown = function() {
|
||||
var diagram = this.diagram;
|
||||
if (diagram === null) return;
|
||||
var e = diagram.lastInput;
|
||||
|
||||
// determines the function of the arrow keys
|
||||
if (e.key === "Up" || e.key === "Down" || e.key === "Left" || e.key === "Right") {
|
||||
var behavior = this.arrowKeyBehavior;
|
||||
if (behavior === "none") {
|
||||
// no-op
|
||||
return;
|
||||
} else if (behavior === "select") {
|
||||
this._arrowKeySelect();
|
||||
return;
|
||||
} else if (behavior === "move") {
|
||||
this._arrowKeyMove();
|
||||
return;
|
||||
} else if (behavior === "tree") {
|
||||
this._arrowKeyTree();
|
||||
return;
|
||||
}
|
||||
// otherwise drop through to get the default scrolling behavior
|
||||
}
|
||||
|
||||
// otherwise still does all standard commands
|
||||
go.CommandHandler.prototype.doKeyDown.call(this);
|
||||
};
|
||||
|
||||
/**
|
||||
* Collects in an Array all of the non-Link Parts currently in the Diagram.
|
||||
* @this {DrawCommandHandler}
|
||||
* @return {Array}
|
||||
*/
|
||||
DrawCommandHandler.prototype._getAllParts = function() {
|
||||
var allParts = new Array();
|
||||
this.diagram.nodes.each(function(node) { allParts.push(node); });
|
||||
this.diagram.parts.each(function(part) { allParts.push(part); });
|
||||
// note that this ignores Links
|
||||
return allParts;
|
||||
};
|
||||
|
||||
/**
|
||||
* To be called when arrow keys should move the Diagram.selection.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype._arrowKeyMove = function() {
|
||||
var diagram = this.diagram;
|
||||
var e = diagram.lastInput;
|
||||
// moves all selected parts in the specified direction
|
||||
var vdistance = 0;
|
||||
var hdistance = 0;
|
||||
// if control is being held down, move pixel by pixel. Else, moves by grid cell size
|
||||
if (e.control || e.meta) {
|
||||
vdistance = 1;
|
||||
hdistance = 1;
|
||||
} else if (diagram.grid !== null) {
|
||||
var cellsize = diagram.grid.gridCellSize;
|
||||
hdistance = cellsize.width;
|
||||
vdistance = cellsize.height;
|
||||
}
|
||||
diagram.startTransaction("arrowKeyMove");
|
||||
diagram.selection.each(function(part) {
|
||||
if (e.key === "Up") {
|
||||
part.move(new go.Point(part.actualBounds.x, part.actualBounds.y - vdistance));
|
||||
} else if (e.key === "Down") {
|
||||
part.move(new go.Point(part.actualBounds.x, part.actualBounds.y + vdistance));
|
||||
} else if (e.key === "Left") {
|
||||
part.move(new go.Point(part.actualBounds.x - hdistance, part.actualBounds.y));
|
||||
} else if (e.key === "Right") {
|
||||
part.move(new go.Point(part.actualBounds.x + hdistance, part.actualBounds.y));
|
||||
}
|
||||
});
|
||||
diagram.commitTransaction("arrowKeyMove");
|
||||
};
|
||||
|
||||
/**
|
||||
* To be called when arrow keys should change selection.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype._arrowKeySelect = function() {
|
||||
var diagram = this.diagram;
|
||||
var e = diagram.lastInput;
|
||||
// with a part selected, arrow keys change the selection
|
||||
// arrow keys + shift selects the additional part in the specified direction
|
||||
// arrow keys + control toggles the selection of the additional part
|
||||
var nextPart = null;
|
||||
if (e.key === "Up") {
|
||||
nextPart = this._findNearestPartTowards(270);
|
||||
} else if (e.key === "Down") {
|
||||
nextPart = this._findNearestPartTowards(90);
|
||||
} else if (e.key === "Left") {
|
||||
nextPart = this._findNearestPartTowards(180);
|
||||
} else if (e.key === "Right") {
|
||||
nextPart = this._findNearestPartTowards(0);
|
||||
}
|
||||
if (nextPart !== null) {
|
||||
if (e.shift) {
|
||||
nextPart.isSelected = true;
|
||||
} else if (e.control || e.meta) {
|
||||
nextPart.isSelected = !nextPart.isSelected;
|
||||
} else {
|
||||
diagram.select(nextPart);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Finds the nearest selectable Part in the specified direction, based on their center points.
|
||||
* if it doesn't find anything, it just returns the current Part.
|
||||
* @this {DrawCommandHandler}
|
||||
* @param {number} dir the direction, in degrees
|
||||
* @return {Part} the closest Part found in the given direction
|
||||
*/
|
||||
DrawCommandHandler.prototype._findNearestPartTowards = function(dir) {
|
||||
var originalPart = this.diagram.selection.first();
|
||||
if (originalPart === null) return null;
|
||||
var originalPoint = originalPart.actualBounds.center;
|
||||
var allParts = this._getAllParts();
|
||||
var closestDistance = Infinity;
|
||||
var closest = originalPart; // if no parts meet the criteria, the same part remains selected
|
||||
|
||||
for (var i = 0; i < allParts.length; i++) {
|
||||
var nextPart = allParts[i];
|
||||
if (nextPart === originalPart) continue; // skips over currently selected part
|
||||
if (!nextPart.canSelect()) continue;
|
||||
var nextPoint = nextPart.actualBounds.center;
|
||||
var angle = originalPoint.directionPoint(nextPoint);
|
||||
var anglediff = this._angleCloseness(angle, dir);
|
||||
if (anglediff <= 45) { // if this part's center is within the desired direction's sector,
|
||||
var distance = originalPoint.distanceSquaredPoint(nextPoint);
|
||||
distance *= 1+Math.sin(anglediff*Math.PI/180); // the more different from the intended angle, the further it is
|
||||
if (distance < closestDistance) { // and if it's closer than any other part,
|
||||
closestDistance = distance; // remember it as a better choice
|
||||
closest = nextPart;
|
||||
}
|
||||
}
|
||||
}
|
||||
return closest;
|
||||
};
|
||||
|
||||
/**
|
||||
* @this {DrawCommandHandler}
|
||||
* @param {number} a
|
||||
* @param {number} dir
|
||||
* @return {number}
|
||||
*/
|
||||
DrawCommandHandler.prototype._angleCloseness = function(a, dir) {
|
||||
return Math.min(Math.abs(dir - a), Math.min(Math.abs(dir + 360 - a), Math.abs(dir - 360 - a)));
|
||||
};
|
||||
|
||||
/**
|
||||
* To be called when arrow keys should change the selected node in a tree and expand or collapse subtrees.
|
||||
* @this {DrawCommandHandler}
|
||||
*/
|
||||
DrawCommandHandler.prototype._arrowKeyTree = function() {
|
||||
var diagram = this.diagram;
|
||||
var selected = diagram.selection.first();
|
||||
if (!(selected instanceof go.Node)) return;
|
||||
|
||||
var e = diagram.lastInput;
|
||||
if (e.key === "Right") {
|
||||
if (selected.isTreeLeaf) {
|
||||
// no-op
|
||||
} else if (!selected.isTreeExpanded) {
|
||||
if (diagram.commandHandler.canExpandTree(selected)) {
|
||||
diagram.commandHandler.expandTree(selected); // expands the tree
|
||||
}
|
||||
} else { // already expanded -- select the first child node
|
||||
var first = this._sortTreeChildrenByY(selected).first();
|
||||
if (first !== null) diagram.select(first);
|
||||
}
|
||||
} else if (e.key === "Left") {
|
||||
if (!selected.isTreeLeaf && selected.isTreeExpanded) {
|
||||
if (diagram.commandHandler.canCollapseTree(selected)) {
|
||||
diagram.commandHandler.collapseTree(selected); // collapses the tree
|
||||
}
|
||||
} else { // either a leaf or is already collapsed -- select the parent node
|
||||
var parent = selected.findTreeParentNode();
|
||||
if (parent !== null) diagram.select(parent);
|
||||
}
|
||||
} else if (e.key === "Up") {
|
||||
var parent = selected.findTreeParentNode();
|
||||
if (parent !== null) {
|
||||
var list = this._sortTreeChildrenByY(parent);
|
||||
var idx = list.indexOf(selected);
|
||||
if (idx > 0) { // if there is a previous sibling
|
||||
var prev = list.elt(idx - 1);
|
||||
// keep looking at the last child until it's a leaf or collapsed
|
||||
while (prev !== null && prev.isTreeExpanded && !prev.isTreeLeaf) {
|
||||
var children = this._sortTreeChildrenByY(prev);
|
||||
prev = children.last();
|
||||
}
|
||||
if (prev !== null) diagram.select(prev);
|
||||
} else { // no previous sibling -- select parent
|
||||
diagram.select(parent);
|
||||
}
|
||||
}
|
||||
} else if (e.key === "Down") {
|
||||
// if at an expanded parent, select the first child
|
||||
if (selected.isTreeExpanded && !selected.isTreeLeaf) {
|
||||
var first = this._sortTreeChildrenByY(selected).first();
|
||||
if (first !== null) diagram.select(first);
|
||||
} else {
|
||||
while (selected !== null) {
|
||||
var parent = selected.findTreeParentNode();
|
||||
if (parent === null) break;
|
||||
var list = this._sortTreeChildrenByY(parent);
|
||||
var idx = list.indexOf(selected);
|
||||
if (idx < list.length - 1) { // select next lower node
|
||||
diagram.select(list.elt(idx + 1));
|
||||
break;
|
||||
} else { // already at bottom of list of children
|
||||
selected = parent;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// make sure the selection is now in the viewport, but not necessarily centered
|
||||
var sel = diagram.selection.first();
|
||||
if (sel !== null) diagram.scrollToRect(sel.actualBounds);
|
||||
}
|
||||
|
||||
DrawCommandHandler.prototype._sortTreeChildrenByY = function(node) {
|
||||
var list = new go.List().addAll(node.findTreeChildrenNodes());
|
||||
list.sort(function(a, b) {
|
||||
var aloc = a.location;
|
||||
var bloc = b.location;
|
||||
if (aloc.y < bloc.y) return -1;
|
||||
if (aloc.y > bloc.y) return 1;
|
||||
if (aloc.x < bloc.x) return -1;
|
||||
if (aloc.x > bloc.x) return 1;
|
||||
return 0;
|
||||
});
|
||||
return list;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Reset the last offset for pasting.
|
||||
* @this {DrawCommandHandler}
|
||||
* @param {Iterable.<Part>} coll a collection of {@link Part}s.
|
||||
*/
|
||||
DrawCommandHandler.prototype.copyToClipboard = function(coll) {
|
||||
go.CommandHandler.prototype.copyToClipboard.call(this, coll);
|
||||
this._lastPasteOffset.set(this.pasteOffset);
|
||||
};
|
||||
|
||||
/**
|
||||
* Paste from the clipboard with an offset incremented on each paste, and reset when copied.
|
||||
* @this {DrawCommandHandler}
|
||||
* @return {Set.<Part>} a collection of newly pasted {@link Part}s
|
||||
*/
|
||||
DrawCommandHandler.prototype.pasteFromClipboard = function() {
|
||||
var coll = go.CommandHandler.prototype.pasteFromClipboard.call(this);
|
||||
this.diagram.moveParts(coll, this._lastPasteOffset);
|
||||
this._lastPasteOffset.add(this.pasteOffset);
|
||||
return coll;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Gets or sets the arrow key behavior. Possible values are "move", "select", "scroll", and "tree".
|
||||
* The default value is "move".
|
||||
* @name DrawCommandHandler#arrowKeyBehavior
|
||||
|
||||
* @return {string}
|
||||
*/
|
||||
Object.defineProperty(DrawCommandHandler.prototype, "arrowKeyBehavior", {
|
||||
get: function() { return this._arrowKeyBehavior; },
|
||||
set: function(val) {
|
||||
if (val !== "move" && val !== "select" && val !== "scroll" && val !== "tree" && val !== "none") {
|
||||
throw new Error("DrawCommandHandler.arrowKeyBehavior must be either \"move\", \"select\", \"scroll\", \"tree\", or \"none\", not: " + val);
|
||||
}
|
||||
this._arrowKeyBehavior = val;
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* Gets or sets the offset at which each repeated pasteSelection() puts the new copied parts from the clipboard.
|
||||
* The default value is (10,10).
|
||||
* @name DrawCommandHandler#pasteOffset
|
||||
|
||||
* @return {Point}
|
||||
*/
|
||||
Object.defineProperty(DrawCommandHandler.prototype, "pasteOffset", {
|
||||
get: function() { return this._pasteOffset; },
|
||||
set: function(val) {
|
||||
if (!(val instanceof go.Point)) throw new Error("DrawCommandHandler.pasteOffset must be a Point, not: " + val);
|
||||
this._pasteOffset.set(val);
|
||||
}
|
||||
});
|
||||
|
||||
export default DrawCommandHandler
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,652 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<body>
|
||||
<style>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
button{
|
||||
position: absolute;
|
||||
left: 100px;
|
||||
top: 50px;
|
||||
}
|
||||
body{
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
<script src="/knowledgegraph/go.js"></script>
|
||||
|
||||
<script src="/js/go/Figures.js"></script>
|
||||
<script src="/js/go/DrawCommandHandler.js"></script>
|
||||
<script id="code">
|
||||
const initData = "{ \"class\": \"GraphLinksModel\",\n \"nodeDataArray\": [\n{\"text\":\"Find Problem\",\"key\":-9,\"loc\":\"-20 -140\",\"color\":\"#3358ff\",\"fill\":\"white\",\"figure\":\"Procedure\",\"thickness\":3},\n{\"text\":\"What do we want?\",\"key\":-10,\"loc\":\"-65 -324.305\",\"group\":-16,\"figure\":\"Ellipse\",\"fill\":\"white\"},\n{\"text\":\"What do our users want?\",\"key\":-11,\"loc\":\"105 -334.305\",\"group\":-20,\"figure\":\"Ellipse\",\"fill\":\"#ffffff\",\"color\":\"black\"},\n{\"text\":\"Meetings\",\"key\":-12,\"loc\":\"-65 -444.305\",\"group\":-16,\"figure\":\"TriangleDown\",\"fill\":\"#ffffff\"},\n{\"text\":\"Reviews\",\"key\":-13,\"loc\":\"105 -454.305\",\"group\":-20,\"figure\":\"TriangleDown\",\"fill\":\"#ffffff\",\"color\":\"black\"},\n{\"text\":\"Can we solve it?\",\"key\":-14,\"loc\":\"190 -140\",\"color\":\"#7d33ff\",\"fill\":\"#ffffff\",\"figure\":\"Diamond\",\"size\":\"140 80\",\"thickness\":3},\n{\"isGroup\":true,\"text\":\"Internal\",\"key\":-16,\"loc\":\"-65 -384.305\",\"fill\":\"#d5ebff\",\"dash\":null,\"thickness\":1,\"group\":-22},\n{\"isGroup\":true,\"text\":\"External\",\"key\":-20,\"loc\":\"105 -394.305\",\"fill\":\"#d5ebff\",\"dash\":null,\"thickness\":1,\"group\":-22},\n{\"isGroup\":true,\"text\":\"Sources\",\"key\":-22,\"loc\":\"20 -400\",\"fill\":\"#a5d2fa\",\"dash\":[4,4],\"color\":\"#3358ff\"}\n],\n \"linkDataArray\": [\n{\"from\":-12,\"to\":-10,\"points\":[-65,-414.305,-65,-404.305,-65,-384.305,-65,-384.305,-65,-364.305,-65,-354.305],\"dash\":null,\"dir\":1},\n{\"from\":-13,\"to\":-11,\"points\":[105,-424.305,105,-414.305,105,-394.305,105,-394.305,105,-374.305,105,-364.305],\"dash\":null,\"color\":\"#000000\",\"dir\":1},\n{\"from\":-10,\"to\":-9,\"points\":[-65,-294.305,-65,-284.305,-65,-232.1525,-40,-232.1525,-40,-180,-40,-170],\"dir\":2,\"dash\":[4,4]},\n{\"from\":-11,\"to\":-9,\"points\":[105,-304.305,105,-294.305,105,-237.1525,0,-237.1525,0,-180,0,-170],\"dash\":[4,4],\"dir\":2},\n{\"from\":-9,\"to\":-14,\"points\":[40,-150,58,-150,80,-150,80,-153.33333333333331,102,-153.33333333333331,120,-153.33333333333331],\"dir\":1,\"color\":\"#3358ff\"},\n{\"from\":-14,\"to\":-9,\"points\":[190,-100,190,-90,-20,-90,-20,-95,-20,-100,-20,-110],\"fromSpot\":\"BottomSide\",\"toSpot\":\"BottomSide\",\"text\":\"No\",\"color\":\"#ff3333\",\"thickness\":2,\"dir\":1},\n{\"from\":-9,\"to\":-14,\"points\":[40,-130,58,-130,80,-130,80,-126.66666666666666,102,-126.66666666666666,120,-126.66666666666666]}\n]}"
|
||||
function init() {
|
||||
const $ = go.GraphObject.make;
|
||||
const colors = {
|
||||
red: "#ff3333",
|
||||
blue: "#3358ff",
|
||||
green: "#25ad23",
|
||||
magenta: "#d533ff",
|
||||
purple: "#7d33ff",
|
||||
orange: "#ff6233",
|
||||
brown: "#8e571e",
|
||||
white: "#ffffff",
|
||||
black: "#000000",
|
||||
beige: "#fffcd5",
|
||||
extralightblue: "#d5ebff",
|
||||
extralightred: "#f2dfe0",
|
||||
lightblue: "#a5d2fa",
|
||||
lightgray: "#cccccc",
|
||||
lightgreen: "#b3e6b3",
|
||||
lightred: "#fcbbbd",
|
||||
}
|
||||
|
||||
myDiagram =
|
||||
new go.Diagram("myDiagramDiv",
|
||||
{
|
||||
padding: 20, // extra space when scrolled all the way
|
||||
grid: $(go.Panel, "Grid", // a simple 10x10 grid
|
||||
$(go.Shape, "LineH", { stroke: "lightgray", strokeWidth: 0.5 }),
|
||||
$(go.Shape, "LineV", { stroke: "lightgray", strokeWidth: 0.5 })
|
||||
),
|
||||
"draggingTool.isGridSnapEnabled": true,
|
||||
handlesDragDropForTopLevelParts: true,
|
||||
mouseDrop: e => {
|
||||
var ok = e.diagram.commandHandler.addTopLevelParts(e.diagram.selection, true);
|
||||
if (!ok) e.diagram.currentTool.doCancel();
|
||||
},
|
||||
commandHandler: $(DrawCommandHandler), // support offset copy-and-paste
|
||||
"clickCreatingTool.archetypeNodeData": { text: "NEW NODE" }, // create a new node by double-clicking in background
|
||||
"PartCreated": e => {
|
||||
var node = e.subject; // the newly inserted Node -- now need to snap its location to the grid
|
||||
node.location = node.location.copy().snapToGridPoint(e.diagram.grid.gridOrigin, e.diagram.grid.gridCellSize);
|
||||
setTimeout(() => { // and have the user start editing its text
|
||||
e.diagram.commandHandler.editTextBlock();
|
||||
}, 20);
|
||||
},
|
||||
"commandHandler.archetypeGroupData": { isGroup: true, text: "NEW GROUP" },
|
||||
"SelectionGrouped": e => {
|
||||
var group = e.subject;
|
||||
setTimeout(() => { // and have the user start editing its text
|
||||
e.diagram.commandHandler.editTextBlock();
|
||||
})
|
||||
},
|
||||
"LinkRelinked": e => {
|
||||
// re-spread the connections of other links connected with both old and new nodes
|
||||
var oldnode = e.parameter.part;
|
||||
oldnode.invalidateConnectedLinks();
|
||||
var link = e.subject;
|
||||
if (e.diagram.toolManager.linkingTool.isForwards) {
|
||||
link.toNode.invalidateConnectedLinks();
|
||||
} else {
|
||||
link.fromNode.invalidateConnectedLinks();
|
||||
}
|
||||
},
|
||||
"undoManager.isEnabled": true
|
||||
});
|
||||
|
||||
|
||||
// Node template
|
||||
|
||||
myDiagram.nodeTemplate =
|
||||
$(go.Node, "Auto",
|
||||
{
|
||||
locationSpot: go.Spot.Center, locationObjectName: "SHAPE",
|
||||
desiredSize: new go.Size(120, 60), minSize: new go.Size(40, 40),
|
||||
resizable: true, resizeCellSize: new go.Size(20, 20)
|
||||
},
|
||||
// these Bindings are TwoWay because the DraggingTool and ResizingTool modify the target properties
|
||||
new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
|
||||
new go.Binding("desiredSize", "size", go.Size.parse).makeTwoWay(go.Size.stringify),
|
||||
$(go.Shape,
|
||||
{ // the border
|
||||
name: "SHAPE", fill: colors.white, cursor: "pointer",
|
||||
portId: "",
|
||||
fromLinkable: true, toLinkable: true,
|
||||
fromLinkableDuplicates: true, toLinkableDuplicates: true,
|
||||
fromSpot: go.Spot.AllSides, toSpot: go.Spot.AllSides
|
||||
},
|
||||
new go.Binding("figure"),
|
||||
new go.Binding("fill"),
|
||||
new go.Binding("stroke", "color"),
|
||||
new go.Binding("strokeWidth", "thickness"),
|
||||
new go.Binding("strokeDashArray", "dash")),
|
||||
// this Shape prevents mouse events from reaching the middle of the port
|
||||
$(go.Shape, { width: 100, height: 40, strokeWidth: 0, fill: "transparent" }),
|
||||
$(go.TextBlock,
|
||||
{ margin: 1, textAlign: "center", overflow: go.TextBlock.OverflowEllipsis, editable: true },
|
||||
// this Binding is TwoWay due to the user editing the text with the TextEditingTool
|
||||
new go.Binding("text").makeTwoWay(),
|
||||
new go.Binding("stroke", "color")),
|
||||
);
|
||||
|
||||
myDiagram.nodeTemplate.toolTip =
|
||||
$("ToolTip", // show some detailed information
|
||||
$(go.Panel, "Vertical",
|
||||
{ maxSize: new go.Size(200, NaN) }, // limit width but not height
|
||||
$(go.TextBlock,
|
||||
{ font: "bold 10pt sans-serif", textAlign: "center" },
|
||||
new go.Binding("text")),
|
||||
$(go.TextBlock,
|
||||
{ font: "10pt sans-serif", textAlign: "center" },
|
||||
new go.Binding("text", "details"))
|
||||
)
|
||||
);
|
||||
|
||||
// Node selection adornment
|
||||
// Include four large triangular buttons so that the user can easily make a copy
|
||||
// of the node, move it to be in that direction relative to the original node,
|
||||
// and add a link to the new node.
|
||||
|
||||
function makeArrowButton(spot, fig) {
|
||||
var maker = (e, shape) => {
|
||||
e.handled = true;
|
||||
e.diagram.model.commit(m => {
|
||||
var selnode = shape.part.adornedPart;
|
||||
// create a new node in the direction of the spot
|
||||
var p = new go.Point().setRectSpot(selnode.actualBounds, spot);
|
||||
p.subtract(selnode.location);
|
||||
p.scale(2, 2);
|
||||
p.x += Math.sign(p.x) * 30;
|
||||
p.y += Math.sign(p.y) * 30;
|
||||
p.add(selnode.location);
|
||||
p.snapToGridPoint(e.diagram.grid.gridOrigin, e.diagram.grid.gridCellSize);
|
||||
// make the new node a copy of the selected node
|
||||
var nodedata = m.copyNodeData(selnode.data);
|
||||
// add to same group as selected node
|
||||
m.setGroupKeyForNodeData(nodedata, m.getGroupKeyForNodeData(selnode.data));
|
||||
m.addNodeData(nodedata); // add to model
|
||||
// create a link from the selected node to the new node
|
||||
var linkdata = { from: selnode.key, to: m.getKeyForNodeData(nodedata) };
|
||||
m.addLinkData(linkdata); // add to model
|
||||
// move the new node to the computed location, select it, and start to edit it
|
||||
var newnode = e.diagram.findNodeForData(nodedata);
|
||||
newnode.location = p;
|
||||
e.diagram.select(newnode);
|
||||
setTimeout(() => {
|
||||
e.diagram.commandHandler.editTextBlock();
|
||||
}, 20);
|
||||
});
|
||||
};
|
||||
return $(go.Shape,
|
||||
{
|
||||
figure: fig,
|
||||
alignment: spot, alignmentFocus: spot.opposite(),
|
||||
width: (spot.equals(go.Spot.Top) || spot.equals(go.Spot.Bottom)) ? 25 : 18,
|
||||
height: (spot.equals(go.Spot.Top) || spot.equals(go.Spot.Bottom)) ? 18 : 25,
|
||||
fill: "orange", stroke: colors.white, strokeWidth: 4,
|
||||
mouseEnter: (e, shape) => shape.fill = "dodgerblue",
|
||||
mouseLeave: (e, shape) => shape.fill = "orange",
|
||||
isActionable: true, // needed because it's in an Adornment
|
||||
click: maker, contextClick: maker
|
||||
});
|
||||
}
|
||||
|
||||
// create a button that brings up the context menu
|
||||
function CMButton(options) {
|
||||
return $(go.Shape,
|
||||
{
|
||||
fill: "orange", stroke: "rgba(0, 0, 0, 0)", strokeWidth: 15, background: "transparent",
|
||||
geometryString: "F1 M0 0 b 0 360 -4 0 4 z M10 0 b 0 360 -4 0 4 z M20 0 b 0 360 -4 0 4",// M10 0 A2 2 0 1 0 14 10 M20 0 A2 2 0 1 0 24 10,
|
||||
isActionable: true, cursor: "context-menu",
|
||||
mouseEnter: (e, shape) => shape.fill = "dodgerblue",
|
||||
mouseLeave: (e, shape) => shape.fill = "orange",
|
||||
click: (e, shape) => {
|
||||
e.diagram.commandHandler.showContextMenu(shape.part.adornedPart);
|
||||
}
|
||||
},
|
||||
options || {});
|
||||
}
|
||||
|
||||
myDiagram.nodeTemplate.selectionAdornmentTemplate =
|
||||
$(go.Adornment, "Spot",
|
||||
$(go.Placeholder, { padding: 10 }),
|
||||
makeArrowButton(go.Spot.Top, "TriangleUp"),
|
||||
makeArrowButton(go.Spot.Left, "TriangleLeft"),
|
||||
makeArrowButton(go.Spot.Right, "TriangleRight"),
|
||||
makeArrowButton(go.Spot.Bottom, "TriangleDown"),
|
||||
CMButton({ alignment: new go.Spot(0.75, 0) })
|
||||
);
|
||||
|
||||
// Common context menu button definitions
|
||||
|
||||
// All buttons in context menu work on both click and contextClick,
|
||||
// in case the user context-clicks on the button.
|
||||
// All buttons modify the node data, not the Node, so the Bindings need not be TwoWay.
|
||||
|
||||
// A button-defining helper function that returns a click event handler.
|
||||
// PROPNAME is the name of the data property that should be set to the given VALUE.
|
||||
function ClickFunction(propname, value) {
|
||||
return (e, obj) => {
|
||||
e.handled = true; // don't let the click bubble up
|
||||
e.diagram.model.commit(m => {
|
||||
m.set(obj.part.adornedPart.data, propname, value);
|
||||
});
|
||||
};
|
||||
}
|
||||
|
||||
// Create a context menu button for setting a data property with a color value.
|
||||
function ColorButton(color, propname) {
|
||||
if (!propname) propname = "color";
|
||||
return $(go.Shape,
|
||||
{
|
||||
width: 16, height: 16, stroke: "lightgray", fill: color,
|
||||
margin: 1, background: "transparent",
|
||||
mouseEnter: (e, shape) => shape.stroke = "dodgerblue",
|
||||
mouseLeave: (e, shape) => shape.stroke = "lightgray",
|
||||
click: ClickFunction(propname, color), contextClick: ClickFunction(propname, color)
|
||||
});
|
||||
}
|
||||
|
||||
function LightFillButtons() { // used by multiple context menus
|
||||
return [
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
ColorButton(colors.white, "fill"), ColorButton(colors.beige, "fill"), ColorButton(colors.extralightblue, "fill"), ColorButton(colors.extralightred, "fill")
|
||||
)
|
||||
),
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
ColorButton(colors.lightgray, "fill"), ColorButton(colors.lightgreen, "fill"), ColorButton(colors.lightblue, "fill"), ColorButton(colors.lightred, "fill")
|
||||
)
|
||||
)
|
||||
];
|
||||
}
|
||||
|
||||
function DarkColorButtons() { // used by multiple context menus
|
||||
return [
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
ColorButton(colors.black), ColorButton(colors.green), ColorButton(colors.blue), ColorButton(colors.red)
|
||||
)
|
||||
),
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
ColorButton(colors.white), ColorButton(colors.magenta), ColorButton(colors.purple), ColorButton(colors.orange)
|
||||
)
|
||||
)
|
||||
];
|
||||
}
|
||||
|
||||
// Create a context menu button for setting a data property with a stroke width value.
|
||||
function ThicknessButton(sw, propname) {
|
||||
if (!propname) propname = "thickness";
|
||||
return $(go.Shape, "LineH",
|
||||
{
|
||||
width: 16, height: 16, strokeWidth: sw,
|
||||
margin: 1, background: "transparent",
|
||||
mouseEnter: (e, shape) => shape.background = "dodgerblue",
|
||||
mouseLeave: (e, shape) => shape.background = "transparent",
|
||||
click: ClickFunction(propname, sw), contextClick: ClickFunction(propname, sw)
|
||||
});
|
||||
}
|
||||
|
||||
// Create a context menu button for setting a data property with a stroke dash Array value.
|
||||
function DashButton(dash, propname) {
|
||||
if (!propname) propname = "dash";
|
||||
return $(go.Shape, "LineH",
|
||||
{
|
||||
width: 24, height: 16, strokeWidth: 2,
|
||||
strokeDashArray: dash,
|
||||
margin: 1, background: "transparent",
|
||||
mouseEnter: (e, shape) => shape.background = "dodgerblue",
|
||||
mouseLeave: (e, shape) => shape.background = "transparent",
|
||||
click: ClickFunction(propname, dash), contextClick: ClickFunction(propname, dash)
|
||||
});
|
||||
}
|
||||
|
||||
function StrokeOptionsButtons() { // used by multiple context menus
|
||||
return [
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
ThicknessButton(1), ThicknessButton(2), ThicknessButton(3), ThicknessButton(4)
|
||||
)
|
||||
),
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
DashButton(null), DashButton([2, 4]), DashButton([4, 4])
|
||||
)
|
||||
)
|
||||
];
|
||||
}
|
||||
|
||||
// Node context menu
|
||||
|
||||
function FigureButton(fig, propname) {
|
||||
if (!propname) propname = "figure";
|
||||
return $(go.Shape,
|
||||
{
|
||||
width: 32, height: 32, scale: 0.5, fill: "lightgray", figure: fig,
|
||||
margin: 1, background: "transparent",
|
||||
mouseEnter: (e, shape) => shape.fill = "dodgerblue",
|
||||
mouseLeave: (e, shape) => shape.fill = "lightgray",
|
||||
click: ClickFunction(propname, fig), contextClick: ClickFunction(propname, fig)
|
||||
});
|
||||
}
|
||||
|
||||
myDiagram.nodeTemplate.contextMenu =
|
||||
$("ContextMenu",
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
FigureButton("Rectangle"), FigureButton("RoundedRectangle"), FigureButton("Ellipse"), FigureButton("Diamond")
|
||||
)
|
||||
),
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
FigureButton("Parallelogram2"), FigureButton("ManualOperation"), FigureButton("Procedure"), FigureButton("Cylinder1")
|
||||
)
|
||||
),
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
FigureButton("Terminator"), FigureButton("CreateRequest"), FigureButton("Document"), FigureButton("TriangleDown")
|
||||
)
|
||||
),
|
||||
LightFillButtons(),
|
||||
DarkColorButtons(),
|
||||
StrokeOptionsButtons()
|
||||
);
|
||||
|
||||
|
||||
// Group template
|
||||
|
||||
myDiagram.groupTemplate =
|
||||
$(go.Group, "Spot",
|
||||
{
|
||||
layerName: "Background",
|
||||
ungroupable: true,
|
||||
locationSpot: go.Spot.Center,
|
||||
selectionObjectName: "BODY",
|
||||
computesBoundsAfterDrag: true, // allow dragging out of a Group that uses a Placeholder
|
||||
handlesDragDropForMembers: true, // don't need to define handlers on Nodes and Links
|
||||
mouseDrop: (e, grp) => { // add dropped nodes as members of the group
|
||||
var ok = grp.addMembers(grp.diagram.selection, true);
|
||||
if (!ok) grp.diagram.currentTool.doCancel();
|
||||
},
|
||||
avoidable: false
|
||||
},
|
||||
new go.Binding("location", "loc", go.Point.parse).makeTwoWay(go.Point.stringify),
|
||||
$(go.Panel, "Auto",
|
||||
{ name: "BODY" },
|
||||
$(go.Shape,
|
||||
{
|
||||
parameter1: 10,
|
||||
fill: colors.white, strokeWidth: 2, cursor: "pointer",
|
||||
fromLinkable: true, toLinkable: true,
|
||||
fromLinkableDuplicates: true, toLinkableDuplicates: true,
|
||||
fromSpot: go.Spot.AllSides, toSpot: go.Spot.AllSides
|
||||
},
|
||||
new go.Binding("fill"),
|
||||
new go.Binding("stroke", "color"),
|
||||
new go.Binding("strokeWidth", "thickness"),
|
||||
new go.Binding("strokeDashArray", "dash")),
|
||||
$(go.Placeholder,
|
||||
{ background: "transparent", margin: 20 })
|
||||
),
|
||||
$(go.TextBlock,
|
||||
{
|
||||
alignment: go.Spot.Top, alignmentFocus: go.Spot.Bottom,
|
||||
font: "bold 12pt sans-serif", editable: true
|
||||
},
|
||||
new go.Binding("text"),
|
||||
new go.Binding("stroke", "color"))
|
||||
);
|
||||
|
||||
myDiagram.groupTemplate.selectionAdornmentTemplate =
|
||||
$(go.Adornment, "Spot",
|
||||
$(go.Panel, "Auto",
|
||||
$(go.Shape, { fill: null, stroke: "dodgerblue", strokeWidth: 3 }),
|
||||
$(go.Placeholder, { margin: 1.5 })
|
||||
),
|
||||
CMButton({ alignment: go.Spot.TopRight, alignmentFocus: go.Spot.BottomRight })
|
||||
);
|
||||
|
||||
myDiagram.groupTemplate.contextMenu =
|
||||
$("ContextMenu",
|
||||
LightFillButtons(),
|
||||
DarkColorButtons(),
|
||||
StrokeOptionsButtons()
|
||||
);
|
||||
|
||||
|
||||
// Link template
|
||||
|
||||
myDiagram.linkTemplate =
|
||||
$(go.Link,
|
||||
{
|
||||
layerName: "Foreground",
|
||||
routing: go.Link.AvoidsNodes, corner: 10,
|
||||
fromShortLength: 10, toShortLength: 15, // assume arrowhead at "to" end, need to avoid bad appearance when path is thick
|
||||
relinkableFrom: true, relinkableTo: true,
|
||||
reshapable: true, resegmentable: true
|
||||
},
|
||||
new go.Binding("fromSpot", "fromSpot", go.Spot.parse),
|
||||
new go.Binding("toSpot", "toSpot", go.Spot.parse),
|
||||
new go.Binding("fromShortLength", "dir", dir => dir >= 1 ? 10 : 0),
|
||||
new go.Binding("toShortLength", "dir", dir => dir >= 1 ? 10 : 0),
|
||||
new go.Binding("points").makeTwoWay(), // TwoWay due to user reshaping with LinkReshapingTool
|
||||
|
||||
$(go.Shape, { strokeWidth: 2 },
|
||||
new go.Binding("stroke", "color"),
|
||||
new go.Binding("strokeWidth", "thickness"),
|
||||
new go.Binding("strokeDashArray", "dash")),
|
||||
$(go.Shape, // custom arrowheads to create the lifted effect
|
||||
{
|
||||
segmentIndex: 0, segmentOffset: new go.Point(15, 0),
|
||||
segmentOrientation: go.Link.OrientAlong,
|
||||
alignmentFocus: go.Spot.Right,
|
||||
figure: "circle", width: 10, strokeWidth: 0
|
||||
},
|
||||
new go.Binding("fill", "color"),
|
||||
new go.Binding("visible", "dir", dir => dir === 1)),
|
||||
$(go.Shape,
|
||||
{
|
||||
segmentIndex: -1, segmentOffset: new go.Point(-10, 6),
|
||||
segmentOrientation: go.Link.OrientPlus90,
|
||||
alignmentFocus: go.Spot.Right,
|
||||
figure: "triangle",
|
||||
width: 12, height: 12, strokeWidth: 0
|
||||
},
|
||||
new go.Binding("fill", "color"),
|
||||
new go.Binding("visible", "dir", dir => dir >= 1),
|
||||
new go.Binding("width", "thickness", t => 7 + (3 * t)), // custom arrowhead must scale with the size of the while
|
||||
new go.Binding("height", "thickness", t => 7 + (3 * t)), // while remaining centered on line
|
||||
new go.Binding("segmentOffset", "thickness", t => new go.Point(-15, 4 + (1.5 * t)))
|
||||
),
|
||||
$(go.Shape,
|
||||
{
|
||||
segmentIndex: 0, segmentOffset: new go.Point(15, -6),
|
||||
segmentOrientation: go.Link.OrientMinus90,
|
||||
alignmentFocus: go.Spot.Right,
|
||||
figure: "triangle",
|
||||
width: 12, height: 12, strokeWidth: 0
|
||||
},
|
||||
new go.Binding("fill", "color"),
|
||||
new go.Binding("visible", "dir", dir => dir === 2),
|
||||
new go.Binding("width", "thickness", t => 7 + (3 * t)),
|
||||
new go.Binding("height", "thickness", t => 7 + (3 * t)),
|
||||
new go.Binding("segmentOffset", "thickness", t => new go.Point(-15, 4 + (1.5 * t)))
|
||||
),
|
||||
$(go.TextBlock,
|
||||
{ alignmentFocus: new go.Spot(0, 1, -4, 0), editable: true },
|
||||
new go.Binding("text").makeTwoWay(), // TwoWay due to user editing with TextEditingTool
|
||||
new go.Binding("stroke", "color"))
|
||||
);
|
||||
|
||||
myDiagram.linkTemplate.selectionAdornmentTemplate =
|
||||
$(go.Adornment, // use a special selection Adornment that does not obscure the link path itself
|
||||
$(go.Shape,
|
||||
{ // this uses a pathPattern with a gap in it, in order to avoid drawing on top of the link path Shape
|
||||
isPanelMain: true,
|
||||
stroke: "transparent", strokeWidth: 6,
|
||||
pathPattern: makeAdornmentPathPattern(2) // == thickness or strokeWidth
|
||||
},
|
||||
new go.Binding("pathPattern", "thickness", makeAdornmentPathPattern)),
|
||||
CMButton({ alignmentFocus: new go.Spot(0, 0, -6, -4) })
|
||||
);
|
||||
|
||||
function makeAdornmentPathPattern(w) {
|
||||
return $(go.Shape,
|
||||
{
|
||||
stroke: "dodgerblue", strokeWidth: 2, strokeCap: "square",
|
||||
geometryString: "M0 0 M4 2 H3 M4 " + (w + 4).toString() + " H3"
|
||||
});
|
||||
}
|
||||
|
||||
// Link context menu
|
||||
// All buttons in context menu work on both click and contextClick,
|
||||
// in case the user context-clicks on the button.
|
||||
// All buttons modify the link data, not the Link, so the Bindings need not be TwoWay.
|
||||
|
||||
function ArrowButton(num) {
|
||||
var geo = "M0 0 M8 16 M0 8 L16 8 M12 11 L16 8 L12 5";
|
||||
if (num === 0) {
|
||||
geo = "M0 0 M16 16 M0 8 L16 8";
|
||||
} else if (num === 2) {
|
||||
geo = "M0 0 M16 16 M0 8 L16 8 M12 11 L16 8 L12 5 M4 11 L0 8 L4 5";
|
||||
}
|
||||
return $(go.Shape,
|
||||
{
|
||||
geometryString: geo,
|
||||
margin: 2, background: "transparent",
|
||||
mouseEnter: (e, shape) => shape.background = "dodgerblue",
|
||||
mouseLeave: (e, shape) => shape.background = "transparent",
|
||||
click: ClickFunction("dir", num), contextClick: ClickFunction("dir", num)
|
||||
});
|
||||
}
|
||||
|
||||
function AllSidesButton(to) {
|
||||
var setter = (e, shape) => {
|
||||
e.handled = true;
|
||||
e.diagram.model.commit(m => {
|
||||
var link = shape.part.adornedPart;
|
||||
m.set(link.data, (to ? "toSpot" : "fromSpot"), go.Spot.stringify(go.Spot.AllSides));
|
||||
// re-spread the connections of other links connected with the node
|
||||
(to ? link.toNode : link.fromNode).invalidateConnectedLinks();
|
||||
});
|
||||
};
|
||||
return $(go.Shape,
|
||||
{
|
||||
width: 12, height: 12, fill: "transparent",
|
||||
mouseEnter: (e, shape) => shape.background = "dodgerblue",
|
||||
mouseLeave: (e, shape) => shape.background = "transparent",
|
||||
click: setter, contextClick: setter
|
||||
});
|
||||
}
|
||||
|
||||
function SpotButton(spot, to) {
|
||||
var ang = 0;
|
||||
var side = go.Spot.RightSide;
|
||||
if (spot.equals(go.Spot.Top)) { ang = 270; side = go.Spot.TopSide; }
|
||||
else if (spot.equals(go.Spot.Left)) { ang = 180; side = go.Spot.LeftSide; }
|
||||
else if (spot.equals(go.Spot.Bottom)) { ang = 90; side = go.Spot.BottomSide; }
|
||||
if (!to) ang -= 180;
|
||||
var setter = (e, shape) => {
|
||||
e.handled = true;
|
||||
e.diagram.model.commit(m => {
|
||||
var link = shape.part.adornedPart;
|
||||
m.set(link.data, (to ? "toSpot" : "fromSpot"), go.Spot.stringify(side));
|
||||
// re-spread the connections of other links connected with the node
|
||||
(to ? link.toNode : link.fromNode).invalidateConnectedLinks();
|
||||
});
|
||||
};
|
||||
return $(go.Shape,
|
||||
{
|
||||
alignment: spot, alignmentFocus: spot.opposite(),
|
||||
geometryString: "M0 0 M12 12 M12 6 L1 6 L4 4 M1 6 L4 8",
|
||||
angle: ang,
|
||||
background: "transparent",
|
||||
mouseEnter: (e, shape) => shape.background = "dodgerblue",
|
||||
mouseLeave: (e, shape) => shape.background = "transparent",
|
||||
click: setter, contextClick: setter
|
||||
});
|
||||
}
|
||||
|
||||
myDiagram.linkTemplate.contextMenu =
|
||||
$("ContextMenu",
|
||||
DarkColorButtons(),
|
||||
StrokeOptionsButtons(),
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
ArrowButton(0), ArrowButton(1), ArrowButton(2)
|
||||
)
|
||||
),
|
||||
$("ContextMenuButton",
|
||||
$(go.Panel, "Horizontal",
|
||||
$(go.Panel, "Spot",
|
||||
AllSidesButton(false),
|
||||
SpotButton(go.Spot.Top, false), SpotButton(go.Spot.Left, false), SpotButton(go.Spot.Right, false), SpotButton(go.Spot.Bottom, false)
|
||||
),
|
||||
$(go.Panel, "Spot",
|
||||
{ margin: new go.Margin(0, 0, 0, 2) },
|
||||
AllSidesButton(true),
|
||||
SpotButton(go.Spot.Top, true), SpotButton(go.Spot.Left, true), SpotButton(go.Spot.Right, true), SpotButton(go.Spot.Bottom, true)
|
||||
)
|
||||
)
|
||||
)
|
||||
);
|
||||
|
||||
load();
|
||||
}
|
||||
|
||||
|
||||
function myCallback(blob) {
|
||||
var url = window.URL.createObjectURL(blob);
|
||||
var filename = "myBlobFile.png";
|
||||
|
||||
var a = document.createElement("a");
|
||||
a.style = "display: none";
|
||||
a.href = url;
|
||||
a.download = filename;
|
||||
|
||||
// IE 11
|
||||
if (window.navigator.msSaveBlob !== undefined) {
|
||||
window.navigator.msSaveBlob(blob, filename);
|
||||
return;
|
||||
}
|
||||
debugger
|
||||
|
||||
document.body.appendChild(a);
|
||||
requestAnimationFrame(() => {
|
||||
a.click();
|
||||
window.URL.revokeObjectURL(url);
|
||||
document.body.removeChild(a);
|
||||
});
|
||||
}
|
||||
|
||||
// Show the diagram's model in JSON format
|
||||
function save() {
|
||||
console.log(JSON.stringify(myDiagram.model.toJson()))
|
||||
myDiagram.isModified = false;
|
||||
// 将图表保存为PNG图像
|
||||
function saveAsPng() {
|
||||
var imgs = myDiagram.makeImage();
|
||||
document.body.appendChild(imgs)
|
||||
return
|
||||
}
|
||||
|
||||
// 调用保存函数
|
||||
saveAsPng();
|
||||
}
|
||||
function load() {
|
||||
myDiagram.model = go.Model.fromJson(initData);
|
||||
}
|
||||
window.addEventListener('DOMContentLoaded', init);
|
||||
|
||||
</script>
|
||||
|
||||
<div id="myDiagramDiv"
|
||||
style="border: 1px solid black; width: 100%; height: 100vh; position: relative; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); cursor: auto; font: 13px sans-serif;">
|
||||
<canvas tabindex="0" width="1215" height="598"
|
||||
style="position: absolute; top: 0px; left: 0px; z-index: 2; user-select: none; touch-action: none; width: 1215px; height: 598px; cursor: auto;"></canvas>
|
||||
<div style="position: absolute; overflow: auto; width: 1232px; height: 598px; z-index: 1;">
|
||||
<div style="position: absolute; width: 1px; height: 604.075px;"></div>
|
||||
</div>
|
||||
</div>
|
||||
<button onclick="save()">保存图片</button>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
@ -0,0 +1,539 @@
|
||||
/* Logo 字体 */
|
||||
@font-face {
|
||||
font-family: "iconfont logo";
|
||||
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
|
||||
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
|
||||
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
|
||||
}
|
||||
|
||||
.logo {
|
||||
font-family: "iconfont logo";
|
||||
font-size: 160px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
/* tabs */
|
||||
.nav-tabs {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.nav-tabs .nav-more {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
height: 42px;
|
||||
line-height: 42px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
#tabs {
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
#tabs li {
|
||||
cursor: pointer;
|
||||
width: 100px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
font-size: 16px;
|
||||
border-bottom: 2px solid transparent;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin-bottom: -1px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
|
||||
#tabs .active {
|
||||
border-bottom-color: #f00;
|
||||
color: #222;
|
||||
}
|
||||
|
||||
.tab-container .content {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 页面布局 */
|
||||
.main {
|
||||
padding: 30px 100px;
|
||||
width: 960px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.main .logo {
|
||||
color: #333;
|
||||
text-align: left;
|
||||
margin-bottom: 30px;
|
||||
line-height: 1;
|
||||
height: 110px;
|
||||
margin-top: -50px;
|
||||
overflow: hidden;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.main .logo a {
|
||||
font-size: 160px;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.helps {
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.helps pre {
|
||||
padding: 20px;
|
||||
margin: 10px 0;
|
||||
border: solid 1px #e7e1cd;
|
||||
background-color: #fffdef;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.icon_lists {
|
||||
width: 100% !important;
|
||||
overflow: hidden;
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
.icon_lists li {
|
||||
width: 100px;
|
||||
margin-bottom: 10px;
|
||||
margin-right: 20px;
|
||||
text-align: center;
|
||||
list-style: none !important;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.icon_lists li .code-name {
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.icon_lists .icon {
|
||||
display: block;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
font-size: 42px;
|
||||
margin: 10px auto;
|
||||
color: #333;
|
||||
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
|
||||
-moz-transition: font-size 0.25s linear, width 0.25s linear;
|
||||
transition: font-size 0.25s linear, width 0.25s linear;
|
||||
}
|
||||
|
||||
.icon_lists .icon:hover {
|
||||
font-size: 100px;
|
||||
}
|
||||
|
||||
.icon_lists .svg-icon {
|
||||
/* 通过设置 font-size 来改变图标大小 */
|
||||
width: 1em;
|
||||
/* 图标和文字相邻时,垂直对齐 */
|
||||
vertical-align: -0.15em;
|
||||
/* 通过设置 color 来改变 SVG 的颜色/fill */
|
||||
fill: currentColor;
|
||||
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
|
||||
normalize.css 中也包含这行 */
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.icon_lists li .name,
|
||||
.icon_lists li .code-name {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/* markdown 样式 */
|
||||
.markdown {
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
line-height: 1.8;
|
||||
}
|
||||
|
||||
.highlight {
|
||||
line-height: 1.5;
|
||||
}
|
||||
|
||||
.markdown img {
|
||||
vertical-align: middle;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.markdown h1 {
|
||||
color: #404040;
|
||||
font-weight: 500;
|
||||
line-height: 40px;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.markdown h2,
|
||||
.markdown h3,
|
||||
.markdown h4,
|
||||
.markdown h5,
|
||||
.markdown h6 {
|
||||
color: #404040;
|
||||
margin: 1.6em 0 0.6em 0;
|
||||
font-weight: 500;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown h1 {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.markdown h2 {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.markdown h3 {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.markdown h4 {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.markdown h5 {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown h6 {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.markdown hr {
|
||||
height: 1px;
|
||||
border: 0;
|
||||
background: #e9e9e9;
|
||||
margin: 16px 0;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.markdown p {
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.markdown>p,
|
||||
.markdown>blockquote,
|
||||
.markdown>.highlight,
|
||||
.markdown>ol,
|
||||
.markdown>ul {
|
||||
width: 80%;
|
||||
}
|
||||
|
||||
.markdown ul>li {
|
||||
list-style: circle;
|
||||
}
|
||||
|
||||
.markdown>ul li,
|
||||
.markdown blockquote ul>li {
|
||||
margin-left: 20px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.markdown>ul li p,
|
||||
.markdown>ol li p {
|
||||
margin: 0.6em 0;
|
||||
}
|
||||
|
||||
.markdown ol>li {
|
||||
list-style: decimal;
|
||||
}
|
||||
|
||||
.markdown>ol li,
|
||||
.markdown blockquote ol>li {
|
||||
margin-left: 20px;
|
||||
padding-left: 4px;
|
||||
}
|
||||
|
||||
.markdown code {
|
||||
margin: 0 3px;
|
||||
padding: 0 5px;
|
||||
background: #eee;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.markdown strong,
|
||||
.markdown b {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown>table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0px;
|
||||
empty-cells: show;
|
||||
border: 1px solid #e9e9e9;
|
||||
width: 95%;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
|
||||
.markdown>table th {
|
||||
white-space: nowrap;
|
||||
color: #333;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.markdown>table th,
|
||||
.markdown>table td {
|
||||
border: 1px solid #e9e9e9;
|
||||
padding: 8px 16px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.markdown>table th {
|
||||
background: #F7F7F7;
|
||||
}
|
||||
|
||||
.markdown blockquote {
|
||||
font-size: 90%;
|
||||
color: #999;
|
||||
border-left: 4px solid #e9e9e9;
|
||||
padding-left: 0.8em;
|
||||
margin: 1em 0;
|
||||
}
|
||||
|
||||
.markdown blockquote p {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.markdown .anchor {
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
margin-left: 8px;
|
||||
}
|
||||
|
||||
.markdown .waiting {
|
||||
color: #ccc;
|
||||
}
|
||||
|
||||
.markdown h1:hover .anchor,
|
||||
.markdown h2:hover .anchor,
|
||||
.markdown h3:hover .anchor,
|
||||
.markdown h4:hover .anchor,
|
||||
.markdown h5:hover .anchor,
|
||||
.markdown h6:hover .anchor {
|
||||
opacity: 1;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.markdown>br,
|
||||
.markdown>p>br {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
|
||||
.hljs {
|
||||
display: block;
|
||||
background: white;
|
||||
padding: 0.5em;
|
||||
color: #333333;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
.hljs-comment,
|
||||
.hljs-meta {
|
||||
color: #969896;
|
||||
}
|
||||
|
||||
.hljs-string,
|
||||
.hljs-variable,
|
||||
.hljs-template-variable,
|
||||
.hljs-strong,
|
||||
.hljs-emphasis,
|
||||
.hljs-quote {
|
||||
color: #df5000;
|
||||
}
|
||||
|
||||
.hljs-keyword,
|
||||
.hljs-selector-tag,
|
||||
.hljs-type {
|
||||
color: #a71d5d;
|
||||
}
|
||||
|
||||
.hljs-literal,
|
||||
.hljs-symbol,
|
||||
.hljs-bullet,
|
||||
.hljs-attribute {
|
||||
color: #0086b3;
|
||||
}
|
||||
|
||||
.hljs-section,
|
||||
.hljs-name {
|
||||
color: #63a35c;
|
||||
}
|
||||
|
||||
.hljs-tag {
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.hljs-title,
|
||||
.hljs-attr,
|
||||
.hljs-selector-id,
|
||||
.hljs-selector-class,
|
||||
.hljs-selector-attr,
|
||||
.hljs-selector-pseudo {
|
||||
color: #795da3;
|
||||
}
|
||||
|
||||
.hljs-addition {
|
||||
color: #55a532;
|
||||
background-color: #eaffea;
|
||||
}
|
||||
|
||||
.hljs-deletion {
|
||||
color: #bd2c00;
|
||||
background-color: #ffecec;
|
||||
}
|
||||
|
||||
.hljs-link {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* 代码高亮 */
|
||||
/* PrismJS 1.15.0
|
||||
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
|
||||
/**
|
||||
* prism.js default theme for JavaScript, CSS and HTML
|
||||
* Based on dabblet (http://dabblet.com)
|
||||
* @author Lea Verou
|
||||
*/
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
color: black;
|
||||
background: none;
|
||||
text-shadow: 0 1px white;
|
||||
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-break: normal;
|
||||
word-wrap: normal;
|
||||
line-height: 1.5;
|
||||
|
||||
-moz-tab-size: 4;
|
||||
-o-tab-size: 4;
|
||||
tab-size: 4;
|
||||
|
||||
-webkit-hyphens: none;
|
||||
-moz-hyphens: none;
|
||||
-ms-hyphens: none;
|
||||
hyphens: none;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::-moz-selection,
|
||||
pre[class*="language-"] ::-moz-selection,
|
||||
code[class*="language-"]::-moz-selection,
|
||||
code[class*="language-"] ::-moz-selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
pre[class*="language-"]::selection,
|
||||
pre[class*="language-"] ::selection,
|
||||
code[class*="language-"]::selection,
|
||||
code[class*="language-"] ::selection {
|
||||
text-shadow: none;
|
||||
background: #b3d4fc;
|
||||
}
|
||||
|
||||
@media print {
|
||||
|
||||
code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
text-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre[class*="language-"] {
|
||||
padding: 1em;
|
||||
margin: .5em 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:not(pre)>code[class*="language-"],
|
||||
pre[class*="language-"] {
|
||||
background: #f5f2f0;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre)>code[class*="language-"] {
|
||||
padding: .1em;
|
||||
border-radius: .3em;
|
||||
white-space: normal;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: slategray;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #905;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #690;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #9a6e3a;
|
||||
background: hsla(0, 0%, 100%, .5);
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword {
|
||||
color: #07a;
|
||||
}
|
||||
|
||||
.token.function,
|
||||
.token.class-name {
|
||||
color: #DD4A68;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important,
|
||||
.token.variable {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
|
After Width: | Height: | Size: 1.9 MiB |
Binary file not shown.
Binary file not shown.
Binary file not shown.
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue