admin2 1.0.0

package/src/pages/manage/fieldsManage/field/index.js

@@ -0,0 +1,66 @@
+/**
+ * 字段库
+ * tangjian
+ */
+
+import { useCallback } from 'react';
+import { history, connect } from 'umi';
+
+import { ROUTE_PATH } from '@/configure';
+import { Storage } from '@/utils/utils';
+import { AUTH_FUNCTION } from '@/contants';
+import { getAuthFunction } from '@/utils/AuthorityManage';
+
+import { fieldSetcolumns, URL_LIST } from '../constants';
+import FieldsManage from '../components/FieldsManage';
+
+
+const defaultParameter = {
+    count: 20,
+    offset: 0,
+    organization: '',
+};
+
+const FieldSet = props => {
+    const {route} = props;
+
+    const isShow = getAuthFunction(AUTH_FUNCTION.CREATE);
+    // 新增字段
+    const addHandle = useCallback(organization => {
+        Storage.remove('sm_saas_field_record');
+        history.push(__ASSETS_PREFIX__ + `${ROUTE_PATH.MANAGE_FIELED_ADD}`
+                    + '?type=ADD'
+                    + `&url=${ROUTE_PATH.MANAGE_FIELED}`
+                    + `&organization=${organization}`
+        );
+    }, []);
+    // 修改字段
+    const updateHandle = useCallback((record, organization) => {
+        Storage.set('sm_saas_field_record', record);
+        history.push(__ASSETS_PREFIX__ + `${ROUTE_PATH.MANAGE_FIELED_ADD}`
+                    + '?type=UPDATE'
+                    + `&url=${ROUTE_PATH.MANAGE_FIELED}&organization=${organization}`
+        );
+    }, []);
+
+
+    return (
+        <FieldsManage
+            columns={fieldSetcolumns}
+            urlList={{list: URL_LIST.FIELD_LIST}}
+            defaultParameter={defaultParameter}
+            noteInfo={'根据您的需要添加字段，添加后可在相应产品页面配置该字段是否被应用。'}
+            btnText="新增字段"
+            isShow={isShow}
+            method={{
+                addHandle,
+                updateHandle,
+            }}
+            {...props}
+        />
+    );
+};
+
+export default connect(({ user }) => ({
+    currentUser: user.currentUser,
+}))(FieldSet);

package/src/pages/manage/fieldsManage/field/index.less

@@ -0,0 +1,9 @@
+.count {
+    height: 100%;
+    background: #fff;
+    padding: 20px;
+
+    .button {
+        margin: 10px 0  20px 0;
+    };
+}

package/src/pages/manage/fieldsManage/fieldSet/add/index.js

