@bos-alpha/progress
Version:
进度管理
424 lines (423 loc) • 20.8 kB
JavaScript
var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
return cooked;
};
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
if (ar || !(i in from)) {
if (!ar) ar = Array.prototype.slice.call(from, 0, i);
ar[i] = from[i];
}
}
return to.concat(ar || Array.prototype.slice.call(from));
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { useState, useEffect, useRef } from 'react';
import { message, Table, Button, Tabs } from 'antd';
import styled from '@emotion/styled';
import * as api from '@bos-alpha/common/lib/services';
import { useAsync, Modal } from '@bos-alpha/common';
import { ConditionAdd } from './condition-add';
import { TagFilter } from './tag-filter';
import { ModelTree } from './model-tree';
// 物项关联 或 取消关联 同一个页面
// 物项管理 物项列表 + 空间信息树 两种方式来选择物项去关联任务
export var TagLink = function (_a) {
var visible = _a.visible, type = _a.type, wbsKey = _a.wbsKey, onClose = _a.onClose, onAddOk = _a.onAddOk;
// 页面tab切换
var _b = useState('table'), pageStatus = _b[0], setPageStatus = _b[1];
var _c = useAsync(), isLoading = _c.isLoading, run = _c.run;
// 分页
var _d = useState({
pageSize: 20,
total: 0
}), pagination = _d[0], setPagination = _d[1];
// 表格列
var _e = useState([]), columns = _e[0], setColumns = _e[1];
// 物项查询参数 分页+查询规则
var _f = useState({
currentPage: 1,
condition: []
}), searchParams = _f[0], setSearchParams = _f[1];
// 物项列表 已关联和未关联共用
var _g = useState([]), tagList = _g[0], setTagList = _g[1];
// 已关联物项列表暂存一份原始数据 用于前端筛选
var tagLinkedListRef = useRef([]);
// 已关联物项列表
var _h = useState([]), tagLinkedKeys = _h[0], setTagLinkedKeys = _h[1];
// 搜集所有物项类型 用于取消关联时前端筛选
var _j = useState([]), tagTypes = _j[0], setTagTypes = _j[1];
// 勾选的物项
var _k = useState([]), selectedRowKeys = _k[0], setSelectedRowKeys = _k[1];
// 正在取消或正在管理中
var _l = useState(false), fetching = _l[0], setFetching = _l[1];
// 获取可关联物项列表 后端查询和分页
useEffect(function () {
if (visible && type === 'add') {
// 获取可关联物项列表
getTagList();
}
}, [visible, searchParams]); // eslint-disable-line react-hooks/exhaustive-deps
// 获取已关联物项 只获取一次 前端筛选和分页
useEffect(function () {
if (visible) {
getLinkTagList();
}
// 关闭弹窗时 重置state
if (!visible) {
// 每次重置为物项table列表
setPageStatus('table');
setPagination({
pageSize: 20,
total: 0
});
setTagList([]);
setTagTypes([]);
setSelectedRowKeys([]);
}
else {
updateColumns();
}
}, [visible]); // eslint-disable-line react-hooks/exhaustive-deps
var updateColumns = function () {
var attrConfs = [];
var sessionSave = sessionStorage.getItem('progressAttrConfig');
if (sessionSave) {
try {
attrConfs = JSON.parse(sessionSave);
}
catch (err) { }
}
var base = [
{
title: '物项名称',
dataIndex: 'name'
},
{
title: '物项编码',
dataIndex: 'code'
},
{
title: '物项分类',
dataIndex: 'type'
}
];
setColumns(__spreadArray(__spreadArray([], base, true), attrConfs.map(function (item) { return ({
title: item.label,
dataIndex: item.value,
width: 150
}); }), true));
};
// 获取可关联物项列表
var getTagList = function () { return __awaiter(void 0, void 0, void 0, function () {
var res;
return __generator(this, function (_a) {
switch (_a.label) {
case 0: return [4 /*yield*/, run(api.queryEntity('tags', {
params: {
noRelation: true,
per_page: pagination.pageSize,
page: searchParams.currentPage
},
data: {
condition: searchParams.condition
}
}, {
noErrorHandle: true
}))];
case 1:
res = _a.sent();
if (res.code !== 'SUCCESS')
return [2 /*return*/, message.error(res.message)];
setTagList(res.data.data);
setPagination(__assign(__assign({}, pagination), { total: res.data.count }));
return [2 /*return*/];
}
});
}); };
// 获取已关联的物项列表 旧版没有做分页 新版做个前端分页
var getLinkTagList = function () { return __awaiter(void 0, void 0, void 0, function () {
var res, list_1, tagType_1, err_1;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
_a.trys.push([0, 2, , 3]);
return [4 /*yield*/, run(api.relationByType('wbses', wbsKey, {
params: {
type: 'to'
}
}))];
case 1:
res = _a.sent();
list_1 = [];
tagType_1 = [];
res.relationship.forEach(function (rel) {
if (rel.relationshipName === 'irTagWbs') {
list_1.push.apply(list_1, rel.relationshipParameter.from);
rel.relationshipParameter.from.forEach(function (tag) {
if (tag.type && tagType_1.indexOf(tag.type) === -1)
tagType_1.push(tag.type);
});
}
});
tagLinkedListRef.current = list_1;
// 新增关联时 获取已关联并置灰不可再关联
if (type === 'add') {
setTagLinkedKeys(list_1.map(function (item) { return item.key; }));
}
// 移除关联 获取已关联
else {
setTagList(list_1);
setTagTypes(tagType_1);
setPagination(__assign(__assign({}, pagination), { total: list_1.length }));
setTagLinkedKeys([]);
}
return [3 /*break*/, 3];
case 2:
err_1 = _a.sent();
return [2 /*return*/, message.error(err_1.message)];
case 3: return [2 /*return*/];
}
});
}); };
// 筛选已关联物项列表
var onTagFilter = function (vals) {
var list = tagLinkedListRef.current.filter(function (item) {
var typeMatch = false;
var modelKeyMatch = false;
var codeNameMath = false;
// 没有搜索条件
if (!vals.type)
typeMatch = true;
if (!vals.modelKey)
modelKeyMatch = true;
if (!vals.code)
codeNameMath = true;
// 类型匹配
if (vals.type &&
item.type &&
(item.type || '').indexOf(vals.type) >= 0) {
typeMatch = true;
}
// 模型匹配
if (vals.modelKey &&
item.gcomponents &&
(item.gcomponents || []).find(function (gitem) { return gitem.modelKey === vals.modelKey; })) {
modelKeyMatch = true;
}
// 编码/名称匹配
if (vals.code &&
((item.code && item.code.indexOf(vals.code) >= 0) ||
(item.name && item.name.indexOf(vals.code) >= 0))) {
codeNameMath = true;
}
return typeMatch && modelKeyMatch && codeNameMath;
});
console.log(list);
setTagList(list);
setPagination(__assign(__assign({}, pagination), { total: list.length }));
};
// 确认关联 可批量关联
var onLinkAction = function (keys) { return __awaiter(void 0, void 0, void 0, function () {
var data, ress, errs;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (keys.length < 1)
return [2 /*return*/, message.warning('至少勾选一项物项')];
data = keys.map(function (key) { return ({
bosclass: 'irTagWbs',
from: "tags/".concat(key),
to: "wbses/".concat(wbsKey)
}); });
if (fetching)
return [2 /*return*/];
setFetching(true);
return [4 /*yield*/, api.postPrototypeEdgeBatch({
data: data
}, {
noErrorHandle: true
})];
case 1:
ress = _a.sent();
errs = ress
.filter(function (res) { return res.code !== 'SUCCESS'; })
.map(function (item) { return item.message; });
if (errs.length > 0) {
return [2 /*return*/, message.error(_jsxs("div", { children: [_jsx("div", { children: "\u5173\u8054\u7269\u9879\u5931\u8D25" }, void 0), _jsx("div", { children: errs.map(function (msg, index) { return (_jsx("div", { children: msg }, index)); }) }, void 0)] }, void 0))];
}
setFetching(false);
message.success('关联成功');
onAddOk && onAddOk();
return [2 /*return*/];
}
});
}); };
// 取消关联 可以批量取消
var onUnLinkAction = function (keys) { return __awaiter(void 0, void 0, void 0, function () {
var res, delRess, errs, err_2;
return __generator(this, function (_a) {
switch (_a.label) {
case 0:
if (keys.length < 1)
return [2 /*return*/, message.warning('请勾选一项物项')];
if (fetching)
return [2 /*return*/];
setFetching(true);
_a.label = 1;
case 1:
_a.trys.push([1, 4, , 5]);
return [4 /*yield*/, api.linkedQuery({
data: {
condition: [
{
bosclass: 'wbses',
alias: 'e1'
},
{
bosclass: 'tags',
alias: 'e2',
subCondition: [
{
field: '_key',
operator: 'in',
value: keys,
number: 'false',
logic: 'Or'
}
]
},
{
bosclass: 'irTagWbs',
alias: 'e3',
type: 'relationship',
from: 'e2',
to: 'e1',
subCondition: []
}
],
select: {
irTagWbs: 'e3'
}
}
})];
case 2:
res = _a.sent();
return [4 /*yield*/, api.deletePrototypeEdgesBatch('irTagWbs', {
data: res.data.map(function (item) { return item.irTagWbs._key; })
}, {
noErrorHandle: true
})];
case 3:
delRess = _a.sent();
if (delRess instanceof Array) {
errs = delRess
.filter(function (res) { return res.code !== 'SUCCESS'; })
.map(function (item) { return item.message; });
if (errs.length > 0) {
return [2 /*return*/, message.error(_jsxs("div", { children: [_jsx("div", { children: "\u53D6\u6D88\u5173\u8054\u7269\u9879\u5931\u8D25" }, void 0), _jsx("div", { children: errs.map(function (msg, index) { return (_jsx("div", { children: msg }, index)); }) }, void 0)] }, void 0))];
}
message.success('已取消关联');
onAddOk && onAddOk();
}
else {
message.error(delRess.message);
}
setFetching(false);
return [3 /*break*/, 5];
case 4:
err_2 = _a.sent();
setFetching(false);
return [3 /*break*/, 5];
case 5: return [2 /*return*/];
}
});
}); };
var linkBtns = {
add: {
topComp: (_jsx(ConditionAdd, { onSearch: function (rules) {
setSearchParams({
currentPage: 1,
condition: rules
});
} }, void 0)),
title: '确认关联',
action: function () { return onLinkAction(selectedRowKeys); }
},
remove: {
topComp: _jsx(TagFilter, { tagTypes: tagTypes, onSearch: onTagFilter }, void 0),
title: '取消关联',
action: function () { return onUnLinkAction(selectedRowKeys); }
}
};
// 物项列表 or 空间信息树
var pageComp = {
table: (_jsxs("div", { children: [linkBtns[type].topComp, _jsx("div", __assign({ className: "link-btn" }, { children: _jsx(CustomButton, __assign({ type: "primary", disabled: selectedRowKeys.length < 1 || fetching, onClick: linkBtns[type].action }, { children: linkBtns[type].title }), void 0) }), void 0), _jsx(Table, { bordered: true, rowKey: "key", size: "small", loading: isLoading, columns: columns, dataSource: tagList, rowSelection: {
selectedRowKeys: selectedRowKeys,
getCheckboxProps: function (record) { return ({
disabled: type === 'add'
? tagLinkedKeys.indexOf(record.key) >= 0
: false
}); },
onChange: function (keys) { return setSelectedRowKeys(keys); }
}, pagination: __assign(__assign({}, pagination), { showSizeChanger: false, onChange: function (page) {
setSearchParams(__assign(__assign({}, searchParams), { currentPage: page }));
} }), scroll: {
y: 400
} }, void 0)] }, void 0)),
tree: (_jsx(ModelTree, { type: type, wbsKey: wbsKey, tagLinkedKeys: tagLinkedKeys, onLink: onLinkAction, onUnlink: onUnLinkAction }, void 0))
};
return (_jsx(Modal, __assign({ visible: visible, title: type === 'add' ? '关联物项配置' : '已关联物项', width: "90%", onCancel: onClose, footer: null, destroyOnClose: true }, { children: _jsxs(Container, { children: [_jsxs(Tabs, __assign({ activeKey: pageStatus, onChange: function (key) {
return setPageStatus(key);
} }, { children: [_jsx(Tabs.TabPane, { tab: "\u7269\u9879\u5217\u8868" }, "table"), _jsx(Tabs.TabPane, { tab: "\u7A7A\u95F4\u4FE1\u606F\u6811" }, "tree")] }), void 0), pageComp[pageStatus]] }, void 0) }), void 0));
};
var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n .link-btn {\n padding: 10px 0;\n text-align: right;\n }\n"], ["\n .link-btn {\n padding: 10px 0;\n text-align: right;\n }\n"])));
var CustomButton = styled(Button)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n width: 120px;\n border-radius: 22px;\n"], ["\n width: 120px;\n border-radius: 22px;\n"])));
var templateObject_1, templateObject_2;