|
|
@@ -19,8 +19,9 @@ import {TabulatorFull as Tabulator} from "tabulator-tables"; //import Tabulator
|
|
|
import "tabulator-tables/dist/css/tabulator.min.css"; //import Tabulator stylesheet
|
|
|
import './Tabulator.css';
|
|
|
import { DataGrid } from '@mui/x-data-grid';
|
|
|
-import {extractFuzhu} from './utils';
|
|
|
+import {extractFuzhu, match_target} from './utils';
|
|
|
import Button from '@mui/material/Button';
|
|
|
+import {shanchu_djcs, undo_djcs, redo_djcs, danxiangdinge_djcs, updateDercj_djcs, changguidinge, handleBeizhu, huan, updateShuliang_djcs} from './editor';
|
|
|
|
|
|
import { textRenderer, registerRenderer } from 'handsontable/renderers';
|
|
|
|
|
|
@@ -33,97 +34,24 @@ function number_equal(a, b) {
|
|
|
}
|
|
|
return false;
|
|
|
}
|
|
|
-export default function Djcs2({name, bh, rgde, jxde, clde, beizhu, clickCallback}) {
|
|
|
-
|
|
|
- registerRenderer('customStylesRenderer', (hotInstance, TD, row, column, prop, value, ...rest) => {
|
|
|
- let newValue = value;
|
|
|
- if ((column == 10 || column == 11 || column == 5) && row > 0) {
|
|
|
- newValue = Number(value).toFixed(2).toString();
|
|
|
- }
|
|
|
- textRenderer(hotInstance, TD, row, column, prop, newValue, ...rest);
|
|
|
- for (let i = 0; i < highlight.current.length; i++) {
|
|
|
- let entry = highlight.current[i];
|
|
|
- if (entry.row == row && entry.col == column) {
|
|
|
- TD.style.fontWeight = 'bold';
|
|
|
- TD.style.color = 'green';
|
|
|
- TD.style.background = '#d7f1e1';
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
-
|
|
|
-
|
|
|
- const [detail, setDetail] = React.useState([
|
|
|
-
|
|
|
- ]);
|
|
|
- const myRef = React.useRef(null);
|
|
|
- const myTable = React.useRef(null);
|
|
|
- const [value, setValue] = React.useState("1");
|
|
|
- const [rcjhl, setRcjhl] = React.useState([]);
|
|
|
- const [rcjhl2, setRcjhl2] = React.useState([]);
|
|
|
- const [fuzhu, setFuzhu] = React.useState([]);
|
|
|
- const [tuijian, setTuijian] = React.useState([]);
|
|
|
- const [fuzhuEnable, setFuzhuEnable] = React.useState(false);
|
|
|
- const [rowSelectionModel, setRowSelectionModel] = React.useState({
|
|
|
- type: 'include',
|
|
|
- ids: new Set(),
|
|
|
- });
|
|
|
- const highlight = React.useRef([]);
|
|
|
-
|
|
|
-
|
|
|
- const rgdeRef = React.useRef(null);
|
|
|
- const jxdeRef = React.useRef(null);
|
|
|
- const cldeRef = React.useRef(null);
|
|
|
- const isQdrcj = React.useRef(false);
|
|
|
- const debmRef = React.useRef(null);
|
|
|
+export default function Djcs2({name, bh, rgde, jxde, clde, beizhu, clickCallback, loadingCallback}) {
|
|
|
|
|
|
|
|
|
- React.useEffect(() => {
|
|
|
- myTable.current = new Tabulator(myRef.current, {
|
|
|
- height: 380,
|
|
|
- data: detail, //link data to table
|
|
|
- reactiveData: false, //enable data reactivity
|
|
|
- dataTreeStartExpanded:true,
|
|
|
- dataTree: true,
|
|
|
- selectableRows:1, //make rows selectable
|
|
|
- editTriggerEvent:"dblclick", //trigger edit on double click
|
|
|
- dataTreeStartExpanded:function(row, level){
|
|
|
- //console.log(row);
|
|
|
- //console.log(level);
|
|
|
- return true; //expand rows where the "driver" data field is true;
|
|
|
- },
|
|
|
- columns: [ //Define Table Columns
|
|
|
- {title:"序号", field:"序号", width:80, headerSort:false, frozen: true}, //never hide this column
|
|
|
- {title:"清单编码", field:"清单编码", width:120,headerSort:false, frozen: true },
|
|
|
- {title:"名称", field:"名称", width:150, headerSort:false, formatter:"textarea"}, //hide this column first
|
|
|
- {title:"项目特征", field:"项目特征", width:150 , headerSort:false, formatter:"textarea"},
|
|
|
- {title:"计算规则", field:"计算规则", width:150, headerSort:false, formatter:"textarea"},
|
|
|
- {title:"单位", field:"单位", width:100, headerSort:false},
|
|
|
- {title:"数量", field:"数量", width:100, headerSort:false},
|
|
|
- {title:"综合单价", field:"综合单价", width:100, headerSort:false},
|
|
|
- {title:"合价", field:"合价", width:100, headerSort:false},
|
|
|
- {title:"人工费", field:"人工费", width:100, headerSort:false},
|
|
|
- {title:"主材费", field:"主材费", width:100, headerSort:false},
|
|
|
- {title:"设备费", field:"设备费", width:100, headerSort:false},
|
|
|
- {title:"辅材费", field:"辅材费", width:100, headerSort:false},
|
|
|
- {title:"材料费", field:"材料费", width:100, headerSort:false},
|
|
|
- {title:"机械费", field:"机械费", width:100, headerSort:false},
|
|
|
- {title:"管理费", field:"管理费", width:100, headerSort:false},
|
|
|
- {title:"利润", field:"利润", width:100, headerSort:false},
|
|
|
- {title:"暂估价", field:"暂估价", width:100, headerSort:false},
|
|
|
- {title:"综合人工工日", field:"综合人工工日", width:100, headerSort:false},
|
|
|
- ]
|
|
|
- });
|
|
|
+ var editCheck = function(cell){
|
|
|
+ //cell - the cell component for the editable cell
|
|
|
|
|
|
- myTable.current.on("cellDblClick", function(e, cell){
|
|
|
- //e - the click event object
|
|
|
- //cell - cell component
|
|
|
- console.log(cell);
|
|
|
- });
|
|
|
+ //get row data
|
|
|
+ //console.log(cell);
|
|
|
+ if(cell._cell.row.data['序号']) return false;
|
|
|
+ return true;
|
|
|
+ }
|
|
|
|
|
|
- myTable.current.on("rowSelected", function(row){
|
|
|
+
|
|
|
+ function handleSelect(row){
|
|
|
//e - the click event object
|
|
|
//cell - cell component
|
|
|
- console.log(row);
|
|
|
+ console.log('rowSelected');
|
|
|
+ selectedRowKeys.current = [row._row['data']['key']];
|
|
|
let bt = "Djcs" ;
|
|
|
|
|
|
if (row._row.data['序号'] != null && row._row.data['序号'].length >0) {
|
|
|
@@ -208,17 +136,147 @@ export default function Djcs2({name, bh, rgde, jxde, clde, beizhu, clickCallback
|
|
|
highlight.current = toHighlight;
|
|
|
});
|
|
|
}
|
|
|
+ }
|
|
|
+
|
|
|
+ registerRenderer('customStylesRenderer', (hotInstance, TD, row, column, prop, value, ...rest) => {
|
|
|
+ let newValue = value;
|
|
|
+ if ((column == 10 || column == 11 || column == 5) && row > 0) {
|
|
|
+ newValue = Number(value).toFixed(2).toString();
|
|
|
+ }
|
|
|
+ textRenderer(hotInstance, TD, row, column, prop, newValue, ...rest);
|
|
|
+ for (let i = 0; i < highlight.current.length; i++) {
|
|
|
+ let entry = highlight.current[i];
|
|
|
+ if (entry.row == row && entry.col == column) {
|
|
|
+ TD.style.fontWeight = 'bold';
|
|
|
+ TD.style.color = 'green';
|
|
|
+ TD.style.background = '#d7f1e1';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ const [detail, setDetail] = React.useState([
|
|
|
+
|
|
|
+ ]);
|
|
|
+ const hotRcjRef = React.useRef(null);
|
|
|
+ const myRef = React.useRef(null);
|
|
|
+ const myTable = React.useRef(null);
|
|
|
+ const [value, setValue] = React.useState("1");
|
|
|
+ const [rcjhl, setRcjhl] = React.useState([]);
|
|
|
+ const [rcjhl2, setRcjhl2] = React.useState([]);
|
|
|
+ const [fuzhu, setFuzhu] = React.useState([]);
|
|
|
+ const [tuijian, setTuijian] = React.useState([]);
|
|
|
+ const [fuzhuEnable, setFuzhuEnable] = React.useState(false);
|
|
|
+ const [rowSelectionModel, setRowSelectionModel] = React.useState({
|
|
|
+ type: 'include',
|
|
|
+ ids: new Set(),
|
|
|
+ });
|
|
|
+ const highlight = React.useRef([]);
|
|
|
+
|
|
|
+
|
|
|
+ const rgdeRef = React.useRef(null);
|
|
|
+ const jxdeRef = React.useRef(null);
|
|
|
+ const cldeRef = React.useRef(null);
|
|
|
+ const isQdrcj = React.useRef(false);
|
|
|
+ const debmRef = React.useRef(null);
|
|
|
+ const selectedRowKeys = React.useRef([]);
|
|
|
+ const afterChange = (changes, source) => {
|
|
|
+ if (changes == null || changes.every(x=>x[2] == x[3])) {
|
|
|
+
|
|
|
+ } else {
|
|
|
+ let data = hotRcjRef.current?.hotInstance?.getData();
|
|
|
+ for(let i = 1; i < data.length; i++) {
|
|
|
+ data[i][11] = Number(data[i][10]) * Number(data[i][5]);
|
|
|
+ }
|
|
|
+ setRcjhl(data);
|
|
|
+
|
|
|
+ let newData = updateDercj_djcs(selectedRowKeys.current[0], data);
|
|
|
+ myTable.current.updateData(newData).then(function() {
|
|
|
+ let getRow = myTable.current.getSelectedRows(); //get array of currently selected row components.
|
|
|
+ //getRow[0].select();
|
|
|
+ handleSelect(getRow[0]);
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ }
|
|
|
+ };
|
|
|
+
|
|
|
+ React.useEffect(() => {
|
|
|
+ myTable.current = new Tabulator(myRef.current, {
|
|
|
+ index: "key",
|
|
|
+ height: 380,
|
|
|
+ data: detail, //link data to table
|
|
|
+ reactiveData: false, //enable data reactivity
|
|
|
+ dataTreeStartExpanded:true,
|
|
|
+ dataTree: true,
|
|
|
+ selectableRows:1, //make rows selectable
|
|
|
+ editTriggerEvent:"dblclick", //trigger edit on double click
|
|
|
+ dataTreeStartExpanded:function(row, level){
|
|
|
+ //console.log(row);
|
|
|
+ //console.log(level);
|
|
|
+ return true; //expand rows where the "driver" data field is true;
|
|
|
+ },
|
|
|
+ columns: [ //Define Table Columns
|
|
|
+ {title:"序号", field:"序号", width:80, headerSort:false, frozen: true}, //never hide this column
|
|
|
+ {title:"清单编码", field:"清单编码", width:120,headerSort:false, frozen: true },
|
|
|
+ {title:"名称", field:"名称", width:150, headerSort:false, formatter:"textarea"}, //hide this column first
|
|
|
+ {title:"项目特征", field:"项目特征", width:150 , headerSort:false, formatter:"textarea"},
|
|
|
+ {title:"计算规则", field:"计算规则", width:150, headerSort:false, formatter:"textarea"},
|
|
|
+ {title:"单位", field:"单位", width:100, headerSort:false},
|
|
|
+ {title:"数量", field:"数量", width:100, headerSort:false, editor: "input", editable: editCheck },
|
|
|
+ {title:"综合单价", field:"综合单价", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"合价", field:"合价", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"人工费", field:"人工费", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"主材费", field:"主材费", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"设备费", field:"设备费", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"辅材费", field:"辅材费", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"材料费", field:"材料费", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"机械费", field:"机械费", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"管理费", field:"管理费", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"利润", field:"利润", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"暂估价", field:"暂估价", width:100, headerSort:false, formatter:"money"},
|
|
|
+ {title:"综合人工工日", field:"综合人工工日", width:100, headerSort:false},
|
|
|
+ ]
|
|
|
+ });
|
|
|
+
|
|
|
+ myTable.current.on("cellDblClick", function(e, cell){
|
|
|
+ //e - the click event object
|
|
|
+ //cell - cell component
|
|
|
+ console.log(cell);
|
|
|
});
|
|
|
|
|
|
+ myTable.current.on("rowSelected", handleSelect);
|
|
|
+
|
|
|
+
|
|
|
myTable.current.on("cellEdited", function(cell){
|
|
|
- console.log("edited");
|
|
|
- console.log(cell._cell.row.data);
|
|
|
- let row = cell._cell.row
|
|
|
- while(row.modules.dataTree.parent) {
|
|
|
- row = row.modules.dataTree.parent;
|
|
|
+ //console.log("edited");
|
|
|
+ //console.log();
|
|
|
+ let key = cell._cell.row.data['key'];
|
|
|
+
|
|
|
+ let [success, data] = updateShuliang_djcs(cell._cell.row.data['数量'], selectedRowKeys.current[0]);
|
|
|
+ if (success) {
|
|
|
+ myTable.current.updateData(data).then(function() {
|
|
|
+ let getRow = myTable.current.getRows(); //get array of currently selected row components.
|
|
|
+ let component = null;
|
|
|
+ for(let i = 0; i < getRow.length; i++) {
|
|
|
+ let entry = getRow[i]._row.modules.dataTree.children;
|
|
|
+ for(let j = 0; j < entry.length; j++) {
|
|
|
+ let child = entry[j];
|
|
|
+ if(child.data['key'] == key) {
|
|
|
+ //console.log(child);
|
|
|
+ component = child.component;
|
|
|
+ break;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ component.select();
|
|
|
+ handleSelect(component);
|
|
|
+ //handleSelect(getRow[0]);
|
|
|
+ });
|
|
|
+
|
|
|
}
|
|
|
- cell._cell.row.component.select();
|
|
|
- console.log(row);
|
|
|
});
|
|
|
|
|
|
|
|
|
@@ -231,13 +289,7 @@ export default function Djcs2({name, bh, rgde, jxde, clde, beizhu, clickCallback
|
|
|
}, [bh]);
|
|
|
|
|
|
|
|
|
- /*React.useEffect(
|
|
|
- () => {
|
|
|
- Service.generateDjcs(name, bh).then(x=>{
|
|
|
- myTable.current.replaceData(x);
|
|
|
- });
|
|
|
- }, [bh]
|
|
|
- );*/
|
|
|
+
|
|
|
React.useEffect(
|
|
|
() => {
|
|
|
console.log(beizhu);
|
|
|
@@ -356,12 +408,17 @@ export default function Djcs2({name, bh, rgde, jxde, clde, beizhu, clickCallback
|
|
|
<Stack spacing={1}>
|
|
|
<Stack direction='row' spacing={2}>
|
|
|
<Button variant="outlined" size="small" onClick={() => {
|
|
|
- if (selectedRowKeys.length > 0) {
|
|
|
- const [success, data] = danxiangdinge(selectedRowKeys[0]);
|
|
|
+ if (selectedRowKeys.current.length > 0) {
|
|
|
+ const [success, data] = danxiangdinge_djcs(selectedRowKeys.current[0]);
|
|
|
if(success) {
|
|
|
- setDetail(data);
|
|
|
- detailRef.current = data;
|
|
|
- setExpandedRowKeys([...expandedRowKeys, selectedRowKeys[0]]);
|
|
|
+ myTable.current.updateData(data).then(function(){
|
|
|
+ selectedRowKeys.current = [];
|
|
|
+ setRcjhl([]);
|
|
|
+ setFuzhu([]);
|
|
|
+ isQdrcj.current = true;
|
|
|
+ highlight.current = [];
|
|
|
+ });
|
|
|
+ //console.log(data);
|
|
|
}
|
|
|
}
|
|
|
|
|
|
@@ -369,14 +426,18 @@ export default function Djcs2({name, bh, rgde, jxde, clde, beizhu, clickCallback
|
|
|
}}
|
|
|
>单项定额</Button>
|
|
|
<Button variant="outlined" size="small" onClick={() => {
|
|
|
- if (selectedRowKeys.length > 0) {
|
|
|
- let newData = shanchu(selectedRowKeys[0]);
|
|
|
- setDetail(newData);
|
|
|
- detailRef.current = newData;
|
|
|
- if (newData.filter(x=>x['key'] == selectedRowKeys[0]).length == 0) {
|
|
|
- setSelectedRowKeys([]);
|
|
|
- handleSelection([]);
|
|
|
- }
|
|
|
+ if (selectedRowKeys.current.length > 0) {
|
|
|
+ let newData = shanchu_djcs(selectedRowKeys.current[0]);
|
|
|
+ myTable.current.updateData(newData).then(function(){
|
|
|
+ if (newData.filter(x=>x['key'] == selectedRowKeys.current[0]).length == 0) {
|
|
|
+ selectedRowKeys.current = [];
|
|
|
+ setRcjhl([]);
|
|
|
+ setFuzhu([]);
|
|
|
+ isQdrcj.current = true;
|
|
|
+ highlight.current = [];
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
|
|
|
|
|
|
}
|
|
|
@@ -386,30 +447,32 @@ export default function Djcs2({name, bh, rgde, jxde, clde, beizhu, clickCallback
|
|
|
}}
|
|
|
>删除</Button>
|
|
|
<Button variant="outlined" size="small" onClick={() => {
|
|
|
- let newData = undo();
|
|
|
- setDetail(newData);
|
|
|
- detailRef.current = newData;
|
|
|
- if (newData.filter(x=>x['key'] == selectedRowKeys[0]).length == 0
|
|
|
- && newData.filter(x=>x["children"].filter(y=>y['key']==selectedRowKeys[0]).length > 0).length == 0) {
|
|
|
- setSelectedRowKeys([]);
|
|
|
- handleSelection([]);
|
|
|
- } else {
|
|
|
- handleSelection(selectedRowKeys);
|
|
|
- }
|
|
|
+ let newData = undo_djcs();
|
|
|
+ myTable.current.updateData(newData).then(function(){
|
|
|
+
|
|
|
+ selectedRowKeys.current = [];
|
|
|
+ setRcjhl([]);
|
|
|
+ setFuzhu([]);
|
|
|
+ isQdrcj.current = true;
|
|
|
+ highlight.current = [];
|
|
|
+
|
|
|
+
|
|
|
+ });
|
|
|
+
|
|
|
|
|
|
}}
|
|
|
>撤销</Button>
|
|
|
<Button variant="outlined" size="small" onClick={() => {
|
|
|
- let newData = redo();
|
|
|
- setDetail(newData);
|
|
|
- detailRef.current = newData;
|
|
|
- if (newData.filter(x=>x['key'] == selectedRowKeys[0]).length == 0
|
|
|
- && newData.filter(x=>x["children"].filter(y=>y['key']==selectedRowKeys[0]).length > 0).length == 0) {
|
|
|
- setSelectedRowKeys([]);
|
|
|
- handleSelection([]);
|
|
|
- } else {
|
|
|
- handleSelection(selectedRowKeys);
|
|
|
- }
|
|
|
+ let newData = redo_djcs();
|
|
|
+ myTable.current.updateData(newData).then(function(){
|
|
|
+ selectedRowKeys.current = [];
|
|
|
+ setRcjhl([]);
|
|
|
+ setFuzhu([]);
|
|
|
+ isQdrcj.current = true;
|
|
|
+ highlight.current = [];
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
|
|
|
}}
|
|
|
>重做</Button>
|
|
|
@@ -441,9 +504,21 @@ export default function Djcs2({name, bh, rgde, jxde, clde, beizhu, clickCallback
|
|
|
data={rcjhl
|
|
|
}
|
|
|
cells={(row, col) => {
|
|
|
- return { readOnly: true, renderer: "customStylesRenderer" };
|
|
|
+ if (isQdrcj.current) return {readOnly: true, renderer: "customStylesRenderer"};
|
|
|
+ if (col == 8) {
|
|
|
+ return { readOnly: true, renderer: "customStylesRenderer" };
|
|
|
+ }
|
|
|
+ if (col <= 1 || col >= 11) {
|
|
|
+ return { readOnly: true, renderer: "customStylesRenderer" };
|
|
|
+ } else if (row == 0){
|
|
|
+ return { readOnly: true, renderer: "customStylesRenderer" };
|
|
|
+ } else {
|
|
|
+ return { readOnly: false, renderer: "customStylesRenderer" };
|
|
|
+ }
|
|
|
|
|
|
}}
|
|
|
+ afterChange={afterChange}
|
|
|
+ ref = {hotRcjRef}
|
|
|
manualColumnResize={true}
|
|
|
rowHeaders={true}
|
|
|
colHeaders={true}
|