@fruits-chain/sop
Version:
A component for sop
666 lines (638 loc) • 40.4 kB
JavaScript
import { Form, Space, Field, NumberInput, TextInput, Card, Divider, Collapse } from '@fruits-chain/react-native-xiaoshu';
import React, { useMemo, useEffect, Fragment } from 'react';
import { View, Text } from 'react-native';
import Upload$1, { formatUploadList } from '@fruits-chain/react-native-upload';
import EStyleSheet from 'react-native-extended-stylesheet';
import Upload from '@fruits-chain/upload';
var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
var dayjs_min = {exports: {}};
(function (module, exports) {
!function(t,e){module.exports=e();}(commonjsGlobal,(function(){var t=1e3,e=6e4,n=36e5,r="millisecond",i="second",s="minute",u="hour",a="day",o="week",c="month",f="quarter",h="year",d="date",l="Invalid Date",$=/^(\d{4})[-/]?(\d{1,2})?[-/]?(\d{0,2})[Tt\s]*(\d{1,2})?:?(\d{1,2})?:?(\d{1,2})?[.:]?(\d+)?$/,y=/\[([^\]]+)]|Y{1,4}|M{1,4}|D{1,2}|d{1,4}|H{1,2}|h{1,2}|a|A|m{1,2}|s{1,2}|Z{1,2}|SSS/g,M={name:"en",weekdays:"Sunday_Monday_Tuesday_Wednesday_Thursday_Friday_Saturday".split("_"),months:"January_February_March_April_May_June_July_August_September_October_November_December".split("_"),ordinal:function(t){var e=["th","st","nd","rd"],n=t%100;return "["+t+(e[(n-20)%10]||e[n]||e[0])+"]"}},m=function(t,e,n){var r=String(t);return !r||r.length>=e?t:""+Array(e+1-r.length).join(n)+t},v={s:m,z:function(t){var e=-t.utcOffset(),n=Math.abs(e),r=Math.floor(n/60),i=n%60;return (e<=0?"+":"-")+m(r,2,"0")+":"+m(i,2,"0")},m:function t(e,n){if(e.date()<n.date())return -t(n,e);var r=12*(n.year()-e.year())+(n.month()-e.month()),i=e.clone().add(r,c),s=n-i<0,u=e.clone().add(r+(s?-1:1),c);return +(-(r+(n-i)/(s?i-u:u-i))||0)},a:function(t){return t<0?Math.ceil(t)||0:Math.floor(t)},p:function(t){return {M:c,y:h,w:o,d:a,D:d,h:u,m:s,s:i,ms:r,Q:f}[t]||String(t||"").toLowerCase().replace(/s$/,"")},u:function(t){return void 0===t}},g="en",D={};D[g]=M;var p="$isDayjsObject",S=function(t){return t instanceof _||!(!t||!t[p])},w=function t(e,n,r){var i;if(!e)return g;if("string"==typeof e){var s=e.toLowerCase();D[s]&&(i=s),n&&(D[s]=n,i=s);var u=e.split("-");if(!i&&u.length>1)return t(u[0])}else {var a=e.name;D[a]=e,i=a;}return !r&&i&&(g=i),i||!r&&g},O=function(t,e){if(S(t))return t.clone();var n="object"==typeof e?e:{};return n.date=t,n.args=arguments,new _(n)},b=v;b.l=w,b.i=S,b.w=function(t,e){return O(t,{locale:e.$L,utc:e.$u,x:e.$x,$offset:e.$offset})};var _=function(){function M(t){this.$L=w(t.locale,null,!0),this.parse(t),this.$x=this.$x||t.x||{},this[p]=!0;}var m=M.prototype;return m.parse=function(t){this.$d=function(t){var e=t.date,n=t.utc;if(null===e)return new Date(NaN);if(b.u(e))return new Date;if(e instanceof Date)return new Date(e);if("string"==typeof e&&!/Z$/i.test(e)){var r=e.match($);if(r){var i=r[2]-1||0,s=(r[7]||"0").substring(0,3);return n?new Date(Date.UTC(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)):new Date(r[1],i,r[3]||1,r[4]||0,r[5]||0,r[6]||0,s)}}return new Date(e)}(t),this.init();},m.init=function(){var t=this.$d;this.$y=t.getFullYear(),this.$M=t.getMonth(),this.$D=t.getDate(),this.$W=t.getDay(),this.$H=t.getHours(),this.$m=t.getMinutes(),this.$s=t.getSeconds(),this.$ms=t.getMilliseconds();},m.$utils=function(){return b},m.isValid=function(){return !(this.$d.toString()===l)},m.isSame=function(t,e){var n=O(t);return this.startOf(e)<=n&&n<=this.endOf(e)},m.isAfter=function(t,e){return O(t)<this.startOf(e)},m.isBefore=function(t,e){return this.endOf(e)<O(t)},m.$g=function(t,e,n){return b.u(t)?this[e]:this.set(n,t)},m.unix=function(){return Math.floor(this.valueOf()/1e3)},m.valueOf=function(){return this.$d.getTime()},m.startOf=function(t,e){var n=this,r=!!b.u(e)||e,f=b.p(t),l=function(t,e){var i=b.w(n.$u?Date.UTC(n.$y,e,t):new Date(n.$y,e,t),n);return r?i:i.endOf(a)},$=function(t,e){return b.w(n.toDate()[t].apply(n.toDate("s"),(r?[0,0,0,0]:[23,59,59,999]).slice(e)),n)},y=this.$W,M=this.$M,m=this.$D,v="set"+(this.$u?"UTC":"");switch(f){case h:return r?l(1,0):l(31,11);case c:return r?l(1,M):l(0,M+1);case o:var g=this.$locale().weekStart||0,D=(y<g?y+7:y)-g;return l(r?m-D:m+(6-D),M);case a:case d:return $(v+"Hours",0);case u:return $(v+"Minutes",1);case s:return $(v+"Seconds",2);case i:return $(v+"Milliseconds",3);default:return this.clone()}},m.endOf=function(t){return this.startOf(t,!1)},m.$set=function(t,e){var n,o=b.p(t),f="set"+(this.$u?"UTC":""),l=(n={},n[a]=f+"Date",n[d]=f+"Date",n[c]=f+"Month",n[h]=f+"FullYear",n[u]=f+"Hours",n[s]=f+"Minutes",n[i]=f+"Seconds",n[r]=f+"Milliseconds",n)[o],$=o===a?this.$D+(e-this.$W):e;if(o===c||o===h){var y=this.clone().set(d,1);y.$d[l]($),y.init(),this.$d=y.set(d,Math.min(this.$D,y.daysInMonth())).$d;}else l&&this.$d[l]($);return this.init(),this},m.set=function(t,e){return this.clone().$set(t,e)},m.get=function(t){return this[b.p(t)]()},m.add=function(r,f){var d,l=this;r=Number(r);var $=b.p(f),y=function(t){var e=O(l);return b.w(e.date(e.date()+Math.round(t*r)),l)};if($===c)return this.set(c,this.$M+r);if($===h)return this.set(h,this.$y+r);if($===a)return y(1);if($===o)return y(7);var M=(d={},d[s]=e,d[u]=n,d[i]=t,d)[$]||1,m=this.$d.getTime()+r*M;return b.w(m,this)},m.subtract=function(t,e){return this.add(-1*t,e)},m.format=function(t){var e=this,n=this.$locale();if(!this.isValid())return n.invalidDate||l;var r=t||"YYYY-MM-DDTHH:mm:ssZ",i=b.z(this),s=this.$H,u=this.$m,a=this.$M,o=n.weekdays,c=n.months,f=n.meridiem,h=function(t,n,i,s){return t&&(t[n]||t(e,r))||i[n].slice(0,s)},d=function(t){return b.s(s%12||12,t,"0")},$=f||function(t,e,n){var r=t<12?"AM":"PM";return n?r.toLowerCase():r};return r.replace(y,(function(t,r){return r||function(t){switch(t){case"YY":return String(e.$y).slice(-2);case"YYYY":return b.s(e.$y,4,"0");case"M":return a+1;case"MM":return b.s(a+1,2,"0");case"MMM":return h(n.monthsShort,a,c,3);case"MMMM":return h(c,a);case"D":return e.$D;case"DD":return b.s(e.$D,2,"0");case"d":return String(e.$W);case"dd":return h(n.weekdaysMin,e.$W,o,2);case"ddd":return h(n.weekdaysShort,e.$W,o,3);case"dddd":return o[e.$W];case"H":return String(s);case"HH":return b.s(s,2,"0");case"h":return d(1);case"hh":return d(2);case"a":return $(s,u,!0);case"A":return $(s,u,!1);case"m":return String(u);case"mm":return b.s(u,2,"0");case"s":return String(e.$s);case"ss":return b.s(e.$s,2,"0");case"SSS":return b.s(e.$ms,3,"0");case"Z":return i}return null}(t)||i.replace(":","")}))},m.utcOffset=function(){return 15*-Math.round(this.$d.getTimezoneOffset()/15)},m.diff=function(r,d,l){var $,y=this,M=b.p(d),m=O(r),v=(m.utcOffset()-this.utcOffset())*e,g=this-m,D=function(){return b.m(y,m)};switch(M){case h:$=D()/12;break;case c:$=D();break;case f:$=D()/3;break;case o:$=(g-v)/6048e5;break;case a:$=(g-v)/864e5;break;case u:$=g/n;break;case s:$=g/e;break;case i:$=g/t;break;default:$=g;}return l?$:b.a($)},m.daysInMonth=function(){return this.endOf(c).$D},m.$locale=function(){return D[this.$L]},m.locale=function(t,e){if(!t)return this.$L;var n=this.clone(),r=w(t,e,!0);return r&&(n.$L=r),n},m.clone=function(){return b.w(this.$d,this)},m.toDate=function(){return new Date(this.valueOf())},m.toJSON=function(){return this.isValid()?this.toISOString():null},m.toISOString=function(){return this.$d.toISOString()},m.toString=function(){return this.$d.toUTCString()},M}(),k=_.prototype;return O.prototype=k,[["$ms",r],["$s",i],["$m",s],["$H",u],["$W",a],["$M",c],["$y",h],["$D",d]].forEach((function(t){k[t[1]]=function(e){return this.$g(e,t[0],t[1])};})),O.extend=function(t,e){return t.$i||(t(e,_,O),t.$i=!0),O},O.locale=w,O.isDayjs=S,O.unix=function(t){return O(1e3*t)},O.en=D[g],O.Ls=D,O.p={},O}));
}(dayjs_min));
var dayjs = dayjs_min.exports;
const maybeRules = (flag, rules) => {
if (flag)
return rules;
return [];
};
const maybeTips = (text, tips) => {
if (tips) {
return `${text}（${tips}）`;
}
return text;
};
const fieldKeyMap = {
["TEXT_TYPE" /* SopCheckItemEnum.TextType */]: 'TEXT_TYPE',
["RADIO_TYPE" /* SopCheckItemEnum.RadioType */]: 'RADIO_TYPE',
["FILE_TYPE" /* SopCheckItemEnum.FileType */]: 'FILE_TYPE',
["DATE_TYPE" /* SopCheckItemEnum.DateType */]: 'DATE_TYPE',
["CHECKBOX_TYPE" /* SopCheckItemEnum.CheckboxType */]: 'CHECKBOX_TYPE',
["UNKNOWN" /* SopCheckItemEnum.Unknown */]: '',
["UNRECOGNIZED" /* SopCheckItemEnum.Unrecognized */]: '',
["UNSPECIFIED" /* SopCheckItemEnum.Unspecified */]: '',
};
const fieldDefaultValueMap = {
["TEXT_TYPE" /* SopCheckItemEnum.TextType */]: '',
["RADIO_TYPE" /* SopCheckItemEnum.RadioType */]: '',
["FILE_TYPE" /* SopCheckItemEnum.FileType */]: [],
["DATE_TYPE" /* SopCheckItemEnum.DateType */]: '',
["CHECKBOX_TYPE" /* SopCheckItemEnum.CheckboxType */]: [],
["UNKNOWN" /* SopCheckItemEnum.Unknown */]: '',
["UNRECOGNIZED" /* SopCheckItemEnum.Unrecognized */]: '',
["UNSPECIFIED" /* SopCheckItemEnum.Unspecified */]: '',
};
const _fileList2uploadList = (files, conversion) => {
return (files?.map?.(file => (conversion ? formatUploadList([file])[0] : file)) ||
[]);
};
const data2formValues = (data, file2uploadItem = true) => {
return (data?.map(template => ({
...template,
sopCheckItems: template.sopCheckItems?.map(question => {
const key = fieldKeyMap[question.type];
let value = question.sopResult?.checkResult?.[key];
// 数字类型：后端返回的string，需要解析为数字
if (key === 'TEXT_TYPE' &&
question.inputTextRule === "ONLY_NUMBER" /* InputTextRule.OnlyNumber */) {
value = parseFloat(value);
if (isNaN(value)) {
value = null;
}
}
// 文件类型，需要转化为UploadItem[]类型
if (key === 'FILE_TYPE') {
value = _fileList2uploadList(value, file2uploadItem);
}
// 单选类型，中台会返回“0”表示空，因此需要格式化未null
if (key === 'RADIO_TYPE') {
if (value === '0') {
value = undefined;
}
}
return {
...question,
sopResult: {
...(question.sopResult || {}),
fileLink: _fileList2uploadList(question.sopResult?.fileLink, file2uploadItem),
checkResult: { [key]: value },
},
};
}) || [],
})) || []);
};
/**
* 时间戳转时间字符串
* @param timestamp 要转换的时间戳
* @param format 转换格式
* @returns 转换后的时间字符串
*/
const timestamp2time = (timestamp, format = 'YYYY-MM-DD HH:mm') => {
if (timestamp) {
return dayjs(timestamp).format(format);
}
return '';
};
const Option = ({ option, bg = false }) => {
const bgStyle = bg
? {
marginRight: 14,
backgroundColor: '#F9F9F9',
borderRadius: 8,
}
: {};
const wrapStyle = {
flex: 1,
marginVertical: 8,
padding: 6,
...bgStyle,
};
return (React.createElement(View, { style: wrapStyle },
React.createElement(Text, { style: {
color: '#11151A',
fontSize: 16,
} }, option.label),
option?.remarks ? (React.createElement(Text, { style: {
color: '#8C9199',
fontSize: 12,
paddingTop: 6,
} }, option.remarks)) : null));
};
var Option$1 = Option;
const Title = ({ required = false, text }) => {
return (React.createElement(View, { style: styles$2.wrap },
required && React.createElement(Text, { style: styles$2.required }, "*"),
React.createElement(Text, { style: styles$2.text }, text)));
};
const styles$2 = EStyleSheet.create({
wrap: {
flexDirection: 'row',
},
required: {
marginLeft: -2,
color: '#F92F2F',
},
text: {
color: '#11151A',
fontSize: 16,
lineHeight: 22,
},
});
var Title$1 = Title;
const FileRemarkFormItem = ({ form, question, name, uploadProps, }) => {
return (React.createElement(Form.Item, { name: [...name, 'fileLink'], rules: [
...maybeRules(question.remarkRequired, [
() => ({
type: 'array',
required: form.strictValidation,
message: `请为[${question.name}]选择文件`,
}),
]),
() => ({
validator(_, val) {
if (!form.strictValidation)
return Promise.resolve(true);
if (val?.some(item => item.status === 'loading')) {
return Promise.reject(new Error(`${question.name}文件上传中...`));
}
if (val?.some(item => item.status === 'error')) {
return Promise.reject(new Error(`${question.name}文件上传失败`));
}
return Promise.resolve(true);
},
}),
], valuePropName: "list" },
React.createElement(Upload, { cropPickerMediaType: "any", pickerType: [
'cropPicker',
'cropCameraPhoto',
'cropCameraVideo',
'visionCamera',
], maxCount: 10, tipText: "\u56FE\u7247/\u89C6\u9891", ...uploadProps })));
};
var FileRemarkFormItem$1 = FileRemarkFormItem;
const Tips = ({ text, style, ...viewProps }) => {
return (React.createElement(View, { style: [
{
paddingHorizontal: 8,
paddingVertical: 8,
borderRadius: 4,
backgroundColor: '#F9F9F9',
},
style,
], ...viewProps },
React.createElement(Text, { style: {
color: '#8C9199',
fontSize: 12,
lineHeight: 17,
} }, text)));
};
var Tips$1 = Tips;
const CheckboxFormItem = ({ form, question, namePrefix, uploadProps, name, ...restProps }) => {
const options = question.options?.map(option => {
return {
label: option?.name,
value: option?.value,
remarks: option?.remarks,
};
}) || [];
return (React.createElement(Space, { gap: 0, head: 8, tail: 12 },
React.createElement(Form.Item, { name: [...name, 'checkResult', fieldKeyMap[question.type]], rules: maybeRules(question.required, [
() => ({
type: 'array',
required: form.strictValidation,
message: `请选择${question.name}`,
}),
]) },
React.createElement(Field.Selector, { multiple: true, options: options.map(option => ({
...option,
render() {
return React.createElement(Option$1, { bg: true, option: option });
},
})), title: React.createElement(Title$1, { required: question.required, text: question.name }), innerStyle: {
marginHorizontal: 0,
paddingHorizontal: 0,
alignItems: 'center',
}, clearable: true, placeholder: "\u8BF7\u9009\u62E9", divider: false, ...restProps })),
React.createElement(Space, { gap: 12 },
!!question.remarks && React.createElement(Tips$1, { text: question.remarks }),
question.isRemark && (React.createElement(FileRemarkFormItem$1, { form: form, question: question, namePrefix: namePrefix, name: name, uploadProps: uploadProps })))));
};
var CheckboxFormItem$1 = CheckboxFormItem;
const DateFormItem = ({ form, question, namePrefix, name, uploadProps, ...restProps }) => {
const namePath = [...name, 'checkResult', fieldKeyMap[question.type]];
const wholeNamePath = [...namePrefix, ...namePath];
return (React.createElement(React.Fragment, null,
React.createElement(Form.Item, { name: namePath, rules: maybeRules(question.required, [
() => ({
required: form.strictValidation,
message: `请选择${question.name}`,
}),
]) }),
React.createElement(Space, { gap: 0, head: 8, tail: 12 },
React.createElement(Form.Item, { shouldUpdate: true }, ({ getFieldValue, setFieldValue }) => {
// 格式化字符串为Date
let value = getFieldValue(wholeNamePath);
if (value) {
value = new Date(+dayjs(value));
}
return (React.createElement(Field.Date, { title: React.createElement(Title$1, { required: question.required, text: question.name }), divider: false, mode: "Y-h", onChange: val => {
// 格式化Date为字符串
const finalVal = val
? dayjs(val).format('YYYY-MM-DD HH')
: null;
setFieldValue(wholeNamePath, finalVal);
}, value: value, clearable: true, innerStyle: {
marginHorizontal: 0,
paddingHorizontal: 0,
alignItems: 'center',
}, placeholder: "\u8BF7\u9009\u62E9", ...restProps }));
}),
React.createElement(Space, { gap: 12 },
!!question.remarks && React.createElement(Tips$1, { text: question.remarks }),
question.isRemark && (React.createElement(FileRemarkFormItem$1, { form: form, question: question, namePrefix: namePrefix, name: name, uploadProps: uploadProps }))))));
};
var DateFormItem$1 = DateFormItem;
const FileFormItem = ({ form, question, name, uploadProps }) => {
return (React.createElement(Space, { gap: 8, head: 16, tail: 12 },
React.createElement(Title$1, { text: question.name, required: question.required }),
!!question.remarks && React.createElement(Tips$1, { text: question.remarks }),
React.createElement(Form.Item, { name: [...name, 'checkResult', fieldKeyMap[question.type]], rules: [
...maybeRules(question.required, [
() => ({
type: 'array',
required: form.strictValidation,
message: `请为[${question.name}]选择文件`,
}),
]),
() => ({
validator(_, val) {
if (!form.strictValidation)
return Promise.resolve(true);
if (val?.some(item => item.status === 'loading')) {
return Promise.reject(new Error(`${question.name}文件上传中...`));
}
if (val?.some(item => item.status === 'error')) {
return Promise.reject(new Error(`${question.name}文件上传失败`));
}
return Promise.resolve(true);
},
}),
], valuePropName: "list" },
React.createElement(Upload, { cropPickerMediaType: "any", pickerType: [
'cropPicker',
'cropCameraPhoto',
'cropCameraVideo',
'visionCamera',
], maxCount: 30, tipText: "\u56FE\u7247/\u89C6\u9891", ...uploadProps }))));
};
var FileFormItem$1 = FileFormItem;
const NumberFormItem = ({ form, question, namePrefix, name, uploadProps, ...restProps }) => {
return (React.createElement(React.Fragment, null,
React.createElement(Space, { head: 16, gap: 8 },
React.createElement(Title$1, { required: question.required, text: question.name }),
!!question.remarks && React.createElement(Tips$1, { text: question.remarks })),
React.createElement(Space, { head: true, tail: true, gap: 12 },
React.createElement(Form.Item, { name: [...name, 'checkResult', fieldKeyMap[question.type]], rules: maybeRules(question.required, [
() => ({
required: form.strictValidation,
message: `请填写[${question.name}]`,
}),
]) },
React.createElement(NumberInput, { placeholder: "\u8BF7\u586B\u5199", textAlign: "left", limitDecimals: 2, style: { marginVertical: 12 }, bordered: true, ...restProps })),
question.isRemark && (React.createElement(FileRemarkFormItem$1, { form: form, question: question, namePrefix: namePrefix, name: name, uploadProps: uploadProps })))));
};
var NumberFormItem$1 = NumberFormItem;
const Textarea = ({ ...restProps }) => {
return (React.createElement(TextInput, { type: "textarea", bordered: true, placeholder: "\u8BF7\u586B\u5199\u5907\u6CE8\u4FE1\u606F", ...restProps }));
};
var Textarea$1 = Textarea;
const RadioFormItem = ({ form, question, namePrefix, name, uploadProps, ...restProps }) => {
const options = question.options?.map(option => {
return {
label: option?.name,
value: option?.value,
remarkRequired: option?.remarkRequired,
isRemark: option?.isRemark,
remarks: option?.remarks,
};
}) || [];
return (React.createElement(Form.Item, { shouldUpdate: true }, ({ getFieldValue }) => {
const namePath = [...name, 'checkResult', fieldKeyMap[question.type]];
const selectedValue = getFieldValue([...namePrefix, ...namePath]);
const selectedOption = options.find(item => item.value === selectedValue);
return (React.createElement(Space, { gap: 0, head: 8, tail: 12 },
React.createElement(Form.Item, { name: namePath, rules: maybeRules(question.required, [
() => ({
required: form.strictValidation,
message: `请选择[${question.name}]`,
}),
]) },
React.createElement(Field.Selector, { options: options.map(option => ({
...option,
render() {
return React.createElement(Option$1, { option: option });
},
})), title: React.createElement(Title$1, { required: question.required, text: question.name }), innerStyle: {
marginHorizontal: 0,
paddingHorizontal: 0,
alignItems: 'center',
}, divider: false, clearable: true, placeholder: "\u8BF7\u9009\u62E9", ...restProps })),
React.createElement(Space, { gap: 12 },
!!question.remarks && React.createElement(Tips$1, { text: question.remarks }),
selectedOption?.isRemark && (React.createElement(Form.Item, { name: [...name, 'remark'], rules: [
...maybeRules(selectedOption.remarkRequired, [
() => ({
required: form.strictValidation,
message: `请输入[${question.name}]备注`,
}),
]),
] },
React.createElement(Textarea$1, null))),
question.isRemark && (React.createElement(FileRemarkFormItem$1, { form: form, question: question, namePrefix: namePrefix, name: name, uploadProps: uploadProps })))));
}));
};
var RadioFormItem$1 = RadioFormItem;
const TextFormItem = ({ form, question, namePrefix, name, uploadProps, ...restProps }) => {
return (React.createElement(React.Fragment, null,
React.createElement(Space, { head: 16, gap: 8 },
React.createElement(Title$1, { required: question.required, text: question.name }),
!!question.remarks && React.createElement(Tips$1, { text: question.remarks })),
React.createElement(Space, { gap: 12, head: true, tail: true },
React.createElement(Form.Item, { name: [...name, 'checkResult', fieldKeyMap[question.type]], rules: maybeRules(question.required, [
() => ({
required: form.strictValidation,
message: `请填写[${question.name}]`,
}),
]) },
React.createElement(TextInput, { type: "textarea", placeholder: "\u8BF7\u586B\u5199", textAlign: "left", bordered: true, ...restProps })),
question.isRemark && (React.createElement(FileRemarkFormItem$1, { form: form, question: question, namePrefix: namePrefix, name: name, uploadProps: uploadProps })))));
};
var TextFormItem$1 = TextFormItem;
const useSopForm = () => {
const [_form] = Form.useForm();
// strictValidation为false时，部分校验规则会被关闭
const form = useMemo(() => {
return { ..._form, strictValidation: true };
}, [_form]);
return form;
};
/** SOP业务表单组件 */
const SopForm = ({ uuid, backUpload = true, loading, form, title, data, wrapper, uploadProps = {}, }) => {
useEffect(() => {
form.setFieldsValue({
sopList: data2formValues(data),
});
}, [data, form]);
return (React.createElement(Form, { form: form, initialValues: {
sopList: data,
} },
React.createElement(Form.List, { name: "sopList" }, templateFields => {
if (loading) {
return (React.createElement(React.Fragment, null,
React.createElement(Card, { loading: true }),
React.createElement(Form.Item, { name: ['__validator__'], rules: [
{
required: true,
message: '表单数据加载中...',
},
] })));
}
return templateFields.map(templateField => {
const templateData = form.getFieldValue([
'sopList',
templateField.name,
]);
const templateContentJSX = (React.createElement(Form.List, { name: [templateField.name, 'sopCheckItems'] }, questionFields => {
return questionFields.map((questionField, index) => {
const namePrefix = [
'sopList',
templateField.name,
'sopCheckItems',
];
const questionData = form.getFieldValue([
...namePrefix,
questionField.name,
]);
const isNotLastAnswer = index !== questionFields.length - 1;
const commonProps = {
form,
question: questionData,
namePrefix: namePrefix,
name: [questionField.name, 'sopResult'],
uploadProps: {
groupUuid: uuid,
uuid: `${uuid}_${questionData.sopDetailId}`,
backUpload,
...uploadProps,
},
};
const control = (() => {
switch (questionData.type) {
case "CHECKBOX_TYPE" /* SopCheckItemEnum.CheckboxType */:
return React.createElement(CheckboxFormItem$1, { ...commonProps });
case "DATE_TYPE" /* SopCheckItemEnum.DateType */:
return React.createElement(DateFormItem$1, { ...commonProps });
case "FILE_TYPE" /* SopCheckItemEnum.FileType */:
return React.createElement(FileFormItem$1, { ...commonProps });
case "RADIO_TYPE" /* SopCheckItemEnum.RadioType */:
return React.createElement(RadioFormItem$1, { ...commonProps });
case "TEXT_TYPE" /* SopCheckItemEnum.TextType */:
if (questionData.inputTextRule ===
"ONLY_NUMBER" /* InputTextRule.OnlyNumber */) {
return React.createElement(NumberFormItem$1, { ...commonProps });
}
return React.createElement(TextFormItem$1, { ...commonProps });
case "UNKNOWN" /* SopCheckItemEnum.Unknown */:
case "UNRECOGNIZED" /* SopCheckItemEnum.Unrecognized */:
case "UNSPECIFIED" /* SopCheckItemEnum.Unspecified */:
break;
default: {
const exhaustiveCheck = questionData.type;
// eslint-disable-next-line no-console
console.warn(`SopForm: unknown type of ${exhaustiveCheck}`);
}
}
return null;
})();
return (React.createElement(Fragment, { key: questionField.key },
control,
isNotLastAnswer && React.createElement(Divider, null)));
});
}));
if (wrapper) {
return wrapper(templateData, templateContentJSX);
}
return (React.createElement(Collapse, { key: templateData.sopId, bodyPadding: false, defaultCollapse: true, title: typeof title === 'function' ? title(templateData) : title, lazyRender: false, titleTextStyle: { fontWeight: 'bold', fontSize: 18 } },
React.createElement(View, { style: { paddingHorizontal: 12 } }, templateContentJSX)));
});
})));
};
var SopForm$1 = SopForm;
const ContentPreview = ({ name, namePrefix, question, field }) => {
const namePath = [...namePrefix, ...name, 'checkResult', field];
const remarkPath = [...namePrefix, ...name, 'remark'];
const mediaPath = [...namePrefix, ...name, 'fileLink'];
return (React.createElement(Form.Item, { shouldUpdate: true }, ({ getFieldValue }) => {
let result = getFieldValue(namePath);
const remark = getFieldValue(remarkPath);
const media = getFieldValue(mediaPath);
// 单选需要将选项的remarks连接
if (question.type === "RADIO_TYPE" /* SopCheckItemEnum.RadioType */) {
const option = question.options.find(opt => opt.value === result);
result = maybeTips(option?.name, option?.remarks);
}
if (question.type === "CHECKBOX_TYPE" /* SopCheckItemEnum.CheckboxType */) {
result = result
?.map(val => {
const option = question.options.find(opt => opt.value === val);
return maybeTips(option.name, option.remarks);
})
.join('、');
}
const updateTime = question?.sopResult?.createTime;
return (React.createElement(Space, { gap: 4, head: true },
question.type !== "FILE_TYPE" /* SopCheckItemEnum.FileType */ && (React.createElement(View, { style: styles$1.wrap },
React.createElement(Text, { style: styles$1.text }, maybeTips(result || result === 0 ? result : '未填写', remark)))),
question.type === "FILE_TYPE" /* SopCheckItemEnum.FileType */ && !!result && (React.createElement(Upload$1.Preview, { list: result })),
!!media && React.createElement(Upload$1.Preview, { list: media }),
!!updateTime && (React.createElement(Text, { style: { color: '#B9BEC5', fontSize: 14, lineHeight: 22 } }, `更新时间${timestamp2time(updateTime)}`))));
}));
};
const styles$1 = EStyleSheet.create({
wrap: {
flexDirection: 'row',
},
text: {
color: '#11151A',
fontSize: 15,
lineHeight: 21,
},
});
var ContentPreview$1 = ContentPreview;
const TitlePreview = ({ text }) => {
return (React.createElement(View, { style: styles.wrap },
React.createElement(Text, { style: styles.text },
text,
"\uFF1A")));
};
const styles = EStyleSheet.create({
wrap: {
flexDirection: 'row',
},
text: {
color: '#5A6068',
fontSize: 15,
lineHeight: 21,
},
});
var TitlePreview$1 = TitlePreview;
const CheckboxPreview = ({ question, namePrefix, name }) => {
return (React.createElement(React.Fragment, null,
React.createElement(TitlePreview$1, { text: maybeTips(question.name, question.remarks) }),
React.createElement(ContentPreview$1, { question: question, namePrefix: namePrefix, name: name, field: fieldKeyMap[question.type] })));
};
var CheckboxPreview$1 = CheckboxPreview;
const DatePreview = ({ question, namePrefix, name }) => {
return (React.createElement(React.Fragment, null,
React.createElement(TitlePreview$1, { text: maybeTips(question.name, question.remarks) }),
React.createElement(ContentPreview$1, { question: question, namePrefix: namePrefix, name: name, field: fieldKeyMap[question.type] })));
};
var DatePreview$1 = DatePreview;
const FilePreview = ({ question, namePrefix, name }) => {
return (React.createElement(React.Fragment, null,
React.createElement(TitlePreview$1, { text: maybeTips(question.name, question.remarks) }),
React.createElement(ContentPreview$1, { question: question, namePrefix: namePrefix, name: name, field: fieldKeyMap[question.type] })));
};
var FileFormPreview = FilePreview;
const NumberPreview = ({ question, namePrefix, name }) => {
return (React.createElement(React.Fragment, null,
React.createElement(TitlePreview$1, { text: maybeTips(question.name, question.remarks) }),
React.createElement(ContentPreview$1, { question: question, namePrefix: namePrefix, name: name, field: fieldKeyMap[question.type] })));
};
var NumberPreview$1 = NumberPreview;
const RadioPreview = ({ question, namePrefix, name }) => {
return (React.createElement(React.Fragment, null,
React.createElement(TitlePreview$1, { text: maybeTips(question.name, question.remarks) }),
React.createElement(ContentPreview$1, { question: question, namePrefix: namePrefix, name: name, field: fieldKeyMap[question.type] })));
};
var RadioPreview$1 = RadioPreview;
const TextPreview = ({ question, namePrefix, name }) => {
return (React.createElement(React.Fragment, null,
React.createElement(TitlePreview$1, { text: maybeTips(question.name, question.remarks) }),
React.createElement(ContentPreview$1, { question: question, namePrefix: namePrefix, name: name, field: fieldKeyMap[question.type] })));
};
var TextPreview$1 = TextPreview;
/** SOP业务预览组件 */
const SopPreview = ({ loading, title, data, wrapper }) => {
const [form] = Form.useForm();
useEffect(() => {
form.setFieldValue('sopList', data2formValues(data, false));
}, [data, form]);
return (React.createElement(Form, { form: form, initialValues: {
sopList: data,
} },
React.createElement(Form.List, { name: "sopList" }, templateFields => {
if (loading) {
return React.createElement(Card, { loading: true });
}
return templateFields.map(templateField => {
const templateData = form.getFieldValue([
'sopList',
templateField.name,
]);
const templateContentJSX = (React.createElement(Form.List, { name: [templateField.name, 'sopCheckItems'] }, questionFields => {
return (React.createElement(Space, { gap: 24 }, questionFields.map(questionField => {
const namePrefix = [
'sopList',
templateField.name,
'sopCheckItems',
];
const questionData = form.getFieldValue([
...namePrefix,
questionField.name,
]);
const commonProps = {
question: questionData,
namePrefix: namePrefix,
name: [questionField.name, 'sopResult'],
};
const control = (() => {
switch (questionData.type) {
case "CHECKBOX_TYPE" /* SopCheckItemEnum.CheckboxType */:
return React.createElement(CheckboxPreview$1, { ...commonProps });
case "DATE_TYPE" /* SopCheckItemEnum.DateType */:
return React.createElement(DatePreview$1, { ...commonProps });
case "FILE_TYPE" /* SopCheckItemEnum.FileType */:
return React.createElement(FileFormPreview, { ...commonProps });
case "RADIO_TYPE" /* SopCheckItemEnum.RadioType */:
return React.createElement(RadioPreview$1, { ...commonProps });
case "TEXT_TYPE" /* SopCheckItemEnum.TextType */:
if (questionData.inputTextRule ===
"ONLY_NUMBER" /* InputTextRule.OnlyNumber */) {
return React.createElement(NumberPreview$1, { ...commonProps });
}
return React.createElement(TextPreview$1, { ...commonProps });
case "UNKNOWN" /* SopCheckItemEnum.Unknown */:
case "UNRECOGNIZED" /* SopCheckItemEnum.Unrecognized */:
case "UNSPECIFIED" /* SopCheckItemEnum.Unspecified */:
break;
default: {
const exhaustiveCheck = questionData.type;
// eslint-disable-next-line no-console
console.warn(`SopForm: unknown type of ${exhaustiveCheck}`);
}
}
return null;
})();
return control;
})));
}));
if (wrapper) {
return wrapper(templateData, templateContentJSX);
}
return (React.createElement(Collapse, { key: templateData.sopId, bodyPadding: false, title: typeof title === 'function' ? title(templateData) : title, defaultCollapse: true, titleTextStyle: { fontWeight: 'bold', fontSize: 18 } },
React.createElement(View, { style: { paddingHorizontal: 12, paddingVertical: 16 } }, templateContentJSX)));
});
})));
};
var SopPreview$1 = SopPreview;
export { SopForm$1 as SopForm, SopPreview$1 as SopPreview, fieldDefaultValueMap, fieldKeyMap, useSopForm };