@@ -0,0 +1,350 @@
+/* eslint-disable react-hooks/rules-of-hooks */
+/**
+ * 显示设置 新增、修改
+ * tangjian
+ */
+
+import { useState, useCallback, useEffect, useRef } from 'react';
+import { Breadcrumb, Button, message, Spin } from 'antd';
+import { history, connect } from 'umi';
+import _ from 'lodash';
+import { SMForm, SMModal } from 'sm-antd';
+import { Prompt } from 'react-router-dom';
+
+import {OPERATION_TYPE, RENDER_TYPE, MODEL_TYPE, FIELD_SOURCE_TYPE, SERVICEID_LIST} from '@/contants';
+import SMIcon from '@/components/SMIcon';
+import SMNoteTip from '@/components/SMNoteTip';
+import FieldMessageModal from '@/components/FieldMessageModal';
+import {Storage, formatBoolean} from '@/utils/utils';
+
+import {
+    displayFromData,
+    FIELD_MESSAGE_TITLE,
+    FIELD_SET_PAGE_LIST,
+    FIELD_SET_PRODUCT_LIST,
+} from '../../constants';
+import { PageTemplate, TableTitle } from '../../components';
+import styles from './index.less';
+
+const { ModalType } = SMModal;
+const pageCategory = 'history_detail';
+const pageType = {OUTPUT: 'output', INPUT: 'input'};
+const defaultParametrt = {pageCategory, serviceId: 'POST_TEXT', fieldSet: {input: [], output: []}};
+const PAGE_CATEGORY = 'pageCategory';
+
+const fieldSetAdd = props => {
+    const {location, dispatch} = props;
+    const {url, type, organization} = location.query;
+    const pageList = Storage.get(FIELD_SET_PAGE_LIST);
+    const productList = Storage.get(FIELD_SET_PRODUCT_LIST);
+    const formRef = useRef(null);
+
+    const [parameter, setParameter] = useState(defaultParametrt);
+    const [outputData, setOutPutData] = useState([]);
+    const [inputData, setInputData] = useState([]);
+    const [columns, setColumns] = useState(pageList[0]?.attribute);
+    const [id, setId] = useState(0);
+    const [loading, setLoading] = useState(false);
+    const [isPrompt, setIsPrompt] = useState(false);
+    const [paramsService, setParamsService] = useState({pageCategory, serviceId: 'POST_TEXT'});
+    const [initFieldSet, setInitFieldSet] = useState([]);
+
+    // 修改初始化数据
+    const getInitiaValues = useCallback(() => {
+        let initialValues =  defaultParametrt;
+        if (type === OPERATION_TYPE.UPDATE_ID) {
+            initialValues = Storage.get('sm_saas_field_set_record') || {};
+        }
+        return initialValues;
+    }, [type]);
+    // 提交数据发生改变
+    const onChange = useCallback((key, value, type) => {
+        let newValue = value;
+        const newParameter = _.cloneDeep(parameter);
+        if (type === RENDER_TYPE.TEXT) {
+            newValue = value.target.value;
+        }
+        if (['serviceId', 'pageCategory'].includes(key)) {
+            const parames = _.cloneDeep(paramsService);
+            parames[key] = value;
+            setParamsService(parames);
+        }
+        if (key === PAGE_CATEGORY) {
+            const activityPage = pageList.filter(item => item.category === value);
+            setColumns(activityPage[0]?.attribute);
+        }
+        newParameter[key] = newValue;
+        setParameter(newParameter);
+    }, [parameter, paramsService, pageList]);
+    // 离开页面提示
+    const showModal = useCallback(url => {
+        global.modal.show(ModalType.MODAL_ALERT, {
+            width: 576,
+            modalTitle: '提示',
+            confirmText: '继续填写',
+            cancelHandle: async () => {
+                await setIsPrompt(false);
+                history.push(url);
+            },
+            confirmHandle: () => global.modal.pop(),
+            renderChildren: () => {
+                return (
+                    <div className={styles.hint}>
+                        <SMIcon type="icon-shenhe" />
+                        <span className={styles.hint_text}>您填写新增页面相关信息尚未提交，是否继续填写？</span>
+                    </div>
+                );
+            },
+        });
+    }, []);
+    // 提交字段信息
+    const showField = useCallback((fieldData, type) => {
+        const oldData = type === 'INPUT' ? inputData : outputData;
+        const newData = [];
+        _.forEach(fieldData, item => {
+            item.uuid = item.uuid;
+            item.name = item.title;
+            item.status = true;
+            item.blacklist = false;
+            item.ignoreWord = false;
+            item.reset = false;
+            item.screen = false;
+            item.sensitiveWord = false;
+            item.show = false;
+            newData.push(item);
+        });
+        const dataSource = newData.map(newItem => {
+            const item = oldData.filter(oldItem => oldItem.uuid === newItem.uuid);
+
+            return (item.length && item[0]) || newItem;
+        });
+        global.modal.pop();
+        type === 'INPUT' ? setInputData(dataSource) : setOutPutData(dataSource);
+    }, [inputData, outputData]);
+    // 添加信息字段
+    const detailField = useCallback((type, data) => {
+        global.modal.show(ModalType.MODAL_ALERT, {
+            width: 676,
+            modalTitle: FIELD_MESSAGE_TITLE[type],
+            renderChildren: () => {
+                return (
+                    <div className={styles.hint}>
+                        <FieldMessageModal
+                            {...props}
+                            type={type}
+                            organization={organization}
+                            dataSource={data}
+                            source={FIELD_SOURCE_TYPE.DISPLAY_SET}
+                            handleSubmit={data => showField(data, type)}
+                        />
+                    </div>
+                );
+            },
+        });
+    }, [organization, props, showField]);
+        // 格式化table中name字段 name + fieldTag的显示方式
+    const formatTableList = useCallback(list => {
+        return list.map(item => {
+            item.name = item.fieldTag ? `${item.name}(${item.fieldTag})` : item.name;
+            item.key = item.fieldTag;
+            item.title = item.name;
+            return item;
+        });
+    }, []);
+
+    // 格式化参数
+    const formatParame = useCallback(data => {
+        const newData = _.cloneDeep(data);
+        const mergeData = inputData.concat(outputData);
+        const fieldSet = mergeData.map(item => {
+            const newItem = {};
+            _.forEach(item, (value, key) => {
+                newItem[key] = formatBoolean(value);
+            });
+
+            return newItem;
+        });
+        newData.organization = organization;
+        newData.fieldSet = fieldSet;
+        if (type === OPERATION_TYPE.UPDATE_ID) {
+            newData.id = id;
+        }
+
+        return newData;
+    }, [inputData, organization, outputData, id, type, formatBoolean]);
+    const queryFieldSet = useCallback(async () => {
+        const result = await dispatch({
+            type: 'manage/queryFieldSet',
+            payload: {
+                pageCategory: paramsService.pageCategory,
+                serviceId: paramsService.serviceId,
+                organization,
+            },
+        }) || [];
+        setInitFieldSet(result);
+        _.cloneDeep(result).forEach(item => {
+            if (item.name === 'input') {
+                setInputData(formatTableList(item.value));
+            }
+            else if (item.name === 'output') {
+                setOutPutData(formatTableList(item.value));
+            }
+        });
+    }, [paramsService, organization, formatTableList]);
+    // 提交
+    const handleSubmit = useCallback(async val => {
+        setLoading(true);
+        setIsPrompt(false);
+        const result = await dispatch({
+            type: MODEL_TYPE.FIELD_URL_LIST[`FIELD_SET_${type}`],
+            payload: formatParame(val),
+        });
+        if (result) {
+            message.success(`${OPERATION_TYPE[type]}成功 `);
+            await setIsPrompt(false);
+            goback();
+        }
+        setLoading(false);
+    }, [dispatch, formatParame, type, url, isPrompt]);
+    // 点击表单提交
+    const handleClick = useCallback(() => {
+        try {
+            // 为了获取from表单必填提示;
+            const $btn = document.getElementsByClassName('sm_from')[0].getElementsByTagName('button')[0];
+            $btn.click();// 表单提交
+        } catch (error) {
+            handleSubmit();
+        }
+    }, [handleSubmit]);
+
+    const goback = useCallback(async () => {
+        history.push(url);
+    }, [url]);
+
+    useEffect(() => {
+        try {
+            if (type === OPERATION_TYPE.UPDATE_ID) {
+                const data =  getInitiaValues();
+                let input;
+                let output;
+                data.fieldSet.forEach(item => {
+                    switch (item.name) {
+                        case pageType.INPUT:
+                            input = formatTableList(item.value);
+                            break;
+                        case pageType.OUTPUT:
+                            output = formatTableList(item.value);
+                            break;
+                    }
+                });
+                const column = pageList.filter(item => item.category === data.pageCategory)[0]?.attribute;
+                setId(data.id);
+                setInputData(input);
+                setOutPutData(output);
+                setParameter(data);
+                setColumns(column);
+            }
+        } catch (error) {}
+    }, [getInitiaValues, formatTableList, type]);
+
+    useEffect(() => {
+        if (type === 'ADD') {
+            queryFieldSet();
+        }
+    }, [paramsService]);
+
+    useEffect(() => {
+        let initialValues = {};
+        const fieldSet = inputData.concat(outputData);
+        if (type === OPERATION_TYPE.ADD_ID) {
+            initialValues.pageCategory = pageCategory;
+            initialValues.serviceId = 'POST_TEXT';
+            initialValues.fieldSet = initFieldSet;
+        }
+        else {
+            initialValues = getInitiaValues();
+        }
+        const newFieldData = [];
+        if (formRef.current) {
+            const submitValue = formRef.current.getFieldValue();
+            if (_.isArray(initialValues.fieldSet)) {
+                initialValues.fieldSet.forEach(item => {
+                    item.value.forEach(initItem => {
+                        newFieldData.push(initItem);
+                    });
+                });
+            }
+            initialValues.fieldSet = newFieldData;
+            submitValue.fieldSet = fieldSet;
+            setIsPrompt(!_.isEqual(initialValues, submitValue));
+        }
+    }, [inputData, outputData, parameter, type, initFieldSet, getInitiaValues]);
+
+    return (
+        <div className={styles.count}>
+            <Spin spinning={loading}>
+                <Breadcrumb separator=">">
+                    <Breadcrumb.Item>
+                        <a href="#" onClick={goback}>显示设置</a>
+                    </Breadcrumb.Item>
+                    <Breadcrumb.Item>{OPERATION_TYPE[type]}页面</Breadcrumb.Item>
+                </Breadcrumb>
+                <div className={styles.field_attribute}>
+                    <SMNoteTip noteInfo="页面属性设置" />
+                    <div className={`sm_from ${styles.sm_from}`}>
+                        <SMForm
+                            formData={displayFromData(onChange, pageList, productList, type)}
+                            initialValues={getInitiaValues()}
+                            isShowSubmitBtn
+                            setForm={ref => formRef.current = ref}
+                            formProps={{
+                                labelCol: {
+                                    xs: { span: 24 },
+                                    sm: { span: 4 },
+                                },
+                            }}
+                            onSubmit={handleSubmit}
+                        />
+                    </div>
+                    <SMNoteTip noteInfo="页面字段设置" />
+                    <div className={styles.table}>
+                        <div className={styles.pageTable}>
+                            <TableTitle title="输入信息字段" handleClick={() => detailField('INPUT', inputData)} />
+                            <PageTemplate
+                                dataSource={inputData}
+                                columns={columns}
+                                sortChange={data => setInputData(data)}
+                            />
+                        </div>
+                        <div className={styles.pageTable}>
+                            <TableTitle title="输出信息字段" handleClick={() => detailField('OUTPUT', outputData)} />
+                            <PageTemplate
+                                dataSource={outputData}
+                                columns={columns}
+                                sortChange={data => setOutPutData(data)}
+                            />
+                        </div>
+                    </div>
+                </div>
+                <div className={styles.bottom_btn}>
+                    <Button type="dashed" onClick={goback}>取消</Button>
+                    <Button type="primary" onClick={handleClick}>确定</Button>
+                </div>
+            </Spin>
+            <Prompt
+                when={isPrompt}
+                message={location => {
+                    if (!isPrompt) {
+                        return true;
+                    }
+                    if (location.pathname !== window.location.pathname) {
+                        showModal(location.pathname);
+                    }
+                    return false;
+                }}
+            />
+        </div>
+    );
+};
+
+export default connect(({user}) => ({currentUser: user.currentUser}))(fieldSetAdd);

package/src/pages/manage/fieldsManage/fieldSet/add/index.less

@@ -0,0 +1,42 @@
+.count {
+    background: #fff;
+    padding: 20px;
+
+    .field_attribute {
+        margin-top: 24px;
+
+        .sm_from {
+            :global {
+                .ant-btn-primary {
+                    display: none;
+                }
+            }
+        }
+    }
+
+    .table {
+        margin-top: 24px;
+
+        .pageTable {
+            width: 100%;
+            margin-bottom: 30px;
+        }
+    }
+
+    .bottom_btn {
+        margin-top: 20px;
+        width: 200px;
+        display: flex;
+        justify-content: space-between;
+    }   
+}
+
+.hint {
+    text-align: center;
+    padding: 10px 0 30px 0;
+
+    .hint_text {
+        margin-left: 10px
+        
+    };
+}

package/src/pages/manage/fieldsManage/fieldSet/index.js

@@ -0,0 +1,187 @@
+/* eslint-disable max-len */
+/**
+ * 显示设置
+ * tangjian
+ */
+
+import { useState, useCallback, useEffect } from 'react';
+import { message } from 'antd';
+import { history, connect } from 'umi';
+import moment from 'moment';
+import { SMModal, SMForm } from 'sm-antd';
+import _ from 'lodash';
+
+import { ROUTE_PATH } from '@/configure';
+import { AUTH_FUNCTION, OPERATION_TYPE, SERVICEID_LIST } from '@/contants';
+import { Storage } from '@/utils/utils';
+import { getAuthFunction } from '@/utils/AuthorityManage';
+
+import {
+    copyPageFormData,
+    displayColumns,
+    URL_LIST,
+    FIELD_SET_PAGE_LIST,
+    FIELD_SET_PRODUCT_LIST,
+} from '../constants';
+import FieldsManage from '../components/FieldsManage';
+
+
+const { ModalType } = SMModal;
+
+const defaultParameter = {
+    count: 20,
+    offset: 0,
+    organization: '',
+};
+// 天净-音频文件、音频流片段
+const CUSTOM_PRODUCT = [
+    {
+        name: '音频文件片段',
+        value: SERVICEID_LIST.POST_AUDIOCLIPS,
+    },
+    {
+        name: '音频流片段',
+        value: SERVICEID_LIST.POST_AUDIOSTREAMCLIPS,
+    },
+    {
+        name: '音频文件（英语）片段',
+        value: SERVICEID_LIST.POST_AUDIOCLIPS_EN,
+    },
+    {
+        name: '音频文件（阿语）片段',
+        value: SERVICEID_LIST.POST_AUDIOCLIPS_AR,
+    },
+    {
+        name: '音频流（英语）片段',
+        value: SERVICEID_LIST.POST_AUDIOSTREAMCLIPS_EN,
+    },
+    {
+        name: '音频流（阿语）片段',
+        value: SERVICEID_LIST.POST_AUDIOSTREAMCLIPS_AR,
+    },
+    {
+        name: '音频文件（B 类外语）片段',
+        value: SERVICEID_LIST.POST_AUDIOCLIPS_B,
+    },
+    {
+        name: '音频流（B 类外语）片段',
+        value: SERVICEID_LIST.POST_AUDIOSTREAMCLIPS_B,
+    },
+];
+
+const FieldSet = props => {
+    const { organization }  = props.currentUser.orgInfo;
+    const isShow = getAuthFunction(AUTH_FUNCTION.CREATE);
+
+    const [refresh, setRefresh] = useState(moment().format('x'));
+    const [pageList, setPageList] = useState([]);
+    const [productList, setProductList] = useState([]);
+
+    // 新增字段
+    const addHandle = useCallback(organization => {
+        history.push(__ASSETS_PREFIX__ + `${ROUTE_PATH.MANAGE_FIELEDSET_ADD}?type=${OPERATION_TYPE.ADD_ID}&url=${ROUTE_PATH.MANAGE_FIELEDSET}&organization=${organization}`);
+        Storage.remove('sm_saas_field_set_record');
+    }, []);
+    // 修改字段
+    const updateHandle = useCallback((record, organization) => {
+        history.push(__ASSETS_PREFIX__ + `${ROUTE_PATH.MANAGE_FIELEDSET_ADD}?type=${OPERATION_TYPE.UPDATE_ID}&url=${ROUTE_PATH.MANAGE_FIELEDSET}&organization=${organization}`);
+        Storage.set('sm_saas_field_set_record', record);
+    }, []);
+    //  获取页面列表
+    const getPageList = useCallback(async () => {
+        if (props.dispatch) {
+            const result = await props.dispatch({
+                type: URL_LIST.FIELD_SET_PAGE_LIST,
+            });
+            if (result) {
+                setPageList(result);
+                Storage.set(FIELD_SET_PAGE_LIST, result);
+            }
+        }
+    }, []);
+    // 获取产品列表
+    const getProductList = useCallback(async () => {
+        if (props.dispatch) {
+            const result = await props.dispatch({
+                type: URL_LIST.FIELD_PRODUCT_LIST,
+            });
+            if (result && result.length) {
+                let list = [];
+                result.forEach(item => {
+                    list.push({
+                        name: item.name,
+                        value: item.serviceId,
+                    });
+                });
+                list = [...list, ...CUSTOM_PRODUCT];
+                Storage.set(FIELD_SET_PRODUCT_LIST, list);
+                setProductList(list);
+            }
+        }
+    }, []);
+    //  复制提交
+    const copySubmit =  useCallback(async (val, record, organization) => {
+        if (props.dispatch) {
+            const result =  await props.dispatch({
+                type: URL_LIST.DISPLAY_COPY,
+                payload: {...val, id: record.id, organization},
+            });
+
+            if (result) {
+                message.success('复制成功');
+                global.modal.pop();
+                setRefresh(moment().format('x'));
+            }
+        }
+    }, []);
+    // 复制
+    const copyHandel = useCallback((record, organization) => {
+        global.modal.show(ModalType.MODAL_ALERT, {
+            width: 576,
+            modalTitle: '复制页面',
+            confirmText: '提交',
+            renderChildren: () => {
+                return (
+                    <div>
+                        <SMForm
+                            formData={copyPageFormData(pageList, productList)}
+                            isShowSubmitBtn
+                            submitText="提交"
+                            isSubmit={false}
+                            onCancel={() => global.modal.pop()}
+                            onSubmit={val => copySubmit(val, record, organization)}
+                        />
+                    </div>
+                );
+            },
+        });
+    }, [copySubmit, pageList, productList]);
+
+    useEffect(() => {
+        getPageList();
+        getProductList();
+    }, [getPageList, getProductList]);
+
+    return (
+        <FieldsManage
+            columns={displayColumns}
+            urlList={{list: URL_LIST.FIELD_SET_LIST}}
+            defaultParameter={defaultParameter}
+            isShow={isShow}
+            noteInfo={'配置和管理不同产品涉及的字段，设置的默认页面在开通产品相应服务时自动被应用。'}
+            btnText="新增页面"
+            refresh={refresh}
+            CUSTOM_PRODUCT={CUSTOM_PRODUCT}
+            method={{
+                addHandle,
+                updateHandle,
+                copyHandel,
+            }}
+            {...props}
+        />
+    );
+};
+
+export default connect(({ user }) => ({
+    currentUser: user.currentUser,
+}))(FieldSet);