Commit f1624546 authored by 杨子龙's avatar 杨子龙

1、增加组件

- 增加设备指标 - 增加自定义地图 - 增加数据表个 2、修复 - 修复tagPack组件不支持16进制问题
parent 199b1e7a
...@@ -61,7 +61,7 @@ export function getTableNumberList(tableName) { ...@@ -61,7 +61,7 @@ export function getTableNumberList(tableName) {
return request({ return request({
// headers: { // headers: {
// 'Civ-Site': window?.globalConfig?.userInfo?.site // 'Civ-Site': window?.globalConfig?.userInfo?.site
// }, // },
url: `/PandaOMS/OMS/CaseManage/GetTableNumberList${tableName ? `?tableName=${tableName}` : ''}`, url: `/PandaOMS/OMS/CaseManage/GetTableNumberList${tableName ? `?tableName=${tableName}` : ''}`,
method: 'get', method: 'get',
}); });
...@@ -774,4 +774,81 @@ export function saveTableConfig(data) { ...@@ -774,4 +774,81 @@ export function saveTableConfig(data) {
method: 'post', method: 'post',
data data
}) })
} }
\ No newline at end of file
export function GetMonitorConf (params) {
return request(`/PandaMonitor/Monitor/MonitorConfig/GetMonitorConf` , {
headers: {
'civ-site':
window.globalConfig &&
window.globalConfig.userInfo &&
window.globalConfig.userInfo.site &&
window.globalConfig.userInfo.site
? window.globalConfig.userInfo.site
: '',
},
params,
method: 'GET'
});
}
export function GetSensorType () {
return request(`/PandaMonitor/Monitor/Sensor/GetSensorType?isDeviceLegend=true` , {
// headers: {
// 'civ-site':
// window.globalConfig &&
// window.globalConfig.userInfo &&
// window.globalConfig.userInfo.site &&
// window.globalConfig.userInfo.site
// ? window.globalConfig.userInfo.site
// : '',
// }
});
}
export function GetDeviceRealInfo (data) {
return request(`/PandaMonitor/Monitor/Device/GetDeviceRealInfo` , {
// headers: {
// 'civ-site':
// window.globalConfig &&
// window.globalConfig.userInfo &&
// window.globalConfig.userInfo.site &&
// window.globalConfig.userInfo.site
// ? window.globalConfig.userInfo.site
// : '',
// },
data,
method: 'POST'
});
}
export function SensorsDataForStation (data) {
return request(`/PandaMonitor/Monitor/Device/GetSensorsDataForStation` , {
// headers: {
// 'civ-site':
// window.globalConfig &&
// window.globalConfig.userInfo &&
// window.globalConfig.userInfo.site &&
// window.globalConfig.userInfo.site
// ? window.globalConfig.userInfo.site
// : '',
// },
data,
method: 'POST'
});
}
export function GetDeviceTypes () {
return request(`/PandaMonitor/Monitor/Device/GetDeviceTypes` , {
// headers: {
// 'civ-site':
// window.globalConfig &&
// window.globalConfig.userInfo &&
// window.globalConfig.userInfo.site &&
// window.globalConfig.userInfo.site
// ? window.globalConfig.userInfo.site
// : '',
// },
method: 'GET'
});
}
...@@ -181,6 +181,10 @@ const widgetData = { ...@@ -181,6 +181,10 @@ const widgetData = {
name: '区域任务', name: '区域任务',
type: 'GIS控件', type: 'GIS控件',
}, },
'CustomMap': {
name: '自定义地图',
type: 'GIS控件',
},
'RelationForm': { 'RelationForm': {
name: '关联表单', name: '关联表单',
type: '高级控件', type: '高级控件',
...@@ -193,6 +197,14 @@ const widgetData = { ...@@ -193,6 +197,14 @@ const widgetData = {
name: '手写签名', name: '手写签名',
type: '高级控件', type: '高级控件',
}, },
'IndicatorCard': {
name: '设备指标',
type: '高级控件',
},
'DataTable': {
name: '数据表格',
type: '高级控件',
},
} }
const getStyles = (type) => { const getStyles = (type) => {
......
...@@ -3946,6 +3946,54 @@ const mapWidgets = [ ...@@ -3946,6 +3946,54 @@ const mapWidgets = [
}, },
}, },
}, },
{
text: '自定义地图',
name: '自定义地图',
icon: <IconPack.AreaTask />,
schema: {
title: '自定义地图',
type: 'string',
widget: 'CustomMap',
placeholder: '',
},
setting: {
widget: {
title: '控件类型',
type: 'string',
widget: 'WidgetType',
displayType: 'row',
labelWidth: 75,
},
title: {
title: '展示名称',
type: 'string',
widget: 'htmlInput',
default: '区域任务',
},
mapName: {
title: '地图名称',
type: 'string',
default: "阀门地图"
},
addressSync: {
title: '地址同步',
type: 'string',
widget: 'AddressSync',
description: '位置信息将会同步到下方字段中',
},
height: {
title: '控件高度',
type: 'string',
default: 200
},
width: {
title: '控件占比',
type: 'string',
widget: 'RadioGroupW',
default: "100%"
},
},
}
] ]
const advancedWidgets = [ const advancedWidgets = [
...@@ -4653,7 +4701,214 @@ const advancedWidgets = [ ...@@ -4653,7 +4701,214 @@ const advancedWidgets = [
}, },
}, },
}, },
} },
{
text: '设备指标',
name: '设备指标',
icon: <IconPack.IDCard />,
schema: {
title: '设备指标',
name: '设备指标',
type: 'string',
widget: 'IndicatorCard',
placeholder: '',
},
setting: {
widget: {
title: '控件类型',
type: 'string',
widget: 'WidgetType',
displayType: 'row',
labelWidth: 80,
},
$id: {
title: '数据源',
type: 'string',
widget: 'FieldNames',
required: true,
},
title: {
title: '展示名称',
type: 'string',
},
dataType: {
title: '指标数据类型',
type: "string",
widget: "select",
enum: ["real" , "history"],
enumNames: ["实时值", "历史值"],
required: true,
default: "real"
},
fieldName: {
title: '映射字段',
name: '映射字段',
type: 'string',
widget: 'FieldName',
required: true,
hidden: '{{formData.dataType !== "history"}}',
},
timeInterval: {
title: "时间间隔",
type: 'string',
hidden: '{{formData.dataType !== "history"}}',
widget: "TimeInterval",
required: true,
},
deviceType: {
title: '设备类型',
type: 'string',
required: true,
widget: "DeviceType"
},
deviceCode: {
title: '设备选择',
widget: "IndicatorDevice",
type: 'string',
required: true,
hidden: "{{!formData.deviceType}}",
},
indicatorType: {
title: '指标类型',
widget: "IndicatorType",
type: 'string',
required: true,
hidden: "{{!formData.deviceCode && !formData.deviceCode}}",
},
width: {
title: '控件占比',
type: 'string',
widget: 'RadioGroupW',
default: "100%"
},
},
},
{
text: '数据表格',
name: '数据表格',
icon: <IconPack.AreaTask />,
schema: {
title: '数据表格',
type: 'array',
widget: 'DataTable',
placeholder: '',
width: '100%',
labelWidth: 1,
default: []
},
setting: {
widget: {
title: '控件类型',
type: 'string',
widget: 'WidgetType',
displayType: 'row',
labelWidth: 75,
},
$id: {
title: '数据源',
type: 'string',
widget: 'FieldNames',
required: true,
},
title: {
title: '展示名称',
type: 'string',
widget: 'htmlInput',
default: '关阀任务',
},
isHidden: {
title: '是否隐藏',
type: 'boolean',
widget: 'IsHidden',
default: false,
},
optionRender: {
title: '',
name: '操作栏配置',
type: 'array',
default: [
{ type: "icon", value: 'DeleteOutlined' , action: "delete"},
],
widget: 'OptionRender',
},
isGIS: {
title: '是否含有GIS数据',
type: 'boolean',
widget: "switch",
default: true,
},
pagination: {
title: '是否启用分页',
type: 'boolean',
widget: "switch",
default: true,
},
scrollX: {
title: 'x轴滚动',
type: 'number',
widget: "inputNumber",
hidden: '{{formData.pagination}}',
},
scrollY: {
title: 'y轴滚动',
type: 'number',
widget: "inputNumber",
hidden: '{{formData.pagination}}',
},
hiddenCondition: {
title: '隐藏条件',
type: 'string',
description: '所有形态默认显示',
widget: 'HiddenCondition',
hidden: "{{formData.isHidden}}",
dependencies: ['isHidden'],
},
areaTaskShine: {
title: '任务对象',
name: '任务对象',
type: 'array',
widget: 'AreaTaskShine',
default: [],
},
fieldList: {
title: '前端显示字段',
name: '前端显示字段',
type: 'array',
default: [],
widget: 'TaskFieldList',
description: '用于区域控件列表显示',
dependencies: ['areaTaskShine']
},
statusOption: {
title: '',
name: '字段样式配置',
type: 'array',
hidden: '{{formData.fieldList.length === 0}}',
default: [],
widget: 'StatusOption',
},
disabled: {
title: '只读',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '25%',
},
required: {
title: '必填',
type: 'boolean',
widget: 'checkbox',
default: false,
width: '33%',
},
width: {
title: '控件占比',
type: 'string',
widget: 'RadioGroupW',
default: "100%"
},
},
},
] ]
const settings = [ const settings = [
...@@ -4691,4 +4946,4 @@ const settings = [ ...@@ -4691,4 +4946,4 @@ const settings = [
}, },
] ]
export default settings export default settings
\ No newline at end of file
...@@ -13,7 +13,7 @@ import { getWatch } from './watch' ...@@ -13,7 +13,7 @@ import { getWatch } from './watch'
import styles from '../../main.less' import styles from '../../main.less'
const getLabelWidth = (schema) => { const getLabelWidth = (schema) => {
if (['TextHTML', 'RelationForm', 'AreaTask'].includes(schema.widget)) { if (['TextHTML', 'RelationForm', 'AreaTask' , "DataTable"].includes(schema.widget)) {
return 1 return 1
} }
return 110 return 110
...@@ -45,7 +45,7 @@ const XRender = (props, ref) => { ...@@ -45,7 +45,7 @@ const XRender = (props, ref) => {
let schemaForm = formJson ? (isObject(formJson) ? formJson : JSON.parse(formJson)) : {} let schemaForm = formJson ? (isObject(formJson) ? formJson : JSON.parse(formJson)) : {}
console.log(schemaForm, 'schemaForm'); console.log(schemaForm, 'schemaForm');
let parent = schemaForm?.properties let parent = schemaForm?.properties
let keys = Object.keys(parent); let keys = Object.keys(parent);
let parentDatas = keys.map(k=> parent[k].properties) let parentDatas = keys.map(k=> parent[k].properties)
let fieldDatas = {}; let fieldDatas = {};
...@@ -59,7 +59,7 @@ const XRender = (props, ref) => { ...@@ -59,7 +59,7 @@ const XRender = (props, ref) => {
for (let v in parent) { for (let v in parent) {
let hidden = true let hidden = true
let child = parent[v]?.properties let child = parent[v]?.properties
let childObj = {} let childObj = {}
if (isObject(child)) { if (isObject(child)) {
for (let s in child) { for (let s in child) {
...@@ -101,7 +101,7 @@ const XRender = (props, ref) => { ...@@ -101,7 +101,7 @@ const XRender = (props, ref) => {
} }
childObj[s] = { childObj[s] = {
...child[s], ...child[s],
title: ['RelationForm', 'AreaTask'].includes(child[s].widget) ? '' : child[s].title, title: ['RelationForm', 'AreaTask' , "DataTable"].includes(child[s].widget) ? '' : child[s].title,
titleShow: child[s].title || child[s].titleShow, titleShow: child[s].title || child[s].titleShow,
labelWidth: getLabelWidth(child[s]), labelWidth: getLabelWidth(child[s]),
presetValue: value || child[s].presetValue || '', presetValue: value || child[s].presetValue || '',
......
...@@ -4,8 +4,20 @@ import styles from './index.less' ...@@ -4,8 +4,20 @@ import styles from './index.less'
const hexToRgba = (hex, opacity) => { const hexToRgba = (hex, opacity) => {
if (hex) { if (hex) {
let rgb = hex.split('(')[1].split(')')[0].split(',') if(hex.includes("#")){
return 'rgba(' + rgb[0].trim() + ',' + rgb[1].trim() + ',' + rgb[2].trim() + ',' + opacity + ')' // 去除#号
const color = hex.replace("#", "");
// 分割成红、绿、蓝三部分的16进制字符串
const red = parseInt(color.substring(0,2), 16);
const green = parseInt(color.substring(2,4), 16);
const blue = parseInt(color.substring(4,6), 16);
return `RGB(${red}, ${green}, ${blue},${opacity})`;
} else {
let rgb = hex.split('(')[1].split(')')[0].split(',')
return 'rgba(' + rgb[0].trim() + ',' + rgb[1].trim() + ',' + rgb[2].trim() + ',' + opacity + ')'
}
} }
return null return null
} }
...@@ -25,4 +37,4 @@ const TagPack = (props) => { ...@@ -25,4 +37,4 @@ const TagPack = (props) => {
) )
} }
export default TagPack export default TagPack
\ No newline at end of file
import React, { Fragment , useEffect , useState } from 'react';
import moment from "moment";
import { List , Button , Empty } from 'antd';
import { isObject} from "lodash";
import { GetDeviceRealInfo, SensorsDataForStation} from "../../../../apis/process";
import { ReloadOutlined } from "@ant-design/icons"
const IndicatorCard = props => {
const { schema , addons } = props;
const [list , setList] = useState([]);
const [loading , setLoading] = useState(false);
const loopObj = (obj , newObj) => {
for (let key in obj) {
if(isObject(obj[key])){
loopObj(obj[key] , newObj)
} else {
newObj[key] = obj[key];
}
}
}
const getMappedField = () => {
let field = "";
if(addons){
const newObj = {};
const addonsForm = addons.formData;
loopObj(addonsForm , newObj);
field = newObj[schema.fieldName]
}
return field
}
const getDeviceData = async () => {
const { indicatorType , timeInterval } = schema;
const arr = [];
setLoading(true);
if(schema.dataType === "real"){
const ret = await GetDeviceRealInfo({
userID: 0,
pageIndex: 1,
pageSize: 100,
param: [{
deviceType: schema.deviceType,
deviceCode: schema.deviceCode,
}],
});
if(ret.code === 0){
ret.data.list.forEach((item) => {
item.dataList.forEach((child) => {
if(indicatorType.indexOf(child.dName) !== -1){
arr.push({
name: child.dName,
value: child.pv,
time: item.pt,
unit: window._IndicatorType[child.dName]
})
}
})
})
}
} else {
const currentField = getMappedField();
if(currentField){
const timeArr = timeInterval.split(",");
const interval = timeArr[0];
const unit = timeArr[1];
const date = moment(currentField);
const dateFrom = date.add(-interval , unit).format("YYYY-MM-DD HH:mm:ss");
const dateTo = date.add(interval, unit).format("YYYY-MM-DD HH:mm:ss");
const acrossTables = [];
const indicatorTypeList = indicatorType.split(',');
indicatorTypeList.forEach(item => {
acrossTables.push({
deviceCode: schema.deviceCode,
sensors: item,
deviceType: schema.deviceType,
})
})
const obj = {
ignoreOutliers: false,
isVertical: false,
acrossTables,
dateFrom,
dateTo,
}
const ret = await SensorsDataForStation(obj);
if(ret.code === 0){
ret.data.forEach((item) => {
const dataList = item.dataModel;
const currentData = dataList[dataList.length - 1];
arr.push({
name: item.sensorName,
value: currentData?.pv || "未获取到数据",
time: currentData?.pt || "未获取到数据",
unit: item.unit
})
})
}
}
}
setList(arr);
setLoading(false);
};
const refreshData = () => {
getDeviceData();
}
useEffect(() => {
if(schema.deviceType &&
schema.dataType &&
schema.indicatorType &&
schema.deviceCode){
getDeviceData()
} else {
setList([])
}
} , [schema])
return (
<Fragment>
<List>
{
list.length > 0 ? list.map((item , index) => {
return (
<List.Item key={index}
actions={[<span>{item.time}</span>]}
extra={<Button onClick={() => refreshData(item)}
size="small"
shape="circle"
loading={loading}
icon={<ReloadOutlined spin={loading} />} />}>
<List.Item.Meta title={item.name}
description={`${item.value || 0} ${item.unit || ""}`} />
</List.Item>
)
}) : (
<List.Item>
<Empty />
</List.Item>
)
}
</List>
</Fragment>
);
};
export default IndicatorCard;
import RelationForm from './RelationForm' import RelationForm from './RelationForm'
import Signature from './Signature' import Signature from './Signature'
import IDCard from './IDCard' import IDCard from './IDCard'
import IndicatorCard from "./IndicatorCard";
const advanced = { const advanced = {
RelationForm, RelationForm,
Signature, Signature,
IDCard, IDCard,
IndicatorCard
} }
export default advanced export default advanced
\ No newline at end of file
import React from "react";
import style from "./index.less";
const CustomMap = (props) => {
const {height , mapName} = props.schema
return <div style={{
height
}} class={style.mapContanier}>{mapName}</div>
}
export default CustomMap;
.mapContanier{
background: #F6F5F6;
color: #333;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
border-radius: 5px;
border: 1px dashed #999799;
}
import React, { Fragment, useEffect } from 'react';
import {Button, Empty, Table, Space, Input} from 'antd';
import {CheckOutlined} from "@ant-design/icons";
import * as AntdIcon from '@ant-design/icons';
import FileView from '../../../Account/components/TablePack/components/FileView';
import TagPack from '../../../components/TagPack'
import styles from './index.less';
const DataTable = props => {
const { value, onChange, schema } = props;
const {
disabled,
fieldList,
isGIS,
optionRender ,
titleShow ,
pagination ,
scrollX,
scrollY,
statusOption
} = schema;
const hasHash = (url) => {
return url.includes('#');
}
const doAction = (_, row, index , actionItem) => {
const list = [...value];
switch (actionItem.action) {
case "delete":
list.splice(index , 1);
onChange(list);
break;
case "update":
list.forEach((item , i) => {
if(i === index){
if(!row.isEditable){
row.isEditable = true;
row.type = row.type || "update";
} else {
delete row.isEditable
}
}
});
onChange(list);
break;
case "href":
if(!row.isEditable){
let str = actionItem.url;
const reg_g = /\$\{(.+?)\}/g;
const result = str.match(reg_g);
const list = []
const reg = /\$\{(.+?)\}/;
for (let i = 0; i < result.length; i++) {
const item = result[i]
list.push(item.match(reg)[1])
}
list.forEach(l => {
if(row[l]){
const s = "${" + l + "}"
str = str.replace(s, row[l])
}
})
if(hasHash(actionItem.url)){
window.history.pushState(null, null , str)
} else {
window.open(str)
}
}
break;
default:
break
}
}
const changeValue = (val, index, type) => {
const list = [...value];
list.forEach((item , i) => {
if(i === index){
item[type] = val;
}
})
onChange(list);
}
// 操作栏渲染
const getOptionRender = (_, row, index) => {
const eleList = [];
optionRender?.forEach((item , i) => {
let Element;
if (item.type === 'icon' && item.value) {
const Icon = AntdIcon[item.value];
Element = <Button size={'small'}
type="text"
key={i}
shape={'circle'}
onClick={() => doAction(_, row, index , item)}
icon={row.isEditable ? <CheckOutlined /> : <Icon />} />;
} else if (item.type === 'text') {
Element = <Button size={'small'}
key={i}
onClick={() => doAction(_, row, index, item)}
type="text">{row.isEditable ? "完成" : item.value}</Button>;
} else {
Element = <Button size={'small'}
key={i}
onClick={() => doAction(_, row, index, item)}
type="link">{row.isEditable ? "完成" : item.value}</Button>;
}
eleList.push(Element);
});
return <Fragment>
<Space>
{eleList}
</Space>
</Fragment>;
};
// 字段栏渲染
const getFieldRender = (_, row, index , item) => {
let ele;
switch (item.type) {
case "text":
if(!item.isMapped){
ele = <span style={{color: item.color}}>{_}</span>
} else {
if(item.parseStr){
const json = JSON.parse(item.parseStr);
ele = <span style={{color: json[_].color}}>{json[_].label}</span>
} else {
ele = <span>调试中...</span>
}
}
break;
case "tag":
if(!item.isMapped){
ele = <TagPack color={item.color} text={_} />
} else {
if(item.parseStr){
const json = JSON.parse(item.parseStr);
ele = <TagPack color={json[_].color} text={json[_].label} />
} else {
ele = <span>调试中...</span>
}
}
break;
}
return ele
}
const getColumns = () => {
const arr = [];
const list = statusOption?.length !== 0 ? statusOption : fieldList;
list?.forEach(item => {
if (item.fieldType === '台账' && schema?.widget === 'FileUpload') {
arr.push({
title: item.fieldAliasName,
dataIndex: isGIS ? item.fieldName : `${item.fieldType}-${item.fieldName}`,
key: isGIS ? item.fieldName : `${item.fieldType}-${item.fieldName}`,
render: (_, row) => {
return <FileView value={row[`${item.fieldType}-${item.fieldName}`]} {...schema} />;
},
});
} else if (item.fieldType === '台账' && item.fieldName === '反馈状态') {
//统一最后一行添加
} else {
const dataIndex = isGIS ? item.fieldName : `${item.fieldType}-${item.fieldName}`;
arr.push({
title: item.fieldAliasName,
dataIndex,
key: dataIndex,
render: (_, row , index) => {
return (
<Fragment>
{
row.isEditable ? (
<Input value={_}
onChange={e => changeValue(e.target.value , index , dataIndex)} />
) : getFieldRender(_, row, index , item)
}
</Fragment>
)
}
});
}
});
if (!disabled) {
arr.push({
title: '操作',
dataIndex: '',
key: '',
render: (_, row, index) => {
return getOptionRender(_, row, index);
},
});
}
return arr
};
const getData = () => {
window.relationForm = {
configs: [
{
'台账名称': schema.accountName,
'映射字段': [{ fromField: '工单编号', toField: '工单编号' }],
widget: schema.widget,
schema: schema.layerName,
accountName: schema.accountName,
tableName: schema.tableName
}
],
data: []
}
}
const columns = getColumns();
useEffect(() => {
getData();
}, []);
return (
<Fragment>
<div className={styles.dataTable}>
<div className={styles.tableTitle}>{titleShow}</div>
{columns.length !== 0 ? (
<Table
size="small"
rowKey={disabled ? 'gis-设备编号' : 'ID'}
bordered
columns={columns}
pagination={!pagination ? {
x: scrollX,
y: scrollY
} : true}
dataSource={value}
/>
) : (
<Empty />
)}
</div>
</Fragment>
);
};
export default DataTable;
@import '~antd/es/style/themes/default.less';
.dataTable {
margin-top: 5px;
.@{ant-prefix}-table-thead>tr {
height: 40px;
th {
font-weight: bold;
overflow: inherit;
user-select: none;
/* Chrome and Opera */
-webkit-user-select: none;
/* Safari */
-khtml-user-select: none;
/* Konqueror HTML */
-moz-user-select: none;
/* Firefox */
-ms-user-select: none;
/* Internet Explorer/Edge */
border-right: 1px solid #dbe7fb !important;
border-bottom: 1px solid #dbe7fb;
background: white;
}
th:last-child {
border-left: 1px solid #dbe7fb;
}
}
.@{ant-prefix}-table-tbody>tr {
&:nth-child(2n-1) {
td {
background: #f6f9fe;
}
}
td {
border-bottom: 1px solid #dbe7fb;
border-right: 1px solid #dbe7fb !important;
&:last-child {
border-left: 1px solid #dbe7fb;
}
}
&:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected) {
td {
background: rgb(237, 242, 255) !important;
}
}
}
.@{ant-prefix}-table-body {
overflow-x: scroll;
&::-webkit-scrollbar {
width: 0;
height: 12px;
}
&::-webkit-scrollbar {
width: 0;
height: 6px;
}
&::-webkit-scrollbar-thumb {
background: rgb(41, 166, 255);
}
&::-webkit-scrollbar-track {
background: #f7f4f5;
padding: 0 3px;
}
}
}
.tableTitle {
margin: 10px;
text-align: center;
}
...@@ -3,6 +3,8 @@ import Device from './Device' ...@@ -3,6 +3,8 @@ import Device from './Device'
import DrawPath from './DrawPath' import DrawPath from './DrawPath'
import DrawArea from './DrawArea' import DrawArea from './DrawArea'
import AreaTask from './AreaTask' import AreaTask from './AreaTask'
import CustomMap from "./CustomMap";
import DataTable from "./DataTable";
const coord = { const coord = {
Coordinate, Coordinate,
...@@ -10,6 +12,8 @@ const coord = { ...@@ -10,6 +12,8 @@ const coord = {
DrawPath, DrawPath,
DrawArea, DrawArea,
AreaTask, AreaTask,
CustomMap,
DataTable,
} }
export default coord export default coord
\ No newline at end of file
...@@ -24,8 +24,9 @@ const initField = [ ...@@ -24,8 +24,9 @@ const initField = [
const AreaTaskShine = (props) => { const AreaTaskShine = (props) => {
const { addons, onChange, value } = props const { addons, onChange, value , schema } = props
const formData = addons.formData const formData = addons.formData
const {title} = schema;
const [form] = Form.useForm() const [form] = Form.useForm()
const [visible, setVisible] = useState(false) const [visible, setVisible] = useState(false)
...@@ -177,7 +178,7 @@ const AreaTaskShine = (props) => { ...@@ -177,7 +178,7 @@ const AreaTaskShine = (props) => {
<Drag <Drag
getContainer={false} getContainer={false}
width='500px' width='500px'
title='巡检对象' title={title}
bodyStyle={{ maxHeight: 500, overflow: 'auto' }} bodyStyle={{ maxHeight: 500, overflow: 'auto' }}
visible={visible} visible={visible}
footer={ footer={
...@@ -195,7 +196,7 @@ const AreaTaskShine = (props) => { ...@@ -195,7 +196,7 @@ const AreaTaskShine = (props) => {
autoComplete="off" autoComplete="off"
labelCol={{ span: 5 }} labelCol={{ span: 5 }}
> >
<Form.Item label='巡检对象' name='schemeName' rules={[{ required: true, message: '巡检对象必填', }]}> <Form.Item label={title} name='schemeName' rules={[{ required: true, message: `${title}必填`, }]}>
<Select <Select
allowClear allowClear
showSearch showSearch
...@@ -341,4 +342,4 @@ const AreaTaskShine = (props) => { ...@@ -341,4 +342,4 @@ const AreaTaskShine = (props) => {
} }
export default AreaTaskShine export default AreaTaskShine
\ No newline at end of file
import React, {useEffect , Fragment , useState} from "react";
import { GetDeviceTypes } from "../../../../../apis/process";
import { Select } from 'antd';
const DeviceType = (props) => {
const { onChange , value , addons} = props;
const [options, setOptions] = useState([]);
const [loading , setLoading] = useState(false);
const getDeviceList = async () => {
setLoading(true);
const ret = await GetDeviceTypes();
const arr = [];
if(ret.code === 0){
ret.data.forEach((item , index) => {
arr.push({
label: `${item.typeName}`,
key: index,
value: item.typeName,
})
})
}
setOptions(arr);
setLoading(false);
};
useEffect(() => {
getDeviceList();
} , [])
return (
<Fragment>
<Select options={options}
loading={loading}
optionFilterProp={"label"}
onChange={(value) => {
onChange(value)
}}
value={value}
allowClear
virtual
showSearch />
</Fragment>
)
}
export default DeviceType;
...@@ -5,14 +5,16 @@ import { LoadTableV2, LoadTableFields, ReloadTableFields } from '../../../../../ ...@@ -5,14 +5,16 @@ import { LoadTableV2, LoadTableFields, ReloadTableFields } from '../../../../../
const FieldName = (props) => { const FieldName = (props) => {
const { value, onChange, addons } = props const { value, onChange, addons } = props
const { tableName } = addons.formData const { tableName , tableNameParent} = addons.formData
const [options, setOptions] = useState([]) const [options, setOptions] = useState([])
const onFocus = async () => { const onFocus = async () => {
if (!tableName) { const name = tableName || tableNameParent;
if (!name) {
return message.info('请选择表名!') return message.info('请选择表名!')
} }
const { code, data, msg } = await ReloadTableFields({ tableName: tableName }) const { code, data, msg } = await ReloadTableFields({ tableName: name })
if (code === 0) { if (code === 0) {
let result = data.root.map(v => { return { label: v.name, value: v.name } }) let result = data.root.map(v => { return { label: v.name, value: v.name } })
setOptions(result) setOptions(result)
...@@ -37,4 +39,4 @@ const FieldName = (props) => { ...@@ -37,4 +39,4 @@ const FieldName = (props) => {
} }
export default FieldName export default FieldName
\ No newline at end of file
import React, {useEffect , Fragment , useState , useRef} from "react";
import { GetDeviceRealInfo } from "../../../../../apis/process";
import { Select } from 'antd';
const IndicatorDevice = (props) => {
const { onChange , value , addons} = props;
const { deviceType } = addons.formData;
const [options, setOptions] = useState([]);
const [loading , setLoading] = useState(false);
const getDeviceList = async (deviceType) => {
setLoading(true);
const ret = await GetDeviceRealInfo({
userID: 0,
pageIndex: 1,
pageSize: 100,
param: [{ deviceType: deviceType }],
});
const arr = [];
if(ret.code === 0){
ret.data.list.forEach(item => {
arr.push({
label: `${item.sName}${item.code})`,
key: item.code,
value: item.code,
extra: item.dataList
})
})
}
setOptions(arr);
setLoading(false);
};
useEffect(() => {
if(deviceType){
getDeviceList(deviceType);
}
} , [deviceType])
return (
<Fragment>
<Select options={options}
loading={loading}
optionFilterProp={"label"}
onChange={(value , option) => {
if(value){
window._IndicatorDeviceExtra = option.extra;
}
onChange(value)
}}
value={value}
allowClear
virtual
showSearch />
</Fragment>
)
}
export default IndicatorDevice;
import React, {useEffect , Fragment , useState , useRef} from "react";
import { GetSensorType } from "../../../../../apis/process";
import { Select } from 'antd';
const IndicatorType = (props) => {
const { onChange , value , addons , schema} = props;
const { deviceCode } = addons.formData;
const [options, setOptions] = useState([]);
const [loading , setLoading] = useState(false);
const {_IndicatorDeviceExtra: []} = window;
const getSensorList = async () => {
setLoading(true);
const ret = await GetSensorType();
const arr = [] , obj = {};
if(ret.code === 0){
const { data } = ret;
_IndicatorDeviceExtra.forEach((extraItem , index) => {
const currenItem = data.find(item => extraItem.typeID === item.id);
let unit;
if(currenItem){
unit = currenItem.unit;
}
arr.push({
key: index,
label: unit ? `${extraItem.dName}(${unit})`: extraItem.dName,
value: extraItem.dName,
})
obj[extraItem.dName] = unit;
})
}
setOptions(arr);
window._IndicatorType = obj;
setLoading(false);
}
useEffect(() => {
if(deviceCode){
getSensorList();
}
} , [deviceCode])
return (
<Fragment>
<Select options={options}
loading={loading}
optionFilterProp={"label"}
onChange={(value) => {
if(value.length !== 0){
onChange(value.join(','))
} else {
onChange("");
}
}}
mode="multiple"
maxTagCount={4}
value={value ? value.split(",") : []}
allowClear
virtual
showSearch />
</Fragment>
)
}
export default IndicatorType;
import React, { useState, useEffect, useMemo, Fragment } from 'react'
import styles from './index.less'
import { Input, Popconfirm, Select , Button , Space } from 'antd'
import Drag from './../../../../components/Drag'
import DragTable from '../../../../components/DragTable'
import { DeleteOutlined, MenuOutlined , SettingOutlined } from '@ant-design/icons';
import * as antdIcons from "@ant-design/icons";
import { colors } from '../../../../../constant'
import { getNanoid } from '../../../../../utils'
const getIconsList = () => {
const arr = [];
Object.keys(antdIcons).forEach(key => {
const Icon = antdIcons[key];
if(key !== "default" &&
key !== "IconProvider" &&
key !== "setTwoToneColor" &&
key !== "getTwoToneColor" &&
key !== "createFromIconfontCN"){
arr.push({
label: <Icon />,
value: key,
key,
})
}
})
return arr;
}
const OptionRender = (props) => {
const { value, onChange, addons , schema} = props
const { color, isMultiple, widget, } = addons.formData;
const { name } = schema;
const [loading, setLoading] = useState(true)
const [currentColor, setCurrentColor] = useState('')
const [visible , setVisible] = useState(false);
const [url , setUrl] = useState("");
const iconList = getIconsList();
useEffect(() => {
if (addons) {
if (!isMultiple && widget === 'ComboBox') {
addons.setValue('color', false)
}
}
}, [isMultiple])
useEffect(() => {
setTimeout(() => {
setLoading(false)
}, 0)
}, [])
const onPressEnter = (i) => {
let length = [...value].length
let array = [...value]
array.splice(i + 1, 0, { key: getNanoid(), index: length + 1, color: colors[length % 10], value: '' })
onChange(array)
}
const inputChange = (item, i , key) => {
let array = []
value.forEach((v, index) => {
if (index === i) {
v[key] = item;
}
array.push({ ...v })
})
onChange(array)
}
const confirm = (index) => {
let array = []
value.forEach((v, i) => {
if (i !== index) {
array.push({ ...v })
}
})
onChange(array)
}
const colorClick = (item, i) => {
let array = []
value.forEach((v, index) => {
if (index === i) {
v.color = item
}
array.push({ ...v })
})
onChange(array)
}
const rest = (index) => {
let array = []
value.forEach((v, i) => {
if (index === i) {
v.color = colors[index % 10]
}
array.push({ ...v })
})
onChange(array)
}
const columns = useMemo(() => {
let columns = [
{
title: '显示类型',
dataIndex: 'type',
width: 60,
render: (r, _, i) => {
return (
<Select options={[
{
label: "文字",
value: "text"
},
{
label: "图标",
value: "icon"
},
{
label: "超链接",
value: "link"
}
]}
value={r}
style={{
width: "100%"
}}
onChange={(e) => inputChange(e, i , "type")} />
)
}
},
{
title: '显示名称',
dataIndex: 'value',
width: 100,
render: (r, _, i) => {
return (
<Fragment>
{
_.type === "icon" ? (
<Select options={iconList}
value={r}
style={{
width: "100%"
}}
allowClear
showSearch
onChange={(e) => inputChange(e, i, "value")} />
) : (
<Input
onPressEnter={() => onPressEnter(i)}
onChange={(e) => inputChange(e.target.value, i, "value")}
value={r}
/>
)
}
</Fragment>
)
}
},
{
title: '动作',
dataIndex: 'action',
width: 100,
render: (r, _, i) => {
return (
<Fragment>
<Select options={[
{
label: "删除",
value: "delete"
},
{
label: "编辑",
value: "update"
},
{
label: "跳转",
value: "href"
}
]} value={r}
style={{
width: 80
}}
onChange={(e) => inputChange(e, i, "action")} />
{
r === "href" && (
<Button type={"text"}
onClick={() => {
setUrl(_.url);
setVisible(true);
}}
icon={<SettingOutlined />} />
)
}
</Fragment>
)
}
},
// {
// title: '颜色',
// dataIndex: 'color',
// width: 30,
// render: (r, _, index) => {
// const content = (
// <div>
// <div className={styles.colorTop}>
// <div className={styles.topLeft}>请选择颜色</div>
// <div className={styles.topRight}>
// <Popconfirm
// overlayClassName={styles.Popconfirmtitle}
// placement="topLeft"
// icon={false}
// title={
// <SketchPicker width="217px" color={currentColor} onChange={e => {
// setCurrentRgba(`rgb(${e.rgb.r}, ${e.rgb.g}, ${e.rgb.b})`)
// setCurrentColor(e.hex)
// }} />
// }
// onConfirm={() => {
// let array = []
// value.forEach((v, i2) => {
// if (index === i2) {
// v.color = currentRgba
// }
// array.push({ ...v })
// })
// onChange(array)
// }}
// >
// <div className={styles.colorsSelect}></div>
// </Popconfirm>
// </div>
// </div>
// <div className={styles.colorBox}>
// {
// colors.map((v, i) => {
// return (
// <div className={styles.colors} style={{ background: v }} onClick={() => colorClick(v, index)}>
// <CheckOutlined style={{ fontSize: '11px', marginLeft: '5px', display: r === v ? 'inline-block' : 'none' }} />
// </div>
// )
// })
// }
// </div>
// </div>
// )
// return (
// <Popover
// content={content}
// trigger='click'
// >
// <div className={styles.colors} style={{ background: r || '#f2f4f5' }}></div>
// </Popover>
// )
// }
// },
{
width: 30,
render: (r, _, i) => {
return (
<Fragment>
<Popconfirm
title='确定删除?'
onConfirm={() => confirm(i)}
onCancel={() => { }}
>
<DeleteOutlined style={{ color: 'rgb(153, 153, 153)' }} />
</Popconfirm>
</Fragment>
)
},
},
{
title: '',
dataIndex: 'sort',
width: 30,
className: 'drag-visible',
render: () => <MenuOutlined style={{ cursor: 'grab', color: '#999', }} />,
},
]
if (!color) {
return columns.filter(v => v.dataIndex !== 'color')
}
return columns
}, [value, color, currentColor])
const switchChange = (checked) => {
addons.setValue('color', checked)
if (checked) {
if (Array.isArray(value)) {
let array = []
value.forEach((v, i) => {
array.push({ ...v, color: colors[i % 10] })
})
onChange(array)
}
}
}
const add = () => {
let length = [...value].length
let array = [...value]
array.push({ key: getNanoid(), index: length + 1, color: colors[length % 10], value: '' })
onChange(array)
}
const onOk = () => {
const list = [...value];
list.forEach(item => {
if(item.type === "link"){
item.url = url
}
});
onChange(list);
setVisible(false);
}
const dragCallBack = (array) => {
if (array) {
onChange(array)
}
}
return (
<div className={styles.simpleList}>
<div className={styles.title}>
<div style={{ fontSize: '14px' }}>{name}</div>
{/*<div style={{ fontSize: '12px' }}>*/}
{/* <span style={{ paddingRight: '5px' }}>彩色</span>*/}
{/* <Switch size="small" checked={color} onChange={switchChange} />*/}
{/*</div>*/}
</div>
<div className={styles.box}>
{loading ? null : (
<DragTable
dataSource={
Array.isArray(value)
? value.map((v, i) => {
return { key: `${i}`, index: i, ...v };
})
: []
}
showHeader={true}
rowKey="key"
ItemTypes="stadingOrder"
color={color}
scroll={{
x: 500,
}}
columns={columns}
pagination={false}
dragCallBack={dragCallBack}
/>
)}
</div>
{value?.length < 3 && (
<div className={styles.footer}>
<span onClick={add}>添加选项</span>
</div>
)}
<Drag title="跳转链接"
onOk={onOk}
onCancel={() => setVisible(false)}
visible={visible}>
<Input.TextArea rows={5} value={url} placeholder="请输入跳转链接" onChange={e => setUrl(e.target.value)} />
</Drag>
</div>
);
}
export default OptionRender
.simpleList {
.title {
display: flex;
justify-content: space-between;
}
.box {
padding: 0 5px;
.item {
margin-top: 5px;
}
}
.footer {
margin-top: 4px;
span {
display: inline-block;
color: #1495ff;
&:nth-child(2) {
margin: 0 5px;
width: 2px;
height: 11px;
background: #a5a5a5;
}
&:hover {
cursor: pointer;
}
}
}
}
.colorTop {
display: flex;
justify-content: space-between;
.topLeft {
font-size: 15px;
font-weight: 700;
color: #707070;
}
.topRight {
font-size: 12px;
color: #41b3ec;
&:hover {
cursor: pointer;
}
}
}
.colorBox {
width: 130px;
display: flex;
flex-wrap: wrap;
}
.colorsSelect {
width: 20px;
height: 20px;
border: 1px solid #40a9ff;
border-radius: 2px;
background: linear-gradient(135deg, rgb(255, 77, 79), rgb(115, 209, 61), rgb(89, 126, 247), rgb(54, 207, 201));
&:hover {
cursor: pointer;
}
}
.colors {
width: 20px;
height: 20px;
border-radius: 50%;
margin-top: 6px;
margin-left: 6px;
&:hover {
cursor: pointer;
}
}
\ No newline at end of file
import React, { useState, useEffect, useMemo, Fragment } from 'react'
import styles from './index.less'
import {Switch, Input, Popconfirm, Popover, Select , Button , Space} from 'antd'
import DragTable from '../../../../components/DragTable'
import { CheckOutlined , SettingOutlined } from '@ant-design/icons';
import { colors } from '../../../../../constant'
import { getNanoid } from '../../../../../utils'
import { SketchPicker } from 'react-color'
import Drag from "../../../../components/Drag";
function getSelectOption(list) {
if(list){
const arr = [...list];
arr?.forEach(item => {
item.label = item.fieldName;
item.value = item.fieldName;
})
return arr
} else {
return []
}
}
function getTableData(list) {
if(list){
const arr = [...list];
list?.forEach((item) => {
item.type = "text";
})
return arr;
} else {
return []
}
}
const StatusOption = (props) => {
const { value, onChange, addons , schema} = props
const { color, isMultiple, widget, fieldList } = addons.formData;
const { name } = schema;
const [loading, setLoading] = useState(true)
const [currentColor, setCurrentColor] = useState('')
const [currentRgba, setCurrentRgba] = useState('')
const [visible , setVisible] = useState(false);
const [parseObj , setParseObj] = useState(`{"key": {"color": "" , "label": ""}}`);
const options = getSelectOption(fieldList);
const data = value?.length ? value : getTableData(fieldList);
const initData = () => {
fieldList.forEach(item => {
const currentItem = value.find(v => item.fieldName === v.fieldName)
if(currentItem){
item.color = currentItem.color;
item.type = currentItem.type;
} else {
item.type = "text";
item.color = "rgb(65,68,69)";
item.isMapped = false;
}
});
onChange(fieldList);
}
useEffect(() => {
if (addons) {
if (!isMultiple && widget === 'ComboBox') {
addons.setValue('color', false)
}
}
}, [isMultiple])
useEffect(() => {
if(value?.length !== fieldList?.length){
initData()
}
} , [fieldList])
useEffect(() => {
setTimeout(() => {
setLoading(false)
}, 0)
}, [])
const onPressEnter = (i) => {
let length = [...data].length
let array = [...data]
array.splice(i + 1, 0, { key: getNanoid(), index: length + 1, color: colors[length % 10], value: '' })
onChange(array)
}
const inputChange = (val, i , key , item) => {
let array = []
data.forEach((v, index) => {
if (index === i) {
v[key] = val;
}
array.push({ ...v })
})
onChange(array)
}
const confirm = (index) => {
let array = []
data.forEach((v, i) => {
if (i !== index) {
array.push({ ...v })
}
})
onChange(array)
}
const colorClick = (item, i) => {
let array = []
data.forEach((v, index) => {
if (index === i) {
v.color = item
}
array.push({ ...v })
})
onChange(array)
}
const rest = (index) => {
let array = []
data.forEach((v, i) => {
if (index === i) {
v.color = colors[index % 10]
}
array.push({ ...v })
})
onChange(array)
}
const columns = useMemo(() => {
let columns = [
{
title: '字段',
dataIndex: 'fieldName',
width: 60,
render: (r, _, i) => {
return (
<Select options={options}
disabled
value={r}
style={{
width: "100%"
}} />
)
}
},
{
title: '显示类型',
dataIndex: 'type',
width: 40,
render: (r, _, i) => {
return (
<Select options={[
{
label: "文字",
value: "text"
},
{
label: "标签",
value: "tag"
},
]}
value={r}
style={{
width: "100%"
}}
onChange={(e) => inputChange(e, i , "type" , _)} />
)
}
},
{
title: '样式映射',
dataIndex: 'isMapped',
width: 60,
render: (r, _, i) => {
return (
<Fragment>
<Space>
<Switch checkedChildren="开启"
unCheckedChildren="关闭"
value={r}
onChange={(e) => inputChange(e, i , "isMapped" , _)}
/>
{
_.isMapped && (
<Button type={"text"} onClick={() => {
setVisible(true);
setParseObj(_.parseStr || `{"key": {"color": "" , "label": ""}}`)
}} icon={<SettingOutlined />} />
)
}
</Space>
</Fragment>
)
}
},
{
title: '颜色',
dataIndex: 'color',
width: 30,
render: (r, _, index) => {
const content = (
<div>
<div className={styles.colorTop}>
<div className={styles.topLeft}>请选择颜色</div>
<div className={styles.topRight}>
<Popconfirm
overlayClassName={styles.Popconfirmtitle}
placement="topLeft"
icon={false}
title={
<SketchPicker width="217px" color={currentColor} onChange={e => {
setCurrentRgba(`rgb(${e.rgb.r}, ${e.rgb.g}, ${e.rgb.b})`)
setCurrentColor(e.hex)
}} />
}
onConfirm={() => {
let array = []
value.forEach((v, i2) => {
if (index === i2) {
v.color = currentRgba
}
array.push({ ...v })
})
onChange(array)
}}
>
<div className={styles.colorsSelect}></div>
</Popconfirm>
</div>
</div>
<div className={styles.colorBox}>
{
colors.map((v, i) => {
return (
<div className={styles.colors} style={{ background: v }} onClick={() => colorClick(v, index)}>
<CheckOutlined style={{ fontSize: '11px', marginLeft: '5px', display: r === v ? 'inline-block' : 'none' }} />
</div>
)
})
}
</div>
</div>
)
return (
<Fragment>
{
!_.isMapped && (
<Popover content={content}
trigger='click'>
<div className={styles.colors} style={{ background: r || '#f2f4f5' }}></div>
</Popover>
)
}
</Fragment>
)
}
}
]
if (!color) {
return columns.filter(v => v.dataIndex !== 'color')
}
return columns
}, [data, color, currentColor])
const switchChange = (checked) => {
addons.setValue('color', checked)
if (checked) {
if (Array.isArray(data)) {
let array = []
data.forEach((v, i) => {
if(!i.color){
array.push({ ...v, color: colors[i % 10] })
}
})
onChange(array)
}
} else{
let array = []
data.forEach((v, i) => {
if(i.color){
delete i.color
}
})
onChange(array)
}
}
const onOk = () => {
const list = [...value];
list.forEach(item => {
item.parseStr = parseObj
});
onChange(list);
setVisible(false);
}
const add = () => {
let length = [...data].length
let array = [...data]
array.push({ key: getNanoid(), index: length + 1, color: colors[length % 10], value: '' })
onChange(array)
}
const dragCallBack = (array) => {
if (array) {
onChange(array)
}
}
return (
<div className={styles.simpleList}>
<div className={styles.title}>
<div style={{fontSize: '14px'}}>{name}</div>
<div style={{fontSize: '12px'}}>
<span style={{paddingRight: '5px'}}>彩色</span>
<Switch size="small" checked={color} onChange={switchChange}/>
</div>
</div>
<div className={styles.box}>
{loading ? null : (
<DragTable
dataSource={
Array.isArray(data)
? data.map((v, i) => {
return {key: `${i}`, index: i, ...v};
})
: []
}
showHeader={true}
rowKey="key"
ItemTypes="stadingOrder"
color={color}
scroll={{
x: 500,
}}
columns={columns}
pagination={false}
dragCallBack={dragCallBack}
/>
)}
</div>
<Drag title="字段颜色映射"
onOk={onOk}
onCancel={() => setVisible(false)}
visible={visible}>
<Input.TextArea rows={5}
value={parseObj}
placeholder="请输入跳转链接"
onChange={e => setParseObj(e.target.value)} />
</Drag>
</div>
);
}
export default StatusOption
.simpleList {
.title {
display: flex;
justify-content: space-between;
}
.box {
padding: 0 5px;
.item {
margin-top: 5px;
}
}
.footer {
margin-top: 4px;
span {
display: inline-block;
color: #1495ff;
&:nth-child(2) {
margin: 0 5px;
width: 2px;
height: 11px;
background: #a5a5a5;
}
&:hover {
cursor: pointer;
}
}
}
}
.colorTop {
display: flex;
justify-content: space-between;
.topLeft {
font-size: 15px;
font-weight: 700;
color: #707070;
}
.topRight {
font-size: 12px;
color: #41b3ec;
&:hover {
cursor: pointer;
}
}
}
.colorBox {
width: 130px;
display: flex;
flex-wrap: wrap;
}
.colorsSelect {
width: 20px;
height: 20px;
border: 1px solid #40a9ff;
border-radius: 2px;
background: linear-gradient(135deg, rgb(255, 77, 79), rgb(115, 209, 61), rgb(89, 126, 247), rgb(54, 207, 201));
&:hover {
cursor: pointer;
}
}
.colors {
width: 20px;
height: 20px;
border-radius: 50%;
margin-top: 6px;
margin-left: 6px;
&:hover {
cursor: pointer;
}
}
...@@ -72,6 +72,9 @@ const TaskFieldList = (props) => { ...@@ -72,6 +72,9 @@ const TaskFieldList = (props) => {
array.push({ fieldName: v, fieldAliasName: fieldAliasName, fieldType: '台账', }) array.push({ fieldName: v, fieldAliasName: fieldAliasName, fieldType: '台账', })
}) })
} }
addons.setValueByPath("StatusOption" , array)
onChange(array) onChange(array)
setVisible(false) setVisible(false)
} }
...@@ -120,4 +123,4 @@ const TaskFieldList = (props) => { ...@@ -120,4 +123,4 @@ const TaskFieldList = (props) => {
) )
} }
export default TaskFieldList export default TaskFieldList
\ No newline at end of file
import React, {Fragment, useEffect, useState} from "react";
import { Input , Select} from "antd";
const timeList = [
{
label: "分钟",
key: "minutes",
value: "minutes"
},
{
label: "小时",
key: "hours",
value: "hours"
},
{
label: "天",
key: "days",
value: "days"
},
{
label: "月",
key: "months",
value: "months"
},
{
label: "年",
key: "years",
value: "years"
}
]
const TimeInterval = (props) => {
const { onChange , value , addons} = props;
const valList = value ? value.split(','): [];
const [val , setVal] = useState(valList[0] || "0");
const [unit , setUnit] = useState(valList[1] || "minutes")
const selectAfter = (
<Select value={unit}
options={timeList}
onChange={val => {
setUnit(val)
}} />
);
useEffect(() => {
if(val && unit){
onChange(`${val},${unit}`)
} else {
onChange("");
}
} , [unit , val])
return (
<Fragment>
<Input value={val}
addonAfter={selectAfter}
onChange={e => {
const inputVal = e.target.value;
setVal(inputVal);
}} />
</Fragment>
)
}
export default TimeInterval;
...@@ -19,6 +19,12 @@ import OtherSource from './OtherSource' ...@@ -19,6 +19,12 @@ import OtherSource from './OtherSource'
import TemplateFile from './TemplateFile' import TemplateFile from './TemplateFile'
import AreaSync from './AreaSync' import AreaSync from './AreaSync'
import AreaTaskShine from './AreaTaskShine' import AreaTaskShine from './AreaTaskShine'
import IndicatorType from "./IndicatorType";
import IndicatorDevice from "./IndicatorDevice";
import TimeInterval from "./TimeInterval";
import DeviceType from "./DeviceType";
import OptionRender from "./OptionRender";
import StatusOption from "./StatusOption";
const groupSource = { const groupSource = {
Dictionary, Dictionary,
...@@ -42,6 +48,12 @@ const groupSource = { ...@@ -42,6 +48,12 @@ const groupSource = {
OtherSource, OtherSource,
TemplateFile, TemplateFile,
AreaTaskShine, AreaTaskShine,
IndicatorType,
IndicatorDevice,
TimeInterval,
DeviceType,
OptionRender,
StatusOption
} }
export default groupSource export default groupSource
\ No newline at end of file
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