|
|
@@ -1,5 +1,6 @@
|
|
|
import * as React from 'react';
|
|
|
-
|
|
|
+import ClearIcon from '@mui/icons-material/Clear';
|
|
|
+import Button from '@mui/material/Button';
|
|
|
import Service from './Service';
|
|
|
import { v4 as uuidv4 } from 'uuid';
|
|
|
import { useNavigate } from "react-router";
|
|
|
@@ -20,19 +21,25 @@ import Select from '@mui/material/Select';
|
|
|
import {copy} from './utils';
|
|
|
import {TabulatorFull as Tabulator} from "tabulator-tables"; //import Tabulator library
|
|
|
import './Tabulator.css';
|
|
|
-export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallback, jgzsCallback, updatetime}) {
|
|
|
+export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallback, jgzsCallback, jgfbCallback, updatetime}) {
|
|
|
const myTable = React.useRef(null);
|
|
|
const myRef = React.useRef(null);
|
|
|
const rgRef = React.useRef(null);
|
|
|
const xxjRef = React.useRef(null);
|
|
|
+ const lsjRef = React.useRef(null);
|
|
|
const jxRef = React.useRef(null);
|
|
|
const rgTable = React.useRef(null);
|
|
|
const xxjTable = React.useRef(null);
|
|
|
+ const lsjTable = React.useRef(null);
|
|
|
const jxTable = React.useRef(null);
|
|
|
const [detail, setDetail] = React.useState([]);
|
|
|
const [city, setCity] = React.useState('南通');
|
|
|
const [month, setMonth] = React.useState('');
|
|
|
+ const [mingcheng, setMingcheng] = React.useState('');
|
|
|
+ const [danwei, setDanwei] = React.useState('');
|
|
|
+ const [bianma, setBianma] = React.useState('');
|
|
|
const [showXxj, setShowXxj] = React.useState(false);
|
|
|
+ const [showLsj, setShowLsj] = React.useState(false);
|
|
|
const navigate = useNavigate();
|
|
|
const [valueTab, setValueTab] = React.useState("1");
|
|
|
const [rgtz, setRgtz] = React.useState([
|
|
|
@@ -52,6 +59,7 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
const handleChange = (event, newValue) => {
|
|
|
setValueTab(newValue);
|
|
|
setShowXxj(false);
|
|
|
+ setShowLsj(false);
|
|
|
setMonth('');
|
|
|
};
|
|
|
const handleChangeCity = (event) => {
|
|
|
@@ -74,6 +82,11 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
title: '信息价',
|
|
|
description: '各地区对应信息价、参考价',
|
|
|
},
|
|
|
+ {
|
|
|
+ id: 3,
|
|
|
+ title: '历史价',
|
|
|
+ description: '参考企业历史报价',
|
|
|
+ },
|
|
|
];
|
|
|
|
|
|
var editCheckRcj = function(cell){
|
|
|
@@ -107,14 +120,55 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
|
|
|
function handleSelect(row){
|
|
|
console.log(row._row.data);
|
|
|
+ setMingcheng(row._row.data['名称'])
|
|
|
+ setDanwei(row._row.data['单位'])
|
|
|
+ setBianma(row._row.data['编码'])
|
|
|
+ if (lsjTable.current != null) {
|
|
|
+ Service.generateLsj(row._row.data['编码'], row._row.data['名称'], row._row.data['单位'], navigate).then(x=>{
|
|
|
+ lsjTable.current.replaceData(x);
|
|
|
+ });
|
|
|
+
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
+ React.useEffect(() => {
|
|
|
+ if (lsjRef.current != null ) {
|
|
|
+ lsjTable.current = new Tabulator(lsjRef.current, {
|
|
|
+ index: "key",
|
|
|
+ height: 300,
|
|
|
+ data: xxj, //link data to table
|
|
|
+ reactiveData: false, //enable data reactivity
|
|
|
+ dataTreeStartExpanded:false,
|
|
|
+ dataTree: false,
|
|
|
+ selectableRows:1, //make rows selectable
|
|
|
+ editTriggerEvent:"dblclick",
|
|
|
+ renderVertical: "basic",
|
|
|
+
|
|
|
+ columns: [ //Define Table Columns
|
|
|
+ {title:"名称", field:"名称", width:300,headerSort:false, formatter:"textarea",editable: false, headerFilter: "input" },
|
|
|
+ {title:"规格", field:"规格", width:100,headerSort:false, formatter:"textarea",editable: false },
|
|
|
+ {title:"单位", field:"单位", width:100, headerSort:false, formatter:"textarea"}, //hide this column first
|
|
|
+ {title:"除税单价", field:"除税单价", width:100 , headerSort:false, formatter: "textarea", editable: false},
|
|
|
+
|
|
|
+ ]
|
|
|
+ });
|
|
|
+ lsjTable.current.on("tableBuilt", () => {
|
|
|
+ console.log(mingcheng);
|
|
|
+ console.log(danwei);
|
|
|
+ console.log(bianma);
|
|
|
+ Service.generateLsj(bianma, mingcheng, danwei, navigate).then(x=>{
|
|
|
+ lsjTable.current.replaceData(x);
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ }, [showLsj]);
|
|
|
|
|
|
React.useEffect(() => {
|
|
|
if (xxjRef.current != null ) {
|
|
|
xxjTable.current = new Tabulator(xxjRef.current, {
|
|
|
index: "key",
|
|
|
- height: 240,
|
|
|
+ height: 300,
|
|
|
data: xxj, //link data to table
|
|
|
reactiveData: false, //enable data reactivity
|
|
|
dataTreeStartExpanded:false,
|
|
|
@@ -124,8 +178,8 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
renderVertical: "basic",
|
|
|
|
|
|
columns: [ //Define Table Columns
|
|
|
- {title:"名称", field:"名称", width:120,headerSort:false, formatter:"textarea",editable: false, headerFilter: "input" },
|
|
|
- {title:"规格", field:"规格", width:120,headerSort:false, formatter:"textarea",editable: false },
|
|
|
+ {title:"名称", field:"名称", width:200,headerSort:false, formatter:"textarea",editable: false, headerFilter: "input" },
|
|
|
+ {title:"规格", field:"规格", width:200,headerSort:false, formatter:"textarea",editable: false },
|
|
|
{title:"单位", field:"单位", width:100, headerSort:false, formatter:"textarea"}, //hide this column first
|
|
|
{title:"除税单价", field:"除税单价", width:100 , headerSort:false, formatter: "textarea", editable: false},
|
|
|
{title:"含税单价", field:"含税单价", width:100 , headerSort:false, formatter: "textarea", editable: false},
|
|
|
@@ -235,7 +289,7 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
React.useEffect(() => {
|
|
|
myTable.current = new Tabulator(myRef.current, {
|
|
|
index: "key",
|
|
|
- height: 400,
|
|
|
+ height: 480,
|
|
|
data: detail, //link data to table
|
|
|
reactiveData: false, //enable data reactivity
|
|
|
dataTreeStartExpanded:true,
|
|
|
@@ -248,9 +302,9 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
return true; //expand rows where the "driver" data field is true;
|
|
|
},
|
|
|
columns: [ //Define Table Columns
|
|
|
- {title:"ID", field:"ID", width:80, headerSort:false,}, //never hide this column
|
|
|
- {title:"编码", field:"编码", width:120,headerSort:false,headerFilter:"input" },
|
|
|
- {title:"名称", field:"名称", width:150, headerSort:false, formatter:"textarea", headerFilter:"input"}, //hide this column first
|
|
|
+ {title:"ID", field:"ID", width:80, headerSort:false, frozen: true}, //never hide this column
|
|
|
+ {title:"编码", field:"编码", width:120,headerSort:true,headerFilter:"input", frozen: true, sorter: "string" },
|
|
|
+ {title:"名称", field:"名称", width:150, headerSort:false, formatter:"textarea", headerFilter:"input", frozen: true}, //hide this column first
|
|
|
{title:"规格型号", field:"规格型号", width:70 , headerSort:false, formatter:"textarea"},
|
|
|
{title:"单位", field:"单位", width:50, headerSort:false},
|
|
|
{title:"数量", field:"数量", width:100, headerSort:true, sorter:"number", formatter:"money", formatterParams:{
|
|
|
@@ -332,7 +386,7 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
</TabPanel>
|
|
|
<TabPanel sx={{p: 1}} value="3">
|
|
|
|
|
|
- {!showXxj && <Box
|
|
|
+ {!showXxj && !showLsj && <Box
|
|
|
sx={{
|
|
|
width: '100%',
|
|
|
display: 'grid',
|
|
|
@@ -345,7 +399,8 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
<CardActionArea
|
|
|
onClick={() => {
|
|
|
if (index == 0) jgzsCallback(id, bh, index)
|
|
|
- else setShowXxj(true)
|
|
|
+ if (index == 2) setShowLsj(true)
|
|
|
+ if (index == 1) setShowXxj(true)
|
|
|
}
|
|
|
}
|
|
|
sx={{
|
|
|
@@ -367,7 +422,7 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
|
|
|
}
|
|
|
|
|
|
- {showXxj && <div>
|
|
|
+ {showXxj && !showLsj && <div>
|
|
|
<div>
|
|
|
<FormControl sx={{ m: 1, minWidth: 120 }} size="small">
|
|
|
<InputLabel htmlFor="grouped-native-select">地区</InputLabel>
|
|
|
@@ -383,10 +438,17 @@ export default function Rcjhz({id, bh, tiaojiaCallback, rgtzCallback, jxtzCallba
|
|
|
<MenuItem value={'202511'}>2025年11月</MenuItem>
|
|
|
</Select>
|
|
|
</FormControl>
|
|
|
+ <Button sx={{mt: 1}} variant='outlined' onClick={()=>{setShowXxj(false);setMonth('');}}>返回</Button>
|
|
|
</div>
|
|
|
<div ref={xxjRef}></div>
|
|
|
</div>
|
|
|
}
|
|
|
+ {!showXxj && showLsj && <div>
|
|
|
+ <div ref={lsjRef}></div>
|
|
|
+ <div style={{ position: 'relative', top: '-305px', left: '80%', width: '100px'}}><Button variant='outlined' onClick={()=>{jgfbCallback(bianma, mingcheng, danwei);}}>价格分布</Button></div>
|
|
|
+ <div style={{ position: 'relative', top: '-342px', left: '90%', width: '100px'}}><Button variant='outlined' onClick={()=>{setShowLsj(false);}}>返回</Button></div>
|
|
|
+ </div>
|
|
|
+ }
|
|
|
|
|
|
</TabPanel>
|
|
|
</TabContext>
|