Commit 406ebf91 authored by wuhao's avatar wuhao 🎯

kildler

parent 2b7e6c2d
......@@ -2,6 +2,7 @@ import React, { Component } from "react";
import { Resizable } from "react-resizable";
function Resizecell({ onResize, onResizeStop, width, onClick, ...restProps }) {
return (
<Resizable
width={width??1}
......
......@@ -4,7 +4,6 @@ import Mtable from "./mtable";
import getPrem from "@/utils/getPrem"; //权限判断fn
import { ExportOutlined } from "@ant-design/icons";
const { useBreakpoint } = Grid;
function isString(obj) {
......@@ -43,57 +42,62 @@ function isString(obj) {
// onTabChange
// }
export default (props) => {
const screens = useBreakpoint();
const actionbtn = {
add: <Button
key={"add"}
disabled={props?.addconfig?.disabled || !getPrem(props?.addconfig?.premkey ?? "", "ifs")}
type="primary"
{...props?.addconfig?.btnprops}
onClick={() => {
props?.addconfig?.onClick?.()
}}
>
新增
</Button>,
export: <Button
key={"add"}
disabled={props?.exportconfig?.disabled || !getPrem(props?.exportconfig?.premkey ?? "", "ifs")}
type="danger"
icon={<ExportOutlined />}
{...props?.exportconfig?.btnprops}
onClick={() => {
props?.exportconfig?.onClick?.()
}}
>
导出
</Button>
}
add: (
<Button
key={"add"}
disabled={
props?.addconfig?.disabled ||
!getPrem(props?.addconfig?.premkey ?? "", "ifs")
}
type="primary"
{...props?.addconfig?.btnprops}
onClick={() => {
props?.addconfig?.onClick?.();
}}
>
新增
</Button>
),
export: (
<Button
key={"add"}
disabled={
props?.exportconfig?.disabled ||
!getPrem(props?.exportconfig?.premkey ?? "", "ifs")
}
type="danger"
icon={<ExportOutlined />}
{...props?.exportconfig?.btnprops}
onClick={() => {
props?.exportconfig?.onClick?.();
}}
>
导出
</Button>
),
};
//右上角 pageextra 类型 1.reactDom 2.string 以逗号隔开 为none时不显示
const renderextra = () => {
if (props.pageextra && !isString(props.pageextra)) {
return props.pageextra
return props.pageextra;
} else if (props.pageextra === "none") {
return <div style={{ height: 32, width: 64 }}></div>
return <div style={{ height: 32, width: 64 }}></div>;
} else if (props.pageextra) {
let strarr = props.pageextra ? props.pageextra.split(",") : ["add"];
return strarr.map((it, i) => {
return <div style={{ marginRight: i == strarr.length - 1 ? 0 : 6 }}>
{actionbtn[it]}
</div>
})
return (
<div style={{ marginRight: i == strarr.length - 1 ? 0 : 6 }}>
{actionbtn[it]}
</div>
);
});
}
}
};
// screens.xs ? (
// <div
// style={{ display: "flex", flexDirection: "column", height: "100%" }}
......@@ -105,7 +109,7 @@ export default (props) => {
// <Mcard {...props} pageextra={renderextra()}/>
// </div>
// </div>
// ) :
// ) :
return (
<div className="diycard">
......
import React, { PureComponent } from "react";
import ProTable from "@ant-design/pro-table";
import request from "umi-request";
import Resizecell from "./Resizecell";
import { Tooltip } from "antd";
import { doFetch } from "@/utils/doFetch";
import bodyParse from "@/utils/bodyParse";
let defaultsize = localStorage.getItem("size"); //设置缓存
class Mtable extends PureComponent {
constructor(props) {
super(props);
let { columns } = this.props;
this.state = {
total: 0,
size: defaultsize ? defaultsize : "small",
columns: columns,
valueColumns: {},
};
}
actionRefs = React.createRef();
formRefs = React.createRef();
componentWillReceiveProps(nextprops) {
if (
JSON.stringify(this.props.extraparams) !=
JSON.stringify(nextprops.extraparams) ||
JSON.stringify(this.props.path) != JSON.stringify(nextprops.path) ||
JSON.stringify(this.props.refreshDep) !=
JSON.stringify(nextprops.refreshDep) ||
this.props.columns != nextprops.columns
) {
if (nextprops.actionRef) {
nextprops.actionRef?.current?.reset();
} else {
this.actionRefs?.current?.reset();
}
this.initDrage(nextprops);
}
}
componentDidMount() {
this.initDrage();
}
//初始化操作数据
initDrage = (nextprops) => {
let curprops = nextprops ?? this.props;
let { extraparams, path, activeTabKey, columns } = curprops;
if (!path) return;
doFetch({
url: "/ngic-base-business/paFieldScene/queryContro",
params: {
sceneMark: extraparams
? path + bodyParse(extraparams)
: activeTabKey
? path + activeTabKey
: path,
},
}).then((res) => {
if (res.code == "0000") {
//datalist:接口返回状态
let datalist = {};
res?.data?.dataList &&
res.data.dataList.map((it) => {
const { fieldKey, fieldWidth, fieldOrder, fieldFixed, fieldShow } =
it ?? {};
datalist[fieldKey] = {
width: fieldWidth,
order: fieldOrder,
fixed:
fieldKey == "option" || fieldKey == "option_dataindex"
? "right"
: fieldFixed,
show: fieldShow,
};
});
//allcol 默认状态设置 valueColumns 为columns全列设置
let allcol = {};
columns.map((it, i) => {
if (it.valueType == "option") {
allcol.option = {
order: columns.length - 1,
show: true,
fixed: "right",
...datalist.option,
};
} else {
allcol[it.key] = {
order: i,
show: true,
...datalist[it.key],
};
}
});
//columns 列属性添加
let columnes = columns.map((it, index) => {
if (it.valueType == "select" || it.valueType == "checkbox") {
if (Array.isArray(it.options)) {
it.fieldProps = {
options: [...it.options],
};
} else {
it.request = async function () {
let list = await it.options.database(it.options.params);
return list.data.dataList;
};
}
}
if (it.valueType == "option") {
it.key = "option";
it.dataIndex = "option";
it.fixed = "right";
}
let itemwidth = allcol[it.key]?.width
? allcol[it.key].width
: it.width
? it.width
: 160;
return {
...it,
width: itemwidth,
onHeaderCell: (column) => ({
width: column.width ?? itemwidth,
onResize: this.handleResize(index),
onResizeStop: this.handleResizeStop(index),
}),
render: it.render
? it.render
: (text, row) => {
return (
<Tooltip title={row[it.dataIndex]} placement="topLeft">
<span className="table-cell">
{row[it.dataIndex] ?? "-"}
</span>
</Tooltip>
);
},
};
});
this.setState({
valueColumns: allcol,
columns: columnes,
});
}
});
};
//缩放表格
handleResize =
(index) =>
(e, { size }) => {
e.stopImmediatePropagation();
this.setState(({ columns }) => {
const nextColumns = [...columns];
nextColumns[index] = {
...nextColumns[index],
width: size.width,
};
return { columns: nextColumns };
});
};
//更新表格缩放
handleResizeStop =
(index) =>
(e, { size }) => {
e.stopImmediatePropagation();
let { extraparams, activeTabKey, path } = this.props;
let submitdata = this.state.valueColumns ?? {},
curkey = Object.keys(submitdata)[index];
submitdata[curkey].width = parseInt(size.width);
this.setState(
{
valueColumns: submitdata,
},
() => {
doFetch({
url: "/ngic-base-business/paFieldScene/save",
params: {
sceneMark: extraparams
? path + bodyParse(extraparams)
: activeTabKey
? path + activeTabKey
: path,
controList: Object.keys(submitdata).map((it, i) => {
return {
fieldKey: it,
fieldWidth:
i == index ? parseInt(size.width) : submitdata[it].width,
fieldOrder: submitdata[it].order,
fieldFixed: submitdata[it].fixed,
fieldShow: submitdata[it].show,
};
}),
},
});
}
);
};
render() {
let {
pageSize,
x,
y,
style,
dataSource,
onSearchChange,
defaultPageSize,
pagination, //分页
rowKey, //行key
actionRef, //操作ref
formRef, //查询表单ref
path, //路径
activeTabKey, //当前tab
extraparams, //拓展查询参数
rowSelection, //行选择
tableRender, //表格布局自定义
getDefaultSelected, //获取默认选中的数据
rowClassNameFn, //选中后行样式
showQuickJumper, //false字符串 不显示
expandable, //是否可展开
onRow,
} = this.props,
{ total, size } = this.state;
let tabledataProps =
dataSource && Array.isArray(dataSource)
? {
dataSource,
pagination: {
showTotal: (total, range) => <span>{total}</span>,
showQuickJumper: false,
showSizeChanger: true,
defaultPageSize: defaultPageSize ? defaultPageSize : 15,
pageSizeOptions: [10, 15, 30, 50, 100, 200],
total: dataSource.length,
},
search: {
filterType: "light", //轻量模式
},
toolBarRender: false,
}
: {
request: async (params = {}) => {
//表格数据获取 只需要传入url自动获得数据
if (!path) {
return;
}
//设置token
let token = localStorage.getItem("TOKENS")
? localStorage.getItem("TOKENS")
: "9410b3f7de5d63f2be42d80ec8241d2d";
let headers = {
"Content-Type": "application/json",
token: token ? token : "",
},
newextraparams = extraparams ?? {};
//处理传参 extraparams为除列筛选外的自定义传参
let newparams = {
...params,
...newextraparams, //父组件传参
pageIndex: params.current,
pageSize: params.pageSize || pageSize,
};
delete newparams.current;
if (pagination == "false") {
delete newparams.pageIndex;
delete newparams.pageSize;
}
let res = await request("/wms" + path, {
body: JSON.stringify(newparams ? newparams : {}),
headers,
method: "POST",
});
return {
data: res.data,
total: res?.data?.total || res?.data?.dataList?.length,
};
},
pagination: {
showTotal: (total, range) => <span>{total}</span>,
showQuickJumper: !showQuickJumper ? true : false,
showSizeChanger: true,
pageSizeOptions: [5, 10, 15, 30, 50, 100, 200],
defaultPageSize: pageSize || 15,
total,
},
search: {
filterType: "light", //轻量模式
},
};
return (
<ProTable
size={size}
onSubmit={(params) => {
onSearchChange && onSearchChange(params);
}}
onSizeChange={(size) => {
localStorage.setItem("size", size); //设置全局表格规格缓存
this.setState({
size,
});
}}
columns={this.state.columns}
style={style || {}}
actionRef={actionRef ? actionRef : this.actionRefs}
formRef={formRef ? formRef : this.formRefs}
rowKey={rowKey ? rowKey : "id"} //表格每行数据的key
dateFormatter="string"
postData={(data) => {
if (data.page) {
this.setState({
total: data.page.total,
});
} else {
this.setState({
total: data.dataList.length,
});
}
//分页or不分页获取数据
getDefaultSelected && getDefaultSelected(data); //存在默认选中向上返回选中值
let defaultval =
pagination == "false"
? data.dataList
: data.page
? data.page.list
: []; //分页或不分页的接口返回数据
return defaultval;
}}
components={{
header: {
cell: Resizecell,
},
}}
rowSelection={rowSelection ? rowSelection : false}
tableRender={
tableRender ? (_, dom) => tableRender(_, dom) : (_, dom) => dom
} //自定义表格主体
rowClassName={
rowClassNameFn ? (record, index) => rowClassNameFn(record, index) : ""
} //自定义行高亮
columnsState={{
value: this.state.valueColumns,
onChange: (val, state) => {
let submitdata = {
...this.state.valueColumns,
...val,
};
this.setState(
{
valueColumns: submitdata,
},
(state) => {
if (!this.props.path) return;
doFetch({
url: "/ngic-base-business/paFieldScene/save",
params: {
sceneMark: extraparams
? path + bodyParse(extraparams)
: activeTabKey
? path + activeTabKey
: path,
controList: Object.keys(submitdata).map((it) => {
return {
fieldKey: it,
fieldWidth: submitdata[it].width,
fieldOrder: submitdata[it].order,
fieldFixed: submitdata[it].fixed,
fieldShow: submitdata[it].show,
};
}),
},
});
}
);
},
}}
scroll={{
x: x ?? 1024,
}}
{...tabledataProps}
{...expandable}
onRow={onRow ? (record) => onRow(record) : null}
/>
);
}
}
export default Mtable;
import React, { PureComponent } from "react";
import React, {
PureComponent,
useEffect,
useRef,
useState,
useMemo,
} from "react";
import ProTable from "@ant-design/pro-table";
import request from "umi-request";
import Resizecell from "./Resizecell";
import { Tooltip } from "antd";
import { doFetch } from "@/utils/doFetch";
import bodyParse from "@/utils/bodyParse";
import { useAsyncEffect } from "ahooks";
let defaultsize = localStorage.getItem("size"); //设置缓存
const Mtable = (props) => {
const {
actionRef, //表格动作
formRef, //表单Ref
rowKey, // key
columns, //columns
style, //style
path, //接口地址
extraparams, //额外参数
pageSize, //修改默认pageSize
pagination, //分页设置
x, //横向滚动
activeTabKey, //激活的tabKey 拖拽表格唯一标识使用 其他情况用不到
refreshDep, //依赖刷新 (已废弃)
} = props;
class Mtable extends PureComponent {
constructor(props) {
super(props);
let { columns } = this.props;
this.state = {
total: 0,
size: defaultsize ? defaultsize : "small",
columns: columns,
valueColumns: {},
const actionRefs = actionRef ?? useRef(),
formRefs = formRef ?? useRef(),
ifspagination = pagination == "false" || pagination === false,
[size, setsize] = useState("small"),
[valueColumns, setvalueColumns] = useState([]);
const [columnes, setcolumnes] = useState(columns ?? []);
//调用接口
const request = async (params, sort, filter) => {
if (!path) return;
let newparams = {
...params,
...extraparams, //父组件传参
pageIndex: params.current,
pageSize: params.pageSize || pageSize,
};
delete newparams.current;
if (ifspagination) {
delete newparams.pageIndex;
delete newparams.pageSize;
}
const result = await doFetch({ url: path, params: newparams });
//分页结果
let data = result?.data?.page?.list,
success = true,
total = result?.data?.page?.total;
//不带分页获取结果
if (ifspagination) {
data = result?.data?.dataList;
total = result?.data?.dataList?.length;
}
console.log(result, {
data,
success,
total,
});
return {
data,
success,
total,
};
}
};
//更新 columns
useEffect(() => {
setcolumnes((s) => {
return s.map((it, index) => {
let itemwidth = valueColumns[it.key]?.width
? valueColumns[it.key].width
: it.width
? it.width
: 160;
let options = {};
if (it.valueType == "select" || it.valueType == "checkbox") {
if (Array.isArray(it.options)) {
options = {
fieldProps: {
options: [...it.options],
},
};
} else if (it.options) {
options = {
request: async (params) => {
console.log(it.options.database);
let list = await it?.options?.database(
it.options?.params ?? {}
);
return list.data.dataList;
},
};
}
}
if (it.valueType == "option") {
options = {
key: "option",
dataIndex: "option",
fixed: "right",
};
}
if (!it.render) {
options = {
...options,
render: (text, row) => {
return (
<Tooltip title={row[it.dataIndex]} placement="topLeft">
<span className="table-cell">{row[it.dataIndex] ?? "-"}</span>
</Tooltip>
);
},
};
}
actionRefs = React.createRef();
formRefs = React.createRef();
options = {
...options,
width: itemwidth,
};
componentWillReceiveProps(nextprops) {
if (
JSON.stringify(this.props.extraparams) !=
JSON.stringify(nextprops.extraparams) ||
JSON.stringify(this.props.path) != JSON.stringify(nextprops.path) ||
JSON.stringify(this.props.refreshDep) !=
JSON.stringify(nextprops.refreshDep) ||
this.props.columns != nextprops.columns
) {
if (nextprops.actionRef) {
nextprops.actionRef?.current?.reset();
} else {
this.actionRefs?.current?.reset();
}
this.initDrage(nextprops);
}
}
return {
...it,
...options,
onHeaderCell: (column) => ({
width: column.width ?? itemwidth,
onResize: handleResize(index),
onResizeStop: handleResizeStop(index),
}),
};
});
});
}, [columns, valueColumns]);
componentDidMount() {
this.initDrage();
}
//初始化操作数据
initDrage = (nextprops) => {
let curprops = nextprops ?? this.props;
let { extraparams, path, activeTabKey, columns } = curprops;
const initDrage = async () => {
if (!path) return;
doFetch({
let res = await doFetch({
url: "/ngic-base-business/paFieldScene/queryContro",
params: {
sceneMark: extraparams
? path + bodyParse(extraparams)
: activeTabKey
? path + activeTabKey
: path,
? path + activeTabKey
: path,
},
}).then((res) => {
if (res.code == "0000") {
//datalist:接口返回状态
let datalist = {};
res?.data?.dataList &&
res.data.dataList.map((it) => {
const { fieldKey, fieldWidth, fieldOrder, fieldFixed, fieldShow } =
it ?? {};
datalist[fieldKey] = {
width: fieldWidth,
order: fieldOrder,
fixed:
fieldKey == "option" || fieldKey == "option_dataindex"
? "right"
: fieldFixed,
show: fieldShow,
};
});
//allcol 默认状态设置 valueColumns 为columns全列设置
let allcol = {};
columns.map((it, i) => {
if (it.valueType == "option") {
allcol.option = {
order: columns.length - 1,
show: true,
fixed: "right",
...datalist.option,
};
} else {
allcol[it.key] = {
order: i,
show: true,
...datalist[it.key],
};
}
});
//columns 列属性添加
let columnes = columns.map((it, index) => {
if (it.valueType == "select" || it.valueType == "checkbox") {
if (Array.isArray(it.options)) {
it.fieldProps = {
options: [...it.options],
};
} else {
it.request = async function () {
let list = await it.options.database(it.options.params);
return list.data.dataList;
};
}
}
if (it.valueType == "option") {
it.key = "option";
it.dataIndex = "option";
it.fixed = "right";
}
let itemwidth = allcol[it.key]?.width
? allcol[it.key].width
: it.width
? it.width
: 160;
return {
...it,
width: itemwidth,
onHeaderCell: (column) => ({
width: column.width ?? itemwidth,
onResize: this.handleResize(index),
onResizeStop: this.handleResizeStop(index),
}),
render: it.render
? it.render
: (text, row) => {
return (
<Tooltip title={row[it.dataIndex]} placement="topLeft">
<span className="table-cell">
{row[it.dataIndex] ?? "-"}
</span>
</Tooltip>
);
},
});
if (res.code == "0000") {
//datalist:接口返回状态
let datalist = {};
res?.data?.dataList &&
res.data.dataList.map((it) => {
const { fieldKey, fieldWidth, fieldOrder, fieldFixed, fieldShow } =
it ?? {};
datalist[fieldKey] = {
width: fieldWidth,
order: fieldOrder,
fixed:
fieldKey == "option" || fieldKey == "option_dataindex"
? "right"
: fieldFixed,
show: fieldShow,
};
});
this.setState({
valueColumns: allcol,
columns: columnes,
});
}
});
//allcol 默认状态设置 valueColumns 为columns全列设置
let allcol = {};
columns.map((it, i) => {
if (it.valueType == "option") {
allcol.option = {
order: columns.length - 1,
show: true,
fixed: "right",
...datalist.option,
};
} else {
allcol[it.key] = {
order: i,
show: true,
...datalist[it.key],
};
}
});
setvalueColumns(allcol);
}
};
//调用重新渲染表格
useAsyncEffect(async () => {
await initDrage();
}, [extraparams, path, activeTabKey, refreshDep]);
//缩放表格
handleResize =
const handleResize =
(index) =>
(e, { size }) => {
e.stopImmediatePropagation();
this.setState(({ columns }) => {
const nextColumns = [...columns];
nextColumns[index] = {
...nextColumns[index],
width: size.width,
};
return { columns: nextColumns };
});
};
(e, { size }) => {
e.stopImmediatePropagation();
setcolumnes((s) => {
const nextColumns = [...s];
nextColumns[index] = {
...nextColumns[index],
width: size.width,
};
return nextColumns;
});
};
//更新表格缩放
handleResizeStop =
const handleResizeStop =
(index) =>
(e, { size }) => {
e.stopImmediatePropagation();
let { extraparams, activeTabKey, path } = this.props;
let submitdata = this.state.valueColumns ?? {},
curkey = Object.keys(submitdata)[index];
submitdata[curkey].width = parseInt(size.width);
this.setState(
{
valueColumns: submitdata,
(e, { size }) => {
e.stopImmediatePropagation();
setcolumnes((s) => {
const nextColumns = [...s];
nextColumns[index] = {
...nextColumns[index],
width: size.width,
};
doFetch({
url: "/ngic-base-business/paFieldScene/save",
params: {
sceneMark: extraparams
? path + bodyParse(extraparams)
: activeTabKey
? path + activeTabKey
: path,
controList: Object.keys(nextColumns).map((it, i) => {
return {
fieldKey: it,
fieldWidth:
i == index ? parseInt(size.width) : nextColumns[it].width,
fieldOrder: nextColumns[it].order,
fieldFixed: nextColumns[it].fixed,
fieldShow: nextColumns[it].show,
};
}),
},
() => {
doFetch({
url: "/ngic-base-business/paFieldScene/save",
params: {
sceneMark: extraparams
? path + bodyParse(extraparams)
: activeTabKey
? path + activeTabKey
: path,
controList: Object.keys(submitdata).map((it, i) => {
return {
fieldKey: it,
fieldWidth:
i == index ? parseInt(size.width) : submitdata[it].width,
fieldOrder: submitdata[it].order,
fieldFixed: submitdata[it].fixed,
fieldShow: submitdata[it].show,
};
}),
},
});
}
);
};
});
return nextColumns;
});
};
render() {
let {
pageSize,
x,
y,
style,
dataSource,
onSearchChange,
defaultPageSize,
pagination, //分页
rowKey, //行key
actionRef, //操作ref
formRef, //查询表单ref
path, //路径
activeTabKey, //当前tab
extraparams, //拓展查询参数
rowSelection, //行选择
tableRender, //表格布局自定义
getDefaultSelected, //获取默认选中的数据
rowClassNameFn, //选中后行样式
showQuickJumper, //false字符串 不显示
expandable, //是否可展开
onRow,
} = this.props,
{ total, size } = this.state;
let tabledataProps =
dataSource && Array.isArray(dataSource)
? {
dataSource,
pagination: {
showTotal: (total, range) => <span>{total}</span>,
showQuickJumper: false,
showSizeChanger: true,
defaultPageSize: defaultPageSize ? defaultPageSize : 15,
pageSizeOptions: [10, 15, 30, 50, 100, 200],
total: dataSource.length,
},
search: {
filterType: "light", //轻量模式
},
toolBarRender: false,
}
: {
request: async (params = {}) => {
//表格数据获取 只需要传入url自动获得数据
if (!path) {
return;
}
//设置token
let token = localStorage.getItem("TOKENS")
? localStorage.getItem("TOKENS")
: "9410b3f7de5d63f2be42d80ec8241d2d";
let headers = {
"Content-Type": "application/json",
token: token ? token : "",
return (
<ProTable
{...props}
size={size}
onSubmit={(params) => {
console.log(params, "onSubmit");
}}
onSizeChange={(size) => {
localStorage.setItem("size", size); //设置全局表格规格缓存
setsize(size);
}}
columns={columnes ?? []}
style={style || {}}
actionRef={actionRefs}
formRef={formRefs}
rowKey={rowKey ?? "id"} //表格每行数据的key
dateFormatter="string"
request={request}
scroll={{
x: x ?? 1024,
}}
components={{
header: {
cell: Resizecell,
},
}}
columnsState={{
value: valueColumns,
onChange: (val, state) => {
let submitdata = {
...valueColumns,
...val,
};
setcolumnes(submitdata);
doFetch({
url: "/ngic-base-business/paFieldScene/save",
params: {
sceneMark: extraparams
? path + bodyParse(extraparams)
: activeTabKey
? path + activeTabKey
: path,
controList: Object.keys(submitdata).map((it) => {
return {
fieldKey: it,
fieldWidth: submitdata[it].width,
fieldOrder: submitdata[it].order,
fieldFixed: submitdata[it].fixed,
fieldShow: submitdata[it].show,
};
}),
},
newextraparams = extraparams ?? {};
//处理传参 extraparams为除列筛选外的自定义传参
let newparams = {
...params,
...newextraparams, //父组件传参
pageIndex: params.current,
pageSize: params.pageSize || pageSize,
};
delete newparams.current;
if (pagination == "false") {
delete newparams.pageIndex;
delete newparams.pageSize;
}
let res = await request("/wms" + path, {
body: JSON.stringify(newparams ? newparams : {}),
headers,
method: "POST",
});
return {
data: res.data,
total: res?.data?.total || res?.data?.dataList?.length,
};
},
pagination: {
showTotal: (total, range) => <span>{total}</span>,
showQuickJumper: !showQuickJumper ? true : false,
showSizeChanger: true,
pageSizeOptions: [5, 10, 15, 30, 50, 100, 200],
defaultPageSize: pageSize || 15,
total,
},
search: {
filterType: "light", //轻量模式
},
};
return (
<ProTable
size={size}
onSubmit={(params) => {
onSearchChange && onSearchChange(params);
}}
onSizeChange={(size) => {
localStorage.setItem("size", size); //设置全局表格规格缓存
this.setState({
size,
});
}}
columns={this.state.columns}
style={style || {}}
actionRef={actionRef ? actionRef : this.actionRefs}
formRef={formRef ? formRef : this.formRefs}
rowKey={rowKey ? rowKey : "id"} //表格每行数据的key
dateFormatter="string"
postData={(data) => {
if (data.page) {
this.setState({
total: data.page.total,
});
} else {
this.setState({
total: data.dataList.length,
});
}
//分页or不分页获取数据
getDefaultSelected && getDefaultSelected(data); //存在默认选中向上返回选中值
let defaultval =
pagination == "false"
? data.dataList
: data.page
? data.page.list
: []; //分页或不分页的接口返回数据
return defaultval;
}}
components={{
header: {
cell: Resizecell,
},
}}
rowSelection={rowSelection ? rowSelection : false}
tableRender={
tableRender ? (_, dom) => tableRender(_, dom) : (_, dom) => dom
} //自定义表格主体
rowClassName={
rowClassNameFn ? (record, index) => rowClassNameFn(record, index) : ""
} //自定义行高亮
columnsState={{
value: this.state.valueColumns,
onChange: (val, state) => {
let submitdata = {
...this.state.valueColumns,
...val,
};
this.setState(
{
valueColumns: submitdata,
},
(state) => {
if (!this.props.path) return;
doFetch({
url: "/ngic-base-business/paFieldScene/save",
params: {
sceneMark: extraparams
? path + bodyParse(extraparams)
: activeTabKey
? path + activeTabKey
: path,
controList: Object.keys(submitdata).map((it) => {
return {
fieldKey: it,
fieldWidth: submitdata[it].width,
fieldOrder: submitdata[it].order,
fieldFixed: submitdata[it].fixed,
fieldShow: submitdata[it].show,
};
}),
},
});
}
);
},
}}
scroll={{
x: x ?? 1024,
}}
{...tabledataProps}
{...expandable}
onRow={onRow ? (record) => onRow(record) : null}
/>
);
}
}
},
}}
pagination={
ifspagination
? false
: {
showTotal: (total, range) => <span>{total}</span>,
showQuickJumper: true,
showSizeChanger: true,
pageSizeOptions: [5, 10, 15, 30, 50, 100, 200],
defaultPageSize: pageSize || 15,
}
}
search={{
filterType: "light", //轻量模式
}}
/>
);
};
export default Mtable;
......@@ -511,7 +511,7 @@ export default function CheckTable({
)}
</div>
)}
rowClassNameFn={(record, index) => {
rowClassName={(record, index) => {
if (currentkey === record[rowKey]) {
return "selectedRow";
}
......@@ -733,7 +733,7 @@ export default function CheckTable({
)}
</div>
)}
rowClassNameFn={(record, index) => {
rowClassName={(record, index) => {
if (currentkey === record[rowKey]) {
return "selectedRow";
}
......
import React, { useEffect, useMemo, useRef, useState } from "react";
import {
Dropdown,
Menu,
Button,
message,
} from "antd";
import { Dropdown, Menu, Button, Tooltip } from "antd";
import { ProTable } from "@ant-design/pro-table";
import { doFetch } from "@/utils/doFetch";
import AutoTable from "@/components/AutoTable";
function Instore(props) {
const actionRef = useRef(),
ChildRef = null;
const columns = [
{
"title": "操作时间",
"dataIndex": "operateTime",
"key": "operateTimeList",
"valueType": "dateRange",
"render": (_, row) => { return (<div>{row.operateTime}</div>) },
},
{
"title": "操作人",
"dataIndex": "operateUserName",
"key": "operateUserName"
},
{
"title": "物料编码",
"dataIndex": "materieCode",
"key": "materieCode"
},
{
"title": "物料名称",
"dataIndex": "materieName",
"key": "materieName"
},
{
"title": "批次号/SN号",
"dataIndex": "materieControlNo",
"key": "materieControlNo"
},
{
"title": "当时库存数量",
"dataIndex": "currentNum",
"key": "currentNum",
"search": false
},
{
"title": "操作数量",
"dataIndex": "operateNum",
"key": "operateNum",
"search": false
},
{
"title": "库存单位",
"dataIndex": "productionUnitName",
"key": "productionUnitName",
"search": false
},
{
"title": "操作类型",
"dataIndex": "stockDetailTypeName",
"key": "stockDetailTypeName",
},
{
"title": "仓库名称",
"dataIndex": "storeName",
"key": "storeId",
options: {
database: () => doFetch({ url: "/ngic-auth/sysStore/selectionBox", params: { factoryIdList: [] } }),
params: {}
},
valueType: "select",
},
{
"title": "库位",
"dataIndex": "storePositionName",
"key": "storePositionName"
},
{
"title": "相关单号",
"dataIndex": "relatedNo",
"key": "relatedNo"
}
]
const tableprops = {
...props,
pageextra: "none",
columns,
path: "/ngic-workmanship/wmsMaterieStockRecord/queryList"
}
function Instore(props) {
const columns = [
{
title: "操作时间",
dataIndex: "operateTime",
key: "operateTimeList",
valueType: "dateRange",
render: (_, row) => {
return <div>{row.operateTime}</div>;
},
},
{
title: "操作人",
dataIndex: "operateUserName",
key: "operateUserName",
},
{
title: "物料编码",
dataIndex: "materieCode",
key: "materieCode",
},
{
title: "物料名称",
dataIndex: "materieName",
key: "materieName",
},
{
title: "批次号/SN号",
dataIndex: "materieControlNo",
key: "materieControlNo",
},
{
title: "当时库存数量",
dataIndex: "currentNum",
key: "currentNum",
search: false,
},
{
title: "操作数量",
dataIndex: "operateNum",
key: "operateNum",
search: false,
},
{
title: "库存单位",
dataIndex: "productionUnitName",
key: "productionUnitName",
search: false,
},
{
title: "操作类型",
dataIndex: "stockDetailTypeName",
key: "stockDetailTypeName",
},
{
title: "出库仓库",
dataIndex: "storeName",
key: "storeName",
fieldProps: {
allowClear: true,
showSearch: true,
},
options: {
database: () =>
doFetch({
url: "/ngic-auth/sysStore/selectionBox",
params: { factoryIdList: [] },
}),
params: {},
},
valueType: "select",
},
{
title: "库位",
dataIndex: "storePositionName",
key: "storePositionName",
},
{
title: "相关单号",
dataIndex: "relatedNo",
key: "relatedNo",
},
]
return (
<div>
<AutoTable
{
...tableprops
}
actionRef={actionRef}
onRef={(node) => (ChildRef = node)}
></AutoTable>
</div>
);
return (
<div>
<AutoTable
{...props}
pageextra="none"
path="/ngic-workmanship/wmsMaterieStockRecord/queryList"
columns={columns}
></AutoTable>
</div>
);
}
export default Instore;
\ No newline at end of file
export default Instore;
......@@ -212,7 +212,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -350,7 +350,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -473,7 +473,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -493,7 +493,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -616,7 +616,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -636,7 +636,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -704,10 +704,6 @@ const one = {
title: "相关单号",
key: "businessNo",
},
{
title: "备注",
key: "remark",
},
{
title: "创建人",
key: "createUserName",
......@@ -723,8 +719,14 @@ const one = {
title: "完成时间",
key: "finishTime",
},
{
title: "备注",
key: "remark",
noshow:"100%",
},
{
title: "工单二维码",
noshow:true,
key: "qrCodeUrl",
type: "img",
width: 100,
......
import React, { useEffect, useMemo, useRef, useState } from "react";
import {
Dropdown,
Menu,
Button,
message,
} from "antd";
import { Dropdown, Menu, Button, message } from "antd";
import AutoTable from "@/components/AutoTable";
import defaultFields from "./fields";
import { doFetch } from "@/utils/doFetch";
import DrawInitForm from "@/components/DrawInitForm";
import getPrem from '@/utils/getPrem';//权限判断fn
import { useReactToPrint } from 'react-to-print';
import { useCallback } from "react";
import { useModel } from 'umi';
import getPrem from "@/utils/getPrem"; //权限判断fn
import { useReactToPrint } from "react-to-print";
import { useModel } from "umi";
import PrintDom from "./printdom";
const keytoval = {
"one": 1,
"two": 2,
"three": 3,
"four": 4
}, items = [
one: 1,
two: 2,
three: 3,
four: 4,
},
items = [
{
key: 'one',
label: (
<a>
采购入库
</a>
),
key: "one",
label: <a>采购入库</a>,
},
{
key: 'two',
label: (
<a>
生产入库
</a>
),
key: "two",
label: <a>生产入库</a>,
},
{
key: 'three',
label: (
<a>
退料入库
</a>
),
key: "three",
label: <a>退料入库</a>,
},
{
key: 'four',
label: (
<a>
其他入库
</a>
),
key: "four",
label: <a>其他入库</a>,
},
],itemz = {
one:"采购入库",
two:"生产入库",
three:"退料入库",
four:"其他入库"
}
],
itemz = {
one: "采购入库",
two: "生产入库",
three: "退料入库",
four: "其他入库",
};
function Instore(props) {
const { initialState, setInitialState } = useModel("@@initialState");
const [activeTabKey, onTabChange] = useState("1");
let [drawprops, setdrawprops] = useState({
title: "",
visible: false,
onClose: () => {
setdrawprops(s => ({
...s,
visible: false,
fields:{}
}))
},
fields: {},
width: 1200
const { initialState, setInitialState } = useModel("@@initialState");
const [activeTabKey, onTabChange] = useState("1");
let [drawprops, setdrawprops] = useState({
title: "",
visible: false,
onClose: () => {
setdrawprops((s) => ({
...s,
visible: false,
fields: {},
}));
},
fields: {},
width: 1200,
}),
actionRef = useRef(),
ChildRef = null,
printRef = useRef();
//操作完成后刷新
function reload() {
actionRef.current.reload();
ChildRef?.onRefresh();
message.success("操作成功");
setdrawprops(s => ({
...s,
visible: false,
fields:{}
}))
}
actionRef = useRef(),
ChildRef = null,
printRef = useRef();
const handlePrint = useReactToPrint({
content: () => printRef.current,
});
//操作完成后刷新
function reload() {
actionRef.current.reload();
ChildRef?.onRefresh();
message.success("操作成功");
setdrawprops((s) => ({
...s,
visible: false,
fields: {},
}));
}
const handlePrint = useReactToPrint({
content: () => printRef.current.dom.current,
});
const columns = useMemo(() => {
if (activeTabKey == "1") {
const columns = useMemo(() => {
if (activeTabKey == "1") {
return [
{
title: "入库单号",
dataIndex: "materieInstoreNo",
key: "materieInstoreNo",
render: (dom, record) => {
return (
<a
onClick={async () => {
setdrawprops((s) => ({
...s,
visible: true,
//查看详情 props
val: "detail",
title: `查看详情`,
...defaultFields?.detail,
totalPath:
"/ngic-workmanship/wmsMaterieInstore/getInStoreInfoById",
totalParams: { id: record.id },
extra: (
<Button
onClick={async () => {
handlePrint();
}}
>
打印
</Button>
),
}));
}}
>
{dom}
</a>
);
},
},
{
title: "入库类型",
dataIndex: "instoreTypeName",
key: "instoreType",
valueType: "select",
options: [
{
label: "采购入库",
value: "1",
},
{
label: "生产入库",
value: "2",
},
{
label: "退料入库",
value: "3",
},
{
label: "其他入库",
value: "4",
},
],
},
{
title: "入库仓库",
dataIndex: "storeName",
key: "storeId",
fieldProps: {
allowClear: true,
showSearch: true
},
options: {
database: () =>
doFetch({
url: "/ngic-auth/sysStore/selectionBox",
params: { factoryIdList: [] },
}),
params: {},
},
valueType: "select",
},
{
title: "相关单号",
dataIndex: "businessNo",
key: "businessNo",
},
{
title: "备注",
dataIndex: "remark",
key: "remark",
search: false,
},
{
title: "创建人",
dataIndex: "createUserName",
key: "createUserName",
},
{
title: "创建时间",
dataIndex: "createTime",
key: "createTime",
valueType: "dateRange",
formItemProps: {
name: "createTimeList",
},
},
{
title: "状态",
dataIndex: "statusName",
key: "status",
valueType: "select",
options: [
{
label: "待上架",
value: "0",
},
{
label: "上架中",
value: "1",
},
],
},
{
title: "操作",
valueType: "option",
width: 240,
render: (text, record, _, action) => {
return [
{
"title": "入库单号",
"dataIndex": "materieInstoreNo",
"key": "materieInstoreNo",
"render": (dom, record) => {
return <a
onClick={async () => {
setdrawprops(s => ({
...s,
visible: true,
//查看详情 props
val: "detail",
title: `查看详情`,
...defaultFields?.detail,
totalPath: "/ngic-workmanship/wmsMaterieInstore/getInStoreInfoById",
totalParams: { id: record.id },
printRef: printRef,
extra: (<Button
onClick={async () => {
handlePrint()
}}
>
打印
</Button>)
}))
}}
>{dom}</a>
}
},
{
"title": "入库类型",
"dataIndex": "instoreTypeName",
"key": "instoreType",
"valueType": "select",
"options": [
{
"label": "采购入库",
"value": "1"
},
{
"label": "生产入库",
"value": "2"
},
{
"label": "退料入库",
"value": "3"
},
{
"label": "其他入库",
"value": "4"
}
]
},
{
"title": "入库仓库",
"dataIndex": "storeName",
"key": "storeId",
options: {
database: () => doFetch({ url: "/ngic-auth/sysStore/selectionBox", params: { factoryIdList: [] } }),
params: {}
},
valueType: "select",
},
{
"title": "相关单号",
"dataIndex": "businessNo",
"key": "businessNo"
},
{
"title": "备注",
"dataIndex": "remark",
"key": "remark",
"search": false
},
{
"title": "创建人",
"dataIndex": "createUserName",
"key": "createUserName"
},
{
"title": "创建时间",
"dataIndex": "createTime",
"key": "createTime",
"valueType": "dateRange",
formItemProps:{
name:"createTimeList"
}
},
{
"title": "状态",
"dataIndex": "statusName",
"key": "status",
"valueType": "select",
"options": [
{
"label": "待上架",
"value": "0"
},
{
"label": "上架中",
"value": "1"
}
]
},
{
"title": "操作",
"valueType": "option",
"width": 240,
"render": (text, record, _, action) => {
return [
getPrem("equipmentCustomer_save", action, '上架采集', async () => {
let extra = defaultFields.doinsert(record.id,record.storeId);
setdrawprops(s => ({
...s,
visible: true,
//查看详情 props
val: "detail",
title: `上架采集`,
totalPath: "/ngic-workmanship/wmsMaterieInstore/getInStoreInfoById",
totalParams: { id: record.id },
extra:null,
...extra,
}))
setInitialState(s => {
return ({
...s,
submit: {}
})
})
}),
getPrem("equipmentCustomer_deleteById", action, '关单', null, {
title: "确认关单?",
onConfirm: () => {
doFetch({ url: "/ngic-workmanship/wmsMaterieInstore/close", params: { id: record.id } }).then(res => {
if (res.code == "0000") {
reload()
}
})
}
}),
record.status==0 && getPrem("equipmentCustomer_deleteById", action, '删除', null, {
title: "确认删除?",
onConfirm: () => {
doFetch({ url: "/ngic-workmanship/wmsMaterieInstore/deleteById", params: { id: record.id } }).then(res => {
if (res.code == "0000") {
reload()
}
})
}
})
];
}
getPrem(
"equipmentCustomer_save",
action,
"上架采集",
async () => {
let extra = defaultFields.doinsert(record.id, record.storeId);
setdrawprops((s) => ({
...s,
visible: true,
//查看详情 props
val: "detail",
title: `上架采集`,
totalPath:
"/ngic-workmanship/wmsMaterieInstore/getInStoreInfoById",
totalParams: { id: record.id },
extra: null,
...extra,
}));
setInitialState((s) => {
return {
...s,
submit: {},
};
});
}
]
} else {
return [
{
"title": "入库单号",
"dataIndex": "materieInstoreNo",
"key": "materieInstoreNo",
"render": (dom, record) => {
return <a
onClick={() => {
setdrawprops(s => ({
...s,
visible: true,
//查看详情 props
val: "detail",
title: `查看详情`,
...defaultFields?.detail,
totalPath: "/ngic-workmanship/wmsMaterieInstoreHis/getInStoreInfoById",
totalParams: { id: record.id }
}))
}}
>{dom}</a>
}
},
{
"title": "入库类型",
"dataIndex": "instoreTypeName",
"key": "instoreType",
"valueType": "select",
"options": [
{
"label": "采购入库",
"value": "1"
},
{
"label": "生产入库",
"value": "2"
},
{
"label": "退料入库",
"value": "3"
},
{
"label": "其他入库",
"value": "4"
}
]
},
{
"title": "入库仓库",
"dataIndex": "storeName",
"key": "storeId",
options: {
database: () => doFetch({ url: "/ngic-auth/sysStore/selectionBox", params: { factoryIdList: [] } }),
params: {}
},
valueType: "select",
},
{
"title": "相关单号",
"dataIndex": "businessNo",
"key": "businessNo"
},
{
"title": "备注",
"dataIndex": "remark",
"key": "remark",
"search": false
},
{
"title": "创建人",
"dataIndex": "createUserName",
"key": "createUserName"
},
{
"title": "创建时间",
"dataIndex": "createTime",
"key": "createTime",
"valueType": "dateRange",
formItemProps:{
name:"createTimeList"
}
},
{
"title": "完成时间",
"dataIndex": "finishTime",
"key": "finishTime",
"valueType": "dateRange",
formItemProps:{
name:"finishTimeList"
),
getPrem("equipmentCustomer_deleteById", action, "关单", null, {
title: "确认关单?",
onConfirm: () => {
doFetch({
url: "/ngic-workmanship/wmsMaterieInstore/close",
params: { id: record.id },
}).then((res) => {
if (res.code == "0000") {
reload();
}
});
},
{
"title": "状态",
"dataIndex": "statusName",
"key": "status",
"valueType": "select",
"options": [
{
"label": "已上架",
"value": "2"
},
{
"label": "已关单",
"value": "4"
}
]
}
]
}
}, [activeTabKey])
const tableprops = {
...props,
pageextra: activeTabKey == "1" ? <Dropdown placement="bottomRight" overlay={<Menu
onClick={(e) => {
setdrawprops(s => ({
}),
record.status == 0 &&
getPrem("equipmentCustomer_deleteById", action, "删除", null, {
title: "确认删除?",
onConfirm: () => {
doFetch({
url: "/ngic-workmanship/wmsMaterieInstore/deleteById",
params: { id: record.id },
}).then((res) => {
if (res.code == "0000") {
reload();
}
});
},
}),
];
},
},
];
} else {
return [
{
title: "入库单号",
dataIndex: "materieInstoreNo",
key: "materieInstoreNo",
render: (dom, record) => {
return (
<a
onClick={() => {
setdrawprops((s) => ({
...s,
visible: true,
title: "新增"+itemz[e.key],
fields: defaultFields[e.key],
instoreType: keytoval[e.key],
val: "add", //类型
//查看详情 props
val: "detail",
title: `查看详情`,
...defaultFields?.detail,
totalPath:
"/ngic-workmanship/wmsMaterieInstoreHis/getInStoreInfoById",
totalParams: { id: record.id },
extra:null
}))
}}
items={items}
/>}>
<Button type="primary">新增</Button>
</Dropdown> : "none",
tabList: [
}));
}}
>
{dom}
</a>
);
},
},
{
title: "入库类型",
dataIndex: "instoreTypeName",
key: "instoreType",
valueType: "select",
options: [
{
tab: "未完成",
key: "1"
}, {
tab: "已完成",
key: "2"
}
],
activeTabKey,
onTabChange,
columns,
path: activeTabKey == "1" ? "/ngic-workmanship/wmsMaterieInstore/queryList" : "/ngic-workmanship/wmsMaterieInstoreHis/queryList"
label: "采购入库",
value: "1",
},
{
label: "生产入库",
value: "2",
},
{
label: "退料入库",
value: "3",
},
{
label: "其他入库",
value: "4",
},
],
},
{
title: "入库仓库",
dataIndex: "storeName",
key: "storeId",
fieldProps: {
allowClear: true,
showSearch: true
},
options: {
database: () =>
doFetch({
url: "/ngic-auth/sysStore/selectionBox",
params: { factoryIdList: [] },
}),
params: {},
},
valueType: "select",
},
{
title: "相关单号",
dataIndex: "businessNo",
key: "businessNo",
},
{
title: "备注",
dataIndex: "remark",
key: "remark",
search: false,
},
{
title: "创建人",
dataIndex: "createUserName",
key: "createUserName",
},
{
title: "创建时间",
dataIndex: "createTime",
key: "createTime",
valueType: "dateRange",
formItemProps: {
name: "createTimeList",
},
},
{
title: "完成时间",
dataIndex: "finishTime",
key: "finishTime",
valueType: "dateRange",
formItemProps: {
name: "finishTimeList",
},
},
{
title: "状态",
dataIndex: "statusName",
key: "status",
valueType: "select",
options: [
{
label: "已上架",
value: "2",
},
{
label: "已关单",
value: "4",
},
],
},
];
}
}, [activeTabKey]);
return (
<div>
<AutoTable
{
...tableprops
}
actionRef={actionRef}
onRef={(node) => (ChildRef = node)}
></AutoTable>
<DrawInitForm
{...drawprops}
submitData={async (value) => {
if (drawprops.val == "add") {
let res = await doFetch({ url: "/ngic-workmanship/wmsMaterieInstore/saveInStore", params: { ...value, instoreType: drawprops.instoreType } })
if (res.code == "0000") {
reload();
}
}
}}
reload={reload}
const tableprops = {
...props,
pageextra:
activeTabKey == "1" ? (
<Dropdown
placement="bottomRight"
overlay={
<Menu
onClick={(e) => {
setdrawprops((s) => ({
...s,
visible: true,
title: "新增" + itemz[e.key],
fields: defaultFields[e.key],
instoreType: keytoval[e.key],
val: "add", //类型
extra: null,
}));
}}
items={items}
/>
</div>
);
}
>
<Button type="primary">新增</Button>
</Dropdown>
) : (
"none"
),
tabList: [
{
tab: "未完成",
key: "1",
},
{
tab: "已完成",
key: "2",
},
],
activeTabKey,
onTabChange,
columns,
path:
activeTabKey == "1"
? "/ngic-workmanship/wmsMaterieInstore/queryList"
: "/ngic-workmanship/wmsMaterieInstoreHis/queryList",
};
return (
<div>
<div style={{ display: "none" }}>
<PrintDom ref={printRef} {...drawprops} />
</div>
<AutoTable
{...tableprops}
actionRef={actionRef}
onRef={(node) => (ChildRef = node)}
></AutoTable>
<DrawInitForm
{...drawprops}
submitData={async (value) => {
if (drawprops.val == "add") {
let res = await doFetch({
url: "/ngic-workmanship/wmsMaterieInstore/saveInStore",
params: { ...value, instoreType: drawprops.instoreType },
});
if (res.code == "0000") {
reload();
}
}
}}
reload={reload}
/>
</div>
);
}
export default Instore;
\ No newline at end of file
export default Instore;
import { doFetch } from "@/utils/doFetch";
import React, {
useState,
useImperativeHandle,
forwardRef,
useRef,
} from "react";
import { useEffect } from "react";
import AutoTable from "@/components/AutoTable";
function PrintDom({ totalPath, val, totalParams, totalCard }, ref) {
let printRef = useRef();
const [data, setdata] = useState({});
useImperativeHandle(ref, () => ({
dom: printRef,
}));
useEffect(() => {
if (val == "detail") {
doFetch({ url: totalPath, params: totalParams }).then((res) => {
setdata(res?.data?.data);
});
} else {
}
}, [val]);
return (
val == "detail" && (
<div
ref={printRef}
style={{
position: "fixed",
top: 0,
left: 0,
zIndex: 999,
width: "100%",
height: "100%",
}}
>
<h1
style={{
textAlign: "center",
width: "100%",
paddingTop: 12,
paddingBottom: 16,
}}
>
入库工单
</h1>
<img
style={{
position: "absolute",
right: 12,
top: 12,
width: 86,
height: "auto",
}}
src={data?.qrCodeUrl}
alt=""
/>
<div style={{ display: "flex", flexWrap: "wrap", paddingLeft: "2%" }}>
{totalCard &&
totalCard[0].itemData
.filter((it) => !(it.noshow === true))
.map((it) => {
return (
<div
style={{
width: it.noshow ?? "32%",
backgroundColor: "#f9f9f9",
marginRight: "1%",
marginBottom: 10,
padding: "4px",
fontSize: 16,
overflow: "hidden",
}}
>
<b>{it.title}: </b>
<span>{data[it.key] || "-"}</span>
</div>
);
})}
</div>
<p style={{ margin: 0, padding: "4px 2%", fontSize: 18 }}>
<b>{totalCard && totalCard[1].cardTitle}</b>
</p>
<div style={{ margin: 0, padding: "4px 2%", fontSize: 18 }}>
<AutoTable
dataSource={data?.materialList}
x="96%"
style={{ marginTop: 8 }}
withCard={false}
pagination={"false"}
columns={[
{
title: "物料编码 - 名称",
dataIndex: "materieName",
key: "materieName",
search: false,
render: (dom, row) => {
return (
(row.materieCode ?? "") + " - " + (row.materieName ?? "")
);
},
},
{
title: "供应商编号 - 名称",
dataIndex: "supplierNo",
key: "supplierNo",
search: false,
render: (dom, row) => {
return (
(row.supplierNo ?? "") + " - " + (row.supplierName ?? "")
);
},
},
{
title: "批次号/SN号",
dataIndex: "materieControlNo",
key: "materieControlNo",
search: false,
},
{
title: "入库数量",
dataIndex: "instroeNum",
key: "instroeNum",
search: false,
},
{
title: "库存单位",
dataIndex: "productionUnitName",
key: "productionUnitName",
search: false,
},
]}
></AutoTable>
</div>
</div>
)
);
}
export default forwardRef(PrintDom);
......@@ -234,7 +234,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -357,7 +357,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -478,7 +478,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -599,7 +599,7 @@ const one = {
return res?.data?.dataList
},
"fieldProps": {
allowClear: false,
allowClear: true,
showSearch: true
},
"formItemProps": () => {
......@@ -667,10 +667,6 @@ const one = {
title: "相关单号",
key: "businessNo",
},
{
title: "备注",
key: "remark",
},
{
title: "创建人",
key: "createUserName",
......@@ -687,10 +683,16 @@ const one = {
title: "完成时间",
key: "finishTime",
},
{
title: "备注",
key: "remark",
noshow:"100%",
},
{
title: "工单二维码",
key: "qrCodeUrl",
type: "img",
noshow:true,
width: 100,
height: 100
},
......
......@@ -7,6 +7,7 @@ import DrawInitForm from "@/components/DrawInitForm";
import getPrem from "@/utils/getPrem"; //权限判断fn
import { useReactToPrint } from "react-to-print";
import { useModel } from "umi";
import PrintDom from "./printdom";
const keytoval = {
one: 1,
......@@ -72,7 +73,7 @@ function Outstore(props) {
}
const handlePrint = useReactToPrint({
content: () => printRef.current,
content: () => printRef.current.dom.current,
});
const columns = useMemo(() => {
......@@ -96,7 +97,6 @@ function Outstore(props) {
totalPath:
"/ngic-workmanship/wmsMaterieOutstore/getOutStoreInfoById",
totalParams: { id: record.id },
printRef: printRef,
extra: (
<Button
onClick={async () => {
......@@ -142,6 +142,10 @@ function Outstore(props) {
title: "出库仓库",
dataIndex: "storeName",
key: "storeId",
fieldProps: {
allowClear: true,
showSearch: true
},
options: {
database: () =>
doFetch({
......@@ -315,12 +319,12 @@ function Outstore(props) {
title: "出库仓库",
dataIndex: "storeName",
key: "storeId",
fieldProps: {
allowClear: true,
showSearch: true
},
options: {
database: () =>
doFetch({
url: "/ngic-auth/sysStore/selectionBox",
params: { factoryIdList: [] },
}),
database: () =>doFetch({url: "/ngic-auth/sysStore/selectionBox",params: { factoryIdList: [] }}),
params: {},
},
valueType: "select",
......@@ -428,6 +432,9 @@ function Outstore(props) {
return (
<div>
<div style={{ display: "none" }}>
<PrintDom ref={printRef} {...drawprops} />
</div>
<AutoTable
{...tableprops}
actionRef={actionRef}
......@@ -493,7 +500,7 @@ function Outstore(props) {
key: "materieId",
valueType: "select",
fieldProps: {
allowClear: false,
allowClear: true,
showSearch: true,
options
},
......
import { doFetch } from "@/utils/doFetch";
import React, {
useState,
useImperativeHandle,
forwardRef,
useRef,
} from "react";
import { useEffect } from "react";
import AutoTable from "@/components/AutoTable";
function PrintDom({ totalPath, val, totalParams, totalCard }, ref) {
let printRef = useRef();
const [data, setdata] = useState({});
useImperativeHandle(ref, () => ({
dom: printRef,
}));
useEffect(() => {
if (val == "detail") {
doFetch({ url: totalPath, params: totalParams }).then((res) => {
setdata(res?.data?.data);
});
} else {
}
}, [val]);
return (
val == "detail" && (
<div
ref={printRef}
style={{
position: "fixed",
top: 0,
left: 0,
zIndex: 999,
width: "100%",
height: "100%",
}}
>
<h1
style={{
textAlign: "center",
width: "100%",
paddingTop: 12,
paddingBottom: 16,
}}
>
出库工单
</h1>
<img
style={{
position: "absolute",
right: 12,
top: 12,
width: 86,
height: "auto",
}}
src={data?.qrCodeUrl}
alt=""
/>
<div style={{ display: "flex", flexWrap: "wrap", paddingLeft: "2%" }}>
{totalCard &&
totalCard[0].itemData
.filter((it) => !(it.noshow === true))
.map((it) => {
return (
<div
style={{
width: it.noshow ?? "32%",
backgroundColor: "#f9f9f9",
marginRight: "1%",
marginBottom: 10,
padding: "4px",
fontSize: 16,
overflow: "hidden",
}}
>
<b>{it.title}: </b>
<span>{data[it.key] || "-"}</span>
</div>
);
})}
</div>
<p style={{ margin: 0, padding: "4px 2%", fontSize: 18 }}>
<b>{totalCard && totalCard[1].cardTitle}</b>
</p>
<div style={{ margin: 0, padding: "4px 2%", fontSize: 18 }}>
<AutoTable
dataSource={data?.materialList}
x="96%"
style={{ marginTop: 8 }}
withCard={false}
pagination={"false"}
columns={[
{
title: "物料编码 - 名称",
dataIndex: "materieName",
key: "materieName",
search: false,
render: (dom, row) => {
return (
(row.materieCode ?? "") + " - " + (row.materieName ?? "")
);
},
},
{
title: "出库数量",
dataIndex: "outstroeNum",
key: "outstroeNum",
search: false,
},
{
title: "库存单位",
dataIndex: "productionUnitName",
key: "productionUnitName",
search: false,
},
]}
></AutoTable>
</div>
</div>
)
);
}
export default forwardRef(PrintDom);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment