admin2 1.0.0

package/src/pages/pageComponents/mdPage/listContent/CommonType/index.jsx

@@ -0,0 +1,1584 @@
+/* eslint-disable max-len */
+/* eslint-disable react/no-children-prop */
+/**
+ * 天净-敏感词名单服务-全局敏感词名单
+ * 名单内容页面
+ */
+
+import React, { Component } from 'react';
+import { connect, Link, history } from 'umi';
+import lodash, { add, get } from 'lodash';
+import { SMTable, SMModal } from 'sm-antd';
+import {
+    Tooltip,
+    message,
+    Modal,
+    Space,
+    Button,
+    Spin,
+    Breadcrumb,
+    Popover,
+    Input,
+} from 'antd';
+
+import { getAuthFunction } from '@/utils/AuthorityManage';
+import {AUTH_FUNCTION, ACCOUNT_ROLE, SM_ACCOUNT, tableText, LOCALE_TYPE} from '@/contants';
+import {
+    formatSearchParams,
+    getUrlParams,
+    exportFile,
+    formatContents,
+    arryRepetition,
+    Storage,
+    formatCustomContents,
+    isPrivate,
+} from '@/utils/utils';
+import GlobalFilterListener from '@/components/GlobalFilterListener';
+import SMIcon from '@/components/SMIcon';
+import SMNoteTip from '@/components/SMNoteTip';
+import SMLabelSearch from '@/components/SMLabelSearch';
+import SMSelect from '@/components/SMSelect';
+import SMAdminForm from '@/pages/pageComponents/mdPage/components/SMAdminForm';
+import TotalCount from '@/components/TotalCount';
+import SensitiveWordSpin from '@/components/SensitiveWordSpin';
+import { LIST_CONTENT_URL, EXPORT_TOOLTIP, EXPORT_MD_TOOLTIP } from '@/contants/exportUrl';
+import { PAGE_SIZE } from '@/contants/pageSize';
+import withIntlComponents from '@/hoc/withIntlComponents';
+import {getIntlTableColums} from '@/utils/helpers';
+import {experimentChecklist} from '@/services/mingdan';
+
+import MdContentImportModal from '../../components/MdContentImportModal';
+import SensitivewordHintModal from '../../components/SensitivewordHintModal/index';
+import MdContentModal from '../../components/MdContentModal';
+import SMPopConfirm from '../../components/SMPopConfirm';
+import {
+    ASR_OCR,
+    getVideoStreamState,
+    GLOBAL,
+    LIST_CONTENT_TYPE,
+} from '../../list/CommonType/contants';
+import {getRealProduct, NEXUS_PRODUCT_MAP} from '../../constants';
+
+import styles from './index.less';
+import tipImg from './img/tip.png';
+
+
+const { ModalType } = SMModal;
+
+const { confirm } = Modal;
+class ListContent extends Component {
+    constructor(props) {
+        super(props);
+        this.state = {
+            tableDataSource: [],
+            listTotalCount: 0, // 列表总数
+            currentPage: 1, // 当前列表页码
+            pageSize: 20, // 当前列表分页
+            pageSizeOptions: PAGE_SIZE,
+            queryParams: {}, // 列表搜索参数
+            noteInfo: '根据您的需求，添加符合要求的名单内容',
+            isSMShow: false,
+            listId: '',
+            listName: '',
+            checkItems: '[]',
+            operation: '',
+            product: '',
+            isCustom: false,
+            isSensitive: false,
+            exportLoading: false, // 导出按钮loading状态
+            selectedContents: [], // 当前选中的名单内容
+            contentModalVisible: false,
+            contentModalType: 'add',
+            importModalVisible: false,
+            importModalType: 'add',
+            contentMoveModalVisible: false,
+            contentModalDefaultValue: {},
+            moveConfirmVisible: false,
+            moveFormVisible: false,
+            moveFormType: 'delete',
+            moreDelete: [],
+            listType: 4, // 当前名单列表类型
+            mdDataList: [], // 名单列表，用于移动
+            currentMdListId: null, // 当前选择的名单, 移动用
+            remark: '', // 备注信息
+            sensitiveWordSpin: false,
+            fileUrl: [],
+            isVideoStreamEngOrAlb: getVideoStreamState(location.pathname),
+            authConfig: {
+                // 账号角色权限
+                canCreate: false,
+                canDelete: false,
+                canMove: false,
+                canEdit: false,
+                canExport: false,
+                canBatchCreate: false,
+                canBatchDelete: false,
+            },
+            pageRoute: {
+                name: '',
+                path: '',
+            },
+            currentGlobalFilter: {
+                organization: '',
+                appId: '',
+                clusterId: '',
+            },
+            defaultLabelSearchData: {
+                placeholder: '搜索名单内容',
+                addonBefore: false,
+                optionData: [
+                    {
+                        value: 'content',
+                        name: '名单内容',
+                    },
+                ],
+            },
+        };
+    }
+
+    UNSAFE_componentWillMount() {
+        const { stateConfig } = this.props;
+        const { listId = '', listName = '', checkItems = '[]', operation = '', isSensitive, isCustom, action } = getUrlParams(
+            location.href
+        );
+        if (stateConfig) {
+            this.setState({
+                listId,
+                listName,
+                checkItems,
+                operation,
+                isSensitive,
+                isCustom,
+                action,
+                ...stateConfig,
+            });
+        } else {
+            this.setState({
+                listId,
+                listName,
+                checkItems,
+                operation,
+                isSensitive,
+                isCustom,
+                action,
+            });
+        }
+    }
+    /**
+     * 列表文本类型 展示
+     * @param {*} text
+     * @param {*} record
+     * @param {*} index
+     */
+    textRender = text => {
+        const toolTipTitle = <span className={styles.tooltip}>{text}</span>;
+        return (
+            <Tooltip title={toolTipTitle} placement="left">
+                <span className={styles.text}>{text}</span>
+            </Tooltip>
+        );
+    };
+
+    /**
+     * 列表时间类型展示
+     * @param {*} text
+     * @param {*} record
+     * @param {*} index
+     */
+    timeRender = text => {
+        const contentText = text.slice(5);
+        const toolTipTitle = <span className={styles.tooltip}>{text}</span>;
+        return (
+            <Tooltip title={toolTipTitle} placement="left">
+                <span className={styles.text}>{contentText}</span>
+            </Tooltip>
+        );
+    };
+
+    /**
+     * 路由跳转
+     * @param {*} text
+     * @param {*} record
+     * @param {*} index
+     */
+    routeJumpRender = text => {
+        const { name, path } = text;
+        return <Link to={path}>{name}</Link>;
+    };
+
+    /**
+     * 操作类型 渲染（编辑，删除）
+     * @param {*} text
+     * @param {*} record
+     * @param {*} index
+     */
+    operationRender = (text, record) => {
+        const { globalSensitive = false, route, subType, isLab } = this.props;
+        const {action} = this.state;
+
+        const { hasEdit = true, hasDelete = true } = text;
+        const { mdContent, remark } = record;
+        const { authConfig, isSMShow, moveFormVisible, type, currentGlobalFilter } = this.state;
+        const { canEdit, canDelete } = authConfig;
+
+        const serviceId = route?.routeData?.serviceId;
+
+        return (
+            <Space size={16}>
+                {hasEdit && canEdit ? (
+                    <SMIcon
+                        type="icon-xiugai"
+                        onClick={() => {
+                            this.showMdContentModal('modify', {
+                                contents: mdContent,
+                                remark,
+                            });
+                        }}
+                    />
+                ) : null}
+                {hasDelete && canDelete ? !isSMShow && currentGlobalFilter.organization === 'GLOBAL' && !globalSensitive
+                    ? (
+                        <div onClick={() => {
+                            this.setState({
+                                moveFormVisible: true,
+                                moveFormType: 'delete',
+                                moreDelete: [mdContent],
+                            });
+                        }}
+                        >
+                            <SMIcon type="icon-shanchuxuanzhong" />
+                        </div>
+                    ) : (
+                        <SMPopConfirm
+                            title="请确认是否删除名单内容"
+                            placeholder="请输入删除名单原因"
+                            hasTextArea
+                            isLab={isLab && action !== 'IGNORE'}
+                            onConfirm={(value, cb, labValue) => {
+                                if (isLab && labValue === '1' && action !== 'IGNORE') {
+                                    this.addMdContent({contents: [mdContent], cb, remark: value, hasEnteredLab: labValue, type: 'delete'});
+                                }
+                                else {
+                                    this.deleteMdContent(
+                                        [mdContent],
+                                        cb,
+                                        value,
+                                        isLab && labValue === '1' && action !== 'IGNORE'
+                                    );
+                                }
+                            }
+                            }
+                            children={<SMIcon type="icon-shanchuxuanzhong" />}
+                        />
+                    )
+                    : null}
+                {!canDelete && !canEdit ? <span>-</span> : null}
+            </Space>
+        );
+    };
+    getProduct = () => {
+        const { route, stateConfig } = this.props;
+
+        const { isVideoStreamEngOrAlb, currentGlobalFilter, product } = this.state;
+        const { isGlobalProduct, isOrganizationProduct } = stateConfig;
+        const { organization } = currentGlobalFilter;
+        const serviceId = route.routeData.serviceId;
+
+        if (product) {
+            return product;
+        }
+
+        // 天枢 NEXUS 服务 product 映射
+        const isTianShu = location.pathname.includes('/new/tianShu');
+        if (isTianShu && NEXUS_PRODUCT_MAP[serviceId]) {
+            return NEXUS_PRODUCT_MAP[serviceId];
+        }
+
+        if (isVideoStreamEngOrAlb || isGlobalProduct || (organization === GLOBAL && isOrganizationProduct)) {
+            return ASR_OCR[route.routeData.serviceId];
+        }
+        return route.routeData.serviceId;
+    };
+
+    getCommonParams = () => {
+        const {route} = this.props;
+        const {subType, channelType} = this.state;
+        const serviceId = route.routeData.serviceId;
+        const isTianShu = location.pathname.includes('/new/tianShu');
+
+        // 天枢 NEXUS 服务只返回 channelType
+        if (isTianShu) {
+            return {
+                channelType,
+            };
+        }
+
+        return {
+            subType,
+            realServiceId: serviceId,
+            realProduct: getRealProduct(subType, serviceId),
+        };
+    };
+
+    getOrganization = () => {
+        const { globalSensitive } = this.props;
+        return globalSensitive ? 'GLOBAL' : this.state.currentGlobalFilter.organization;
+    };
+    /**
+     * 删除名单内容
+     * @param {Array} contents 名单内容数组
+     * @param {Function} cb 回调函数
+     */
+    async deleteMdContent(contents, cb, value, isLab) {
+        const {t} = this.props;
+        if (contents.length === 0) {
+            message.error(t('请选择要删除的名单内容！'));
+            cb && cb();
+            return;
+        }
+        const { dispatch, route } = this.props;
+        const { code, Message } = await dispatch({
+            type: 'mingdan/deleteMdContent',
+            payload: {
+                listId: isLab ? `${this.state.listId}__delete` : this.state.listId,
+                organization: this.getOrganization(),
+                product: this.getProduct(),
+                contents: contents,
+                remarks: value ? [value] : [],
+                ...this.getCommonParams(),
+            },
+        });
+        if (code === 1100) {
+            message.success(t('删除成功，预计5分钟内生效'));
+            cb && cb();
+            if (this.state.tableDataSource.length === contents.length) {
+                this.doSearch(1);
+                return;
+            }
+            this.doSearch();
+        } else {
+            cb && cb();
+            message.error(Message);
+        }
+    }
+
+    /**
+     * 移动名单内容
+     * @param {*} contents 名单内容数组
+     */
+    async moveMdContent(contents) {
+        const {t} = this.props;
+        if (contents.length === 0) {
+            message.error(t('请选择要移动的名单内容！'));
+            return;
+        } else if (!this.state.currentMdListId) {
+            message.error(t('请选择名单'));
+            return;
+        }
+        const { dispatch, route } = this.props;
+        const { code, Message } = await dispatch({
+            type: 'mingdan/batchMove',
+            payload: {
+                listId: this.state.currentMdListId,
+                sourceListId: this.state.listId,
+                organization: this.getOrganization(),
+                product: this.getProduct(),
+                contents: contents,
+                remarks: this.state.remark ? [this.state.remark] : [],
+                ...this.getCommonParams(),
+            },
+        });
+        if (code === 1100) {
+            message.success(t('移动成功，预计5分钟内生效'));
+            this.setState(
+                {
+                    moveConfirmVisible: false,
+                },
+                () => {
+                    this.doSearch();
+                }
+            );
+        } else {
+            message.error(Message);
+        }
+    }
+
+    /**
+     * 展示新增或修改名单内容弹窗
+     * @param {*} type 弹窗类型 新增 || 修改
+     * @param {*} defaultValue 默认值
+     */
+    showMdContentModal(type, defaultValue) {
+        this.setState({
+            contentModalVisible: true,
+            contentModalType: type,
+            contentModalDefaultValue: defaultValue,
+        });
+    }
+    /**
+     * 展示 批量导入或删除名单内容弹窗
+     * @param {*} type
+     */
+    showMdContentImportModal(type) {
+        this.setState({
+            importModalType: type,
+            importModalVisible: true,
+        });
+    }
+
+    /**
+     * 新增名单内容
+     * @param {*} values
+     */
+    async addMdContent(values) {
+        const {dispatch, route, t, isLab} = this.props;
+        const { contents, remark, type, cb } = values;
+        const params = {
+            listId: this.state.listId,
+            organization: this.getOrganization(),
+            product: this.getProduct(),
+            contents: lodash.isArray(contents) ? contents : (contents ? formatCustomContents(contents) : []),
+            remarks: remark ? [remark.trim()] : [],
+            ...this.getCommonParams(),
+        };
+        if (isLab && values.hasEnteredLab === '1') {
+            params.listId = `${params.listId}__${type === 'delete' ? 'delete' : 'add'}`;
+        }
+        const { code, Message } = await dispatch({
+            type: 'mingdan/addMdContent',
+            payload: params,
+        });
+        if (code === 1100) {
+            message.success(t('新增成功，预计5分钟内生效'));
+            this.setState(
+                {
+                    contentModalVisible: false,
+                },
+                () => {
+                    cb && cb();
+                    this.doSearch();
+                }
+            );
+        } else {
+            message.error(t(Message || '操作失败！'));
+        }
+    }
+
+    /**
+     * 更新名单内容
+     * @param {*} newValues 新值
+     * @param {*} oldValues 旧值
+     */
+    async updateMdContent(newValues, oldValues) {
+        const {dispatch, route, t} = this.props;
+        const { contents, remark } = newValues;
+        const oldContent = oldValues.contents;
+        const { code, Message } = await dispatch({
+            type: 'mingdan/updateMdContent',
+            payload: {
+                listId: this.state.listId,
+                organization: this.getOrganization(),
+                product: this.getProduct(),
+                newContent: contents,
+                oldContent: oldContent,
+                remark: remark,
+                ...this.getCommonParams(),
+            },
+        });
+        if (code === 1100) {
+            message.success(t('修改成功，预计5分钟内生效'));
+            this.setState(
+                {
+                    contentModalVisible: false,
+                },
+                () => {
+                    this.doSearch();
+                }
+            );
+        } else {
+            message.error(t(Message || '操作失败！'));
+        }
+    }
+
+    /**
+     * 批量导入/删除 先上传文件
+     * @param {*} fileList
+     * @param {*} type
+     */
+    uploadFile = async (fileList, type, remark, hasEnteredLab) => {
+        const {dispatch, t, route, isLab} = this.props;
+        const serviceId = route?.routeData?.serviceId;
+        const lab_entry = isLab && hasEnteredLab === '1';
+        const formData = new FormData();
+
+        fileList.forEach(file => {
+            formData.append('file', file);
+        });
+        if (type === 'delete') {
+            confirm({
+                title: t('删除名单内容确认'),
+                centered: true,
+                icon: <img src={tipImg} className={styles['icon-tip']} />,
+                content: t('此操作会删除文件内的所有名单内容，请确认是否删除？'),
+                onOk: async () => {
+                    const { code, content } = await dispatch({
+                        type: 'mingdan/uploadFile',
+                        payload: formData,
+                    });
+                    if (code === 1100) {
+                        content.remarks = remark ? [remark] : [];
+                        if (lab_entry) {
+                            this.batchAdd({...content, isLab: lab_entry});
+                        }
+                        else {
+                            this.batchDelete({...content, isLab: lab_entry});
+                        }
+                    } else {
+                        message.error(t('上传失败！'));
+                    }
+                },
+                onCancel: () => {
+                    this.setState({
+                        importModalVisible: false,
+                    });
+                },
+            });
+        } else {
+            const { code, content } = await dispatch({
+                type: 'mingdan/uploadFile',
+                payload: formData,
+            });
+            if (code === 1100) {
+                content.remarks = remark ? [remark] : [];
+                this.batchAdd({...content, isLab: lab_entry});
+            } else {
+                message.error(t('上传失败！'));
+            }
+        }
+    };
+
+    /**
+     * 批量导入文件
+     * @param {*} content
+     */
+    batchAdd = async content => {
+        const {dispatch, route, t} = this.props;
+        const {url, remarks, isLab} = content;
+        const {importModalType} = this.state;
+        const payload = {
+            organization: this.getOrganization(),
+            listId: this.state.listId,
+            product: this.getProduct(),
+            url: url,
+            remarks,
+            ...this.getCommonParams(),
+        };
+        if (isLab) {
+            payload.listId = `${this.state.listId}__${importModalType}`;
+        }
+        const { code, Message } = await dispatch({
+            type: 'mingdan/batchAdd',
+            payload: payload,
+        });
+        if (code === 1100) {
+            message.success(t('批量导入成功，预计5分钟内生效'));
+            this.setState(
+                {
+                    importModalVisible: false,
+                },
+                () => {
+                    this.doSearch();
+                }
+            );
+        } else {
+            message.error(Message);
+        }
+    };
+
+    /**
+     * 批量删除文件
+     * @param {*} content
+     */
+    batchDelete = async content => {
+        const {dispatch, route, t} = this.props;
+        const {url, remarks, isLab} = content;
+        const payload = {
+            organization: this.getOrganization(),
+            listId: this.state.listId,
+            product: this.getProduct(),
+            url: url,
+            remarks,
+            ...this.getCommonParams(),
+        };
+        if (isLab) {
+            payload.listId = `${this.state.listId}__delete`;
+        }
+        const { code, Message } = await dispatch({
+            type: 'mingdan/batchDelete',
+            payload,
+        });
+        if (code === 1100) {
+            message.success(t('批量删除成功，预计5分钟内生效'));
+            this.setState(
+                {
+                    importModalVisible: false,
+                },
+                () => {
+                    this.doSearch();
+                }
+            );
+        } else {
+            message.error(Message);
+        }
+    };
+
+    globalFilterChange = obj => {
+        const {
+
+            currentGlobalFilter,
+        } = obj;
+        this.setState(
+            {
+                currentGlobalFilter,
+                listLoading: true,
+            },
+            async () => {
+                this.updateOperationAuth();
+                this.getMdList();
+                this.doSearch();
+            }
+        );
+    };
+
+    // 请求搜索
+    doSearch(page) {
+        this.setState(
+            {
+                listLoading: true,
+                currentPage: page ? 1 : this.state.currentPage,
+                selectedContents: [],
+            },
+            () => {
+                this.getMdContentList();
+            }
+        );
+    }
+
+    //  获取名单内容列表
+    async getMdContentList() {
+        const { dispatch } = this.props;
+        const newParams = this.getSearchParams();
+        const { listData, totalCount } = await dispatch({
+            type: 'mingdan/getMdContentList',
+            payload: newParams,
+        });
+        this.setState(
+            {
+                listData,
+                listTotalCount: totalCount,
+            },
+            () => {
+                if (listData.length) {
+                    let dataSource = this.formatData(listData);
+                    this.setState({
+                        tableDataSource: dataSource,
+                        listLoading: false,
+                    });
+                } else {
+                    this.setState({
+                        tableDataSource: [],
+                        listLoading: false,
+                    });
+                }
+            }
+        );
+    }
+
+    //  获取名单列表
+    async getMdList() {
+        const { dispatch, route, stateConfig } = this.props;
+        const {
+            listType,
+            subType = '',
+            channelType = '',
+            reuseGlobal = '',
+            checkItems,
+            operation,
+        } = this.state;
+
+        let searchParams = {
+            organization: this.getOrganization(),
+            product: this.getProduct(),
+            type: this.state.listType,
+            checkItems: JSON.parse(checkItems),
+            count: 1000,
+            offset: 0,
+        };
+
+        // 天枢使用 channelType，非天枢使用 subType
+        const isTianShu = location.pathname.includes('/new/tianShu');
+        if (isTianShu && channelType) {
+            searchParams.channelType = channelType;
+        } else if (subType) {
+            searchParams.subType = subType;
+        }
+        // 全局名单 区分全局和公司
+        if (reuseGlobal === '1' && listType === '0') {
+            searchParams.reuseGlobal = reuseGlobal;
+        }
+        const { listData } = await dispatch({
+            type: 'mingdan/getMdList',
+            payload: searchParams,
+        });
+        if (listData.length) {
+            let mdDataList = [];
+            if (operation === 'regex') {
+                listData.filter(item => item.config.operation === 'regex').map(item => {
+                    if (item.listId !== this.state.listId) {
+                        mdDataList.push({
+                            name: item.name,
+                            value: item.listId,
+                        });
+                    }
+                });
+
+            } else {
+                listData.map(item => {
+                    if (item.listId !== this.state.listId && item.config.operation !== 'regex') {
+                        mdDataList.push({
+                            name: item.name,
+                            value: item.listId,
+                        });
+                    }
+                });
+            }
+
+            this.setState({
+                mdDataList,
+            });
+        }
+    }
+
+    // 获取列表表单项
+    getTableColumns = () => {
+        const { globalSensitive, route } = this.props;
+        const serviceId = route.routeData.serviceId;
+        return [
+            {
+                title: '名单内容',
+                key: 'mdContent',
+                dataIndex: 'mdContent',
+                width: '15%',
+                ellipsis: true,
+                render: this.textRender,
+            },
+            serviceId === 'POST_ARTICLE' && {
+                title: '网页url',
+                key: 'articleUrl',
+                dataIndex: 'articleUrl',
+                width: '15%',
+                ellipsis: true,
+                render: this.textRender,
+            },
+            {
+                title: '更新时间',
+                key: 'updateTime',
+                dataIndex: 'updateTime',
+                width: 120,
+                ellipsis: true,
+                render: this.timeRender,
+            },
+            {
+                title: '操作账号',
+                key: 'operationAccount',
+                dataIndex: 'operationAccount',
+                width: '15%',
+                ellipsis: true,
+                render: this.textRender,
+            },
+            ...(globalSensitive ? [] : [{
+                title: '有效期',
+                key: 'timeBased',
+                dataIndex: 'timeBased',
+                width: '15%',
+                ellipsis: true,
+                render: this.textRender,
+            }]),
+            {
+                title: '备注',
+                key: 'remark',
+                dataIndex: 'remark',
+                width: '15%',
+                ellipsis: true,
+                render: this.textRender,
+            },
+            {
+                title: '操作',
+                key: 'operation',
+                dataIndex: 'operation',
+                width: 120,
+                ellipsis: true,
+                render: this.operationRender,
+            },
+        ];
+    };
+
+    formatData = data => {
+        let dataSource = [];
+        dataSource = data.map(item => {
+            return {
+                key: item.content,
+                id: item.content,
+                mdContent: item.content,
+                updateTime: item.createTime || '-',
+                timeBased: item.efficientTime || '永久',
+                operationAccount: item.user || '-',
+                remark: item.remark || '-',
+                articleUrl: item.articleUrl || '-',
+                operation: {
+                    hasEdit: true,
+                    hasDelete: true,
+                },
+            };
+        });
+        return dataSource;
+    };
+
+    // 跳转至名单内容操作日志
+    jumpToOpLog = () => {
+        history.push({
+            pathname: `${location.pathname}OpLog`,
+            query: {
+                listName: this.state.listName,
+                listId: this.state.listId,
+                checkItems: this.state.checkItems,
+                operation: this.state.operation,
+                isCustom: this.state.isCustom,
+                isSensitive: this.state.isSensitive,
+            },
+        });
+    };
+
+    // 导出数据
+    exportData = () => {
+        const { listName, listId, currentGlobalFilter, queryParams, channelType } = this.state;
+        const { route } = this.props;
+        const title = `${listName}.csv`;
+        const searchParams = {
+            organization: this.getOrganization(),
+            product: this.getProduct(),
+            listId,
+            ...queryParams,
+        };
+        // 天枢使用 channelType
+        const isTianShu = location.pathname.includes('/new/tianShu');
+        if (isTianShu && channelType) {
+            searchParams.channelType = channelType;
+        }
+        const downloadUrl = LIST_CONTENT_URL;
+
+        exportFile(downloadUrl, title, searchParams).then(() => {
+            this.setState({
+                exportLoading: false,
+            });
+        });
+    };
+
+    // 获取查询接口参数
+    getSearchParams = () => {
+        const { route } = this.props;
+        const {
+            currentGlobalFilter,
+            queryParams,
+            currentPage,
+            pageSize,
+            listId,
+            subType = '',
+            channelType = '',
+        } = this.state;
+        const { organization } = currentGlobalFilter;
+        const serviceId = this.getProduct();
+        let searchParams = {
+            organization: this.getOrganization(),
+            product: serviceId,
+            listId: listId,
+            count: pageSize,
+            offset: (currentPage - 1) * pageSize,
+            ...queryParams,
+        };
+        // 天枢使用 channelType
+        const isTianShu = location.pathname.includes('/new/tianShu');
+        if (isTianShu && channelType) {
+            searchParams.channelType = channelType;
+        }
+        // 处理一下searchParams，如果为'' || 'all', 则删除该项
+        let newSearchParams = formatSearchParams(searchParams);
+        return newSearchParams;
+    };
+
+    // 更新操作权限
+    updateOperationAuth = () => {
+        const { currentUser, globalSensitive, route } = this.props;
+        const serviceId = route.routeData.serviceId;
+        const { isSMShow, currentGlobalFilter } = this.state;
+        const currentUserOrg = currentUser.organization; // 当前用户公司的org
+        const roleIds = currentUser.roleIds;
+        const organization = currentGlobalFilter.organization;
+        let canCreate = getAuthFunction(AUTH_FUNCTION.CREATE);
+        let canBatchCreate = getAuthFunction(AUTH_FUNCTION.BATCH_CREATE);
+        let canDelete = getAuthFunction(AUTH_FUNCTION.DELETE);
+        let canBatchDelete = getAuthFunction(AUTH_FUNCTION.BATCH_DELETE);
+        let canMove = getAuthFunction(AUTH_FUNCTION.BATCH_MOVE);
+        let canEdit = getAuthFunction(AUTH_FUNCTION.UPDATE);
+        let canExport = getAuthFunction(AUTH_FUNCTION.EXPORT);
+        if (currentUserOrg === SM_ACCOUNT && organization === SM_ACCOUNT) {
+            if (!roleIds.includes(ACCOUNT_ROLE.SM_ROLE) && !globalSensitive) {
+                canDelete = false;
+                canMove = false;
+                canEdit = false;
+                canCreate = false;
+                canBatchCreate = false;
+                canBatchDelete = false;
+            }
+        }
+        if (serviceId === 'POST_ARTICLE') {
+            canMove = false;
+            canEdit = false;
+            canCreate = false;
+            canBatchCreate = false;
+            canBatchDelete = false;
+        }
+        this.setState({
+            authConfig: {
+                // 账号角色权限
+                canCreate,
+                canDelete,
+                canEdit,
+                canMove,
+                canExport,
+                canBatchCreate,
+                canBatchDelete,
+            },
+        });
+    };
+
+    /**
+     * 列表排序更改，切换页码/翻页
+     * @param {*} pagination
+     * @param {*} filters
+     * @param {*} sorter
+     */
+    listOnSearch = pagination => {
+        const { current, pageSize } = pagination;
+        const { queryParams } = this.state;
+        let newQueryParams = lodash.cloneDeep(queryParams);
+        this.setState(
+            {
+                currentPage: current,
+                pageSize: pageSize,
+                queryParams: newQueryParams,
+                selectedContents: [],
+                listLoading: true,
+            },
+            () => {
+                this.getMdContentList();
+            }
+        );
+    };
+
+    /**
+     * 搜索筛选项更改
+     * @param {*} name   更改筛选项类型名称
+     * @param {*} value  更改后的值
+     */
+    changeQueryParams(name, value) {
+        const { queryParams } = this.state;
+        let newQueryParams = lodash.cloneDeep(queryParams);
+        switch (name) {
+            default:
+                newQueryParams[name] = value;
+        }
+        this.setState(
+            {
+                queryParams: newQueryParams,
+            },
+            () => {
+                this.doSearch();
+            }
+        );
+    }
+
+    // 移动确认气泡浮框内容
+    moveConfirmContent = () => {
+        const {mdDataList, isSMShow} = this.state;
+        const locale = Storage.get('umi_locale');
+        const {t} = this.props;
+        const selectData = {
+            optionData: mdDataList,
+            title: '名单列表',
+            labelId: 'mingdan',
+        };
+        return (
+            <div className={styles['pop-confirm']}>
+                <div className={styles['confirm-title']}>
+                    <img src={tipImg} className={styles['title-icon-tip']} />
+                    <div className={styles['title-content']}>
+                        {t('请选择要移动至的名单')}
+                    </div>
+                </div>
+                <div>
+                    <div className={styles['confirm-content']}>
+                        <SMSelect
+                            selectData={selectData}
+                            componentProps={{
+                                placeholder: t('请选择名单'),
+                            }}
+                            onChange={value => {
+                                this.setState({
+                                    currentMdListId: value,
+                                });
+                            }}
+                        />
+                    </div>
+                    <div
+                        className={styles['confirm-remark']}
+                        style={locale === LOCALE_TYPE.EN ? {marginLeft: 57} : {}}
+                    >
+                        <lable className={styles['remark-text']}>{t('备注')}：</lable>
+                        <Input
+                            placeholder={t('请输入备注')}
+                            onChange={e => this.setState({remark: e.target.value})}
+                        />
+                    </div>
+                    <div className={styles['confirm-footer']}>
+                        <Button
+                            onClick={() => {
+                                this.setState({
+                                    moveConfirmVisible: false,
+                                });
+                            }}
+                        >
+                            {t('取消')}
+                        </Button>
+                        <Button
+                            style={locale === LOCALE_TYPE.EN ? {marginLeft: 2} : {}}
+                            type="primary"
+                            onClick={() => {
+                                this.moveMdContent(this.state.selectedContents);
+                            }}
+                        >
+                            {t('确认')}
+                        </Button>
+                    </div>
+                </div>
+            </div>
+        );
+    };
+
+    /**
+     * 显示多选操作栏
+     */
+    showSelectionExtraDom = () => {
+        const {globalSensitive = false, t, route, isLab} = this.props;
+        const {authConfig, moveConfirmVisible, isSMShow, currentGlobalFilter, action} = this.state;
+        const {canMove, canDelete} = authConfig;
+        const serviceId = route?.routeData?.serviceId;
+
+        return (
+            <div>
+                {canMove ? !isSMShow && currentGlobalFilter.organization === 'GLOBAL' && !globalSensitive ? (
+                    <div
+                        className={styles['selection-operation']}
+                        onClick={() => {
+                            this.setState({
+                                moveFormVisible: true,
+                                moveFormType: 'move',
+                            });
+                        }}
+                    >
+                        <span className={styles['operation-content']}>
+                            {t('移动')}
+                        </span>
+                        <SMIcon type="icon-piliangyidongtubiao" />
+                    </div>
+                ) : (
+                    <Popover
+                        content={this.moveConfirmContent()}
+                        trigger="click"
+                        placement="bottomRight"
+                        visible={moveConfirmVisible}
+                        onVisibleChange={visible => {
+                            this.setState({
+                                moveConfirmVisible: visible,
+                            });
+                        }}
+                        arrowPointAtCenter
+                    >
+                        <div
+                            className={styles['selection-operation']}
+                            onClick={() => {
+                                this.setState({
+                                    contentMoveModalVisible: true,
+                                });
+                            }}
+                        >
+                            <span className={styles['operation-content']}>
+                                {t('移动')}
+                            </span>
+                            <SMIcon type="icon-piliangyidongtubiao" />
+                        </div>
+                    </Popover>
+                ) : null}
+                {canDelete ? !isSMShow && currentGlobalFilter.organization === 'GLOBAL' && !globalSensitive ? (
+                    <div
+                        className={styles['selection-operation']}
+                        onClick={() => {
+                            this.setState({
+                                moveFormVisible: true,
+                                moveFormType: 'arrDelete',
+                            });
+                        }}
+                    >
+                        <span className={styles['operation-content']}>
+                            {t('删除')}
+                        </span>
+                        <SMIcon type="icon-shanchuxuanzhong" />
+                    </div>
+                ) : (
+                    <SMPopConfirm
+                        title={t('请确认是否删除选中名单内容')}
+                        isLab={isLab && action !== 'IGNORE'}
+                        placeholder={t('请输入删除名单原因')}
+                        hasTextArea
+                        serviceId
+                        onConfirm={(value, cb, labValue) => {
+                            if (isLab && labValue === '1' && action !== 'IGNORE') {
+                                this.addMdContent({contents: this.state.selectedContents, cb, remark: value, hasEnteredLab: labValue, type: 'delete'});
+                            }
+                            else {
+                                this.deleteMdContent(
+                                    this.state.selectedContents,
+                                    cb,
+                                    value,
+                                    isLab && labValue === '1' && action !== 'IGNORE'
+                                );
+                            }
+                        }
+                        }
+                        children={
+                            <div className={styles['selection-operation']}>
+                                <span className={styles['operation-content']}>
+                                    {t('删除')}
+                                </span>
+                                <SMIcon type="icon-shanchuxuanzhong" />
+                            </div>
+                        }
+                    />
+                ) : null}
+            </div>
+        );
+    };
+
+    /**
+     * 名单查重
+     */
+    inspectData = async (values, type, oldValues) => {
+        const {t, route, subType, isLab} = this.props;
+        const {action} = this.state;
+
+        this.setState({
+            sensitiveWordSpin: true,
+        });
+        let contents = values.contents ? formatContents(values.contents) : [];
+        const params = {
+            listId: this.state.listId,
+            organization: this.getOrganization(),
+            product: this.getProduct(),
+            contents,
+        };
+        if (type === 'add' && isLab && values.hasEnteredLab === '1' && action !== 'IGNORE') {
+            params.listId = `${params.listId}__add`;
+        }
+        let result = await this.props.dispatch({
+            type: 'mingdan/inspectData',
+            payload: params,
+        });
+
+        this.setState({
+            sensitiveWordSpin: false,
+        });
+
+        if (result && result.text?.length) {
+            Storage.set('sm-tj-mingdan-parameter', {
+                listId: this.state.listId,
+                organization: this.getOrganization(),
+                product: this.getProduct(),
+            });
+            global.modal.show(ModalType.MODAL_ALERT, {
+                width: 576,
+                modalTitle: t('提示'),
+
+                renderChildren: () => {
+                    return (
+                        <SensitivewordHintModal
+                            closeVisible={() => {
+                                this.setState({
+                                    contentModalVisible: false,
+                                });
+                            }}
+                            textList={result.text}
+                            onOk={() => {
+                                global.modal.pop();
+                                if (type === 'add') {
+                                    this.addMdContent(values);
+                                } else {
+                                    this.updateMdContent(values, oldValues);
+                                }
+                            }}
+                            onCancel={() => {
+                                global.modal.pop();
+                            }}
+                            onGo={() => {
+                                let valueList = arryRepetition(
+                                    contents,
+                                    result.text
+                                );
+
+                                global.modal.pop();
+                                if (type === 'add') {
+                                    this.addMdContent({
+                                        contents: valueList.join('\n'),
+                                    });
+                                } else {
+                                    this.updateMdContent(
+                                        { contents: valueList.join('\n') },
+                                        oldValues
+                                    );
+                                }
+                            }}
+                        />
+                    );
+                },
+            });
+        } else {
+            if (type === 'add') {
+                this.addMdContent(values);
+            } else {
+                this.updateMdContent(values, oldValues);
+            }
+        }
+    };
+    getFileUrl = fileUrl => {
+        this.setState({
+            fileUrl,
+        });
+
+    };
+    moveMdAudit = async (selectedContents, values, action) => {
+        const {dispatch, route, t} = this.props;
+        const {fileUrl} = this.state;
+        const {ext} = values;
+        if (action === 'move') {
+            if (selectedContents.length === 0) {
+                message.error(t('请选择要移动的名单内容！'));
+                return;
+            } else if (!this.state.currentMdListId) {
+                message.error(t('请选择名单！'));
+                return;
+            }
+        }
+        if (action === 'delete') {
+            if (selectedContents.length === 0) {
+                message.error(t('请选择要删除的名单内容！'));
+                return;
+            }
+        }
+        const ACTION_TYPE = {
+            delete: 'mingdan/deleteMdContent',
+            move: 'mingdan/batchMove',
+        };
+        const {code, message: resMessage} = await dispatch({
+            type: ACTION_TYPE[action],
+            payload: {
+                listName: this.state.listName,
+                sourceListId: action === 'delete' ? undefined : this.state.listId,
+                organization: this.getOrganization(),
+                product: this.getProduct(),
+                contents: selectedContents ? formatCustomContents(selectedContents) : [],
+                object: 'list',
+                remark: values.marker,
+                action,
+                listId: action === 'move'
+                    ? this.state.currentMdListId : action === 'delete' ? this.state.listId : undefined,
+                extend: ext ? {
+                    files: fileUrl,
+                } : {},
+                ...this.getCommonParams(),
+            },
+        });
+        if (code === 1100) {
+            message.success(t('审批发起成功'));
+            this.setState(
+                {
+                    moveFormVisible: false,
+                },
+                () => {
+                    this.doSearch();
+                }
+            );
+        } else {
+            message.error('操作失败');
+        }
+    };
+
+    render() {
+        const {
+            tableDataSource,
+            listLoading,
+            listTotalCount,
+            pageSize,
+            pageSizeOptions,
+            currentPage,
+            noteInfo,
+            exportLoading,
+            pageRoute,
+            listName,
+            operation,
+            defaultLabelSearchData,
+            selectedContents,
+            contentModalVisible,
+            contentModalType,
+            contentModalDefaultValue,
+            importModalType,
+            importModalVisible,
+            authConfig,
+            subType,
+            isSMShow,
+            moveFormVisible,
+            mdDataList,
+            moveFormType,
+            moreDelete,
+            currentGlobalFilter,
+            action,
+        } = this.state;
+        const {t, route, isLab} = this.props;
+        const tableColumns = getIntlTableColums(this.getTableColumns(), t);
+        const { canCreate, canBatchCreate, canBatchDelete, canExport } = authConfig;
+
+        const serviceId = route?.routeData?.serviceId;
+
+        return (
+            <div>
+                <GlobalFilterListener onChange={this.globalFilterChange} />
+                <div className={styles['bread-crumb']}>
+                    <Breadcrumb separator=">">
+                        <Breadcrumb.Item>
+                            <Link to={__ASSETS_PREFIX__ + pageRoute.path}>{t(pageRoute.name)}</Link>
+                        </Breadcrumb.Item>
+                        <Breadcrumb.Item>{t(listName)}</Breadcrumb.Item>
+                    </Breadcrumb>
+                </div>
+                <div className={styles['note-tip']}>
+                    <SMNoteTip noteInfo={noteInfo} />
+                </div>
+                <div className={styles['search-form']}>
+                    {canCreate ? (
+                        <div className={styles['form-item']}>
+                            <Button
+                                type="primary"
+                                onClick={() => {
+                                    const value = isLab ? {hasEnteredLab: '1'} : {};
+                                    this.showMdContentModal('add', value);
+                                }
+                                }
+                                disabled={operation === 'regex' && listTotalCount >= 10}
+                            >
+                                <SMIcon type="icon-add" />
+                                {t('添加名单内容')}
+                            </Button>
+                        </div>
+                    ) : null}
+                    {canBatchCreate && !isPrivate() && operation !== 'regex' ? (
+                        <div className={styles['form-item']}>
+                            <Button
+                                type="primary"
+                                onClick={() =>
+                                    this.showMdContentImportModal('add')
+                                }
+                                className={styles['button-white']}
+                            >
+                                <SMIcon type="icon-piliangdaochu" />
+                                {t('批量导入')}
+                            </Button>
+                        </div>
+                    ) : null}
+                    {canBatchDelete && !isPrivate() ? (
+                        <div className={styles['form-item']}>
+                            <Tooltip
+                                title={t('可以批量删除上传文件内的所有敏感词')}
+                                placement="right"
+                            >
+                                <Button
+                                    type="primary"
+                                    onClick={() =>
+                                        this.showMdContentImportModal('delete')
+                                    }
+                                    className={styles['button-white']}
+                                >
+                                    <SMIcon type="icon-shanchuxuanzhong" />
+                                    {t('批量删除')}
+                                </Button>
+                            </Tooltip>
+                        </div>
+                    ) : null}
+                    <div className={styles['item-search']}>
+                        <SMLabelSearch
+                            onSearch={(searchId, searchText) => {
+                                this.changeQueryParams(searchId, searchText);
+                            }}
+                            configData={defaultLabelSearchData}
+                        />
+                    </div>
+                    <div className={styles['item-right']}>
+                        <div className={styles['item-oplog']}>
+                            {getAuthFunction(AUTH_FUNCTION.OPLOG) && (
+                                <Button onClick={this.jumpToOpLog} type="link">
+                                    {t('操作日志')}
+                                </Button>
+                            )}
+                        </div>
+                        {canExport ? (
+                            <div className={styles['export-icon']}>
+                                <Tooltip
+                                    title={t(EXPORT_MD_TOOLTIP)}
+                                    placement="topRight"
+                                >
+                                    <Spin spinning={exportLoading}>
+                                        <SMIcon
+                                            type="icon-daochu"
+                                            onClick={this.exportData}
+                                        />
+                                    </Spin>
+                                </Tooltip>
+                            </div>
+                        ) : null}
+                    </div>
+                </div>
+                <div className={styles['table-list']}>
+                    <SMTable
+                        columns={tableColumns}
+                        dataSource={tableDataSource}
+                        loading={listLoading}
+                        totalCount={listTotalCount}
+                        showTotal={() => `${t('共')}${listTotalCount}${t('条')}`}
+                        i18nText={tableText(t)}
+                        rowSelection={{
+                            selectedRowKeys: selectedContents,
+                            onChange: val => {
+                                this.setState({
+                                    selectedContents: val,
+                                });
+                            },
+                        }}
+                        selectionExtraDom={this.showSelectionExtraDom}
+                        wrapperStyle={{
+                            margin: 0,
+                        }}
+                        customLoadingUrl={this.props.customLoadingIcon}
+                        antdProps={{
+                            pagination: {
+                                showQuickJumper: true,
+                                defaultPageSize: pageSize,
+                                pageSizeOptions: pageSizeOptions,
+                                total: listTotalCount,
+                                current: currentPage,
+                                showSizeChanger: true,
+                            },
+                            onChange: this.listOnSearch,
+                        }}
+                    />
+                    {tableDataSource.length ? (
+                        <TotalCount count={listTotalCount} />
+                    ) : null}
+                </div>
+                <div className={styles['content-modal']}>
+                    <SMAdminForm
+                        mdDataList={mdDataList}
+                        type={moveFormType}
+                        visible={moveFormVisible}
+                        getFileUrl={this.getFileUrl}
+                        onChange={value => {
+                            this.setState({
+                                currentMdListId: value,
+                            });
+                        }}
+                        onCancel={() => {
+                            this.setState({
+                                moveFormVisible: false,
+                            });}}
+                        onSubmit={values => {
+                            if (moveFormType === 'move') {
+                                this.moveMdAudit(this.state.selectedContents, values, 'move');
+                            } else if (moveFormType === 'delete') {
+                                this.moveMdAudit(moreDelete, values, 'delete');
+                            } else {
+                                this.moveMdAudit(this.state.selectedContents, values, 'delete');
+                            }
+
+                        }}
+                    />
+                </div>
+
+                <MdContentModal
+                    visible={contentModalVisible}
+                    type={contentModalType}
+                    operation={operation}
+                    isLab={isLab}
+                    serviceId={serviceId}
+                    isDefaultBlack={this.state.isBlack}
+                    listTotalCount={listTotalCount}
+                    initialValues={contentModalDefaultValue}
+                    action={action}
+                    subType={subType}
+                    onConfirm={(values, type, oldValues) => {
+                        if ((!subType || subType !== LIST_CONTENT_TYPE.IMG) && values.contents !== oldValues.contents) {
+                            this.inspectData(values, type, oldValues);
+                        } else {
+                            if (type === 'add') {
+                                this.addMdContent(values);
+                            } else {
+                                this.updateMdContent(values, oldValues);
+                            }
+                        }
+                    }}
+                    onCancel={() => {
+                        this.setState({
+                            contentModalVisible: false,
+                        });
+                    }}
+                />
+                <MdContentImportModal
+                    visible={importModalVisible}
+                    type={importModalType}
+                    isLab={isLab}
+                    serviceId={serviceId}
+                    action={action}
+                    subType={subType}
+                    onConfirm={(fileList, type, remark, hasEnteredLab) => {
+                        this.uploadFile(fileList, type, remark, hasEnteredLab);
+                    }}
+                    onCancel={() => {
+                        this.setState({
+                            importModalVisible: false,
+                        });
+                    }}
+                />
+                <SensitiveWordSpin visible={this.state.sensitiveWordSpin} />
+            </div>
+        );
+    }
+}
+
+export default connect(({ user }) => ({
+    currentUser: user.currentUser,
+}))(withIntlComponents(ListContent));