311 lines
12 KiB
JavaScript
311 lines
12 KiB
JavaScript
import React from 'react';
|
||
import { Button, Checkbox } from 'antd';
|
||
import { WeaTools, WeaLocaleProvider, WeaTop, WeaDialog, WeaSearchGroup, WeaTable } from 'ecCom';
|
||
import { addContentPath } from '../../util/pathUtil';
|
||
|
||
const isIE = WeaTools.ua.browser == 'IE';
|
||
const getLabel = WeaLocaleProvider.getLabel;
|
||
|
||
class WeaPlugin extends React.Component {
|
||
constructor(props) {
|
||
super(props);
|
||
this.state = { loading: false, test: false, isCheck: false, data: {} };
|
||
}
|
||
|
||
componentWillMount() {
|
||
const { display, visible } = this.props;
|
||
if (display == 'page' || visible) {
|
||
this.getPlugins();
|
||
}
|
||
}
|
||
|
||
componentWillReceiveProps(nextProps) {
|
||
const { visible } = nextProps;
|
||
if (visible) {
|
||
this.getPlugins();
|
||
}
|
||
}
|
||
|
||
render() {
|
||
const { display, visible, style = {} } = this.props;
|
||
const { loading, test = false, isCheck = false, data = {} } = this.state;
|
||
const { plugins = [], otherPlugins = [] } = data;
|
||
plugins.forEach((item) => {
|
||
for (let it in item) {
|
||
if (it == 'explain') {
|
||
item[it] = item[it].replace('、报表控件', '');
|
||
}
|
||
}
|
||
});
|
||
|
||
let columns = [
|
||
{ key: 'index', title: getLabel(15486, '序号'), dataIndex: 'index', width: '10%' },
|
||
{ key: 'name', title: getLabel(195, '名称'), dataIndex: 'name', width: '20%' },
|
||
{ key: 'explain', title: getLabel(433, '描述'), dataIndex: 'explain', width: '35%' },
|
||
{ key: 'size', title: getLabel(2036, '大小'), dataIndex: 'size', width: '10%' },
|
||
{
|
||
key: 'status',
|
||
title: getLabel(602, '状态'),
|
||
dataIndex: 'status',
|
||
width: '10%',
|
||
render: (text, record) => this.getPluginStatus(record.progid),
|
||
},
|
||
{
|
||
key: 'download',
|
||
title: getLabel(22010, '下载并安装'),
|
||
dataIndex: 'download',
|
||
width: '15%',
|
||
render: (text, record) => (
|
||
<a href={addContentPath(record.url)} target="_blank" style={{ color: '#00a9ff' }}>
|
||
{getLabel(258, '下载')}
|
||
</a>
|
||
),
|
||
},
|
||
];
|
||
|
||
let otherColumns = [
|
||
{ key: 'index', title: getLabel(15486, '序号'), dataIndex: 'index', width: '10%' },
|
||
{ key: 'name', title: getLabel(195, '名称'), dataIndex: 'name', width: '20%' },
|
||
{ key: 'explain', title: getLabel(433, '描述'), dataIndex: 'explain', width: '35%' },
|
||
{ key: 'size', title: getLabel(2036, '大小'), dataIndex: 'size', width: '10%' },
|
||
{ key: 'version', title: getLabel(567, '版本'), dataIndex: 'version', width: '10%' },
|
||
{
|
||
key: 'download',
|
||
title: getLabel(22010, '下载并安装'),
|
||
dataIndex: 'download',
|
||
width: '15%',
|
||
render: (text, record) => (
|
||
<a href={addContentPath(record.url)} target="_blank" style={{ color: '#00a9ff' }}>
|
||
{getLabel(258, '下载')}
|
||
</a>
|
||
),
|
||
},
|
||
];
|
||
|
||
let Content = (
|
||
<div className="wea-plugin-body">
|
||
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@yjwf95`} title={getLabel(22005, '控件安装')} showGroup={true}>
|
||
<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@gp811b`} columns={columns} dataSource={plugins} pagination={false} />
|
||
</WeaSearchGroup>
|
||
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@fnilp3`} title={getLabel(22014, '安装其他工具')} showGroup={true}>
|
||
<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@11irv3`} columns={otherColumns} dataSource={otherPlugins} pagination={false} />
|
||
</WeaSearchGroup>
|
||
{isIE && (
|
||
<div className="wea-plugin-chk-msg">
|
||
<Checkbox ecId={`${this && this.props && this.props.ecId || ''}_Checkbox@g9logj`} checked={isCheck} onChange={this.onChange}>
|
||
{getLabel(22017, '每次进入系统时检测')}
|
||
</Checkbox>
|
||
</div>
|
||
)}
|
||
{isIE && (
|
||
<div className="wea-plugin-tip-msg">
|
||
<i className="icon-coms02-Warning-01" />
|
||
<span style={{ marginLeft: '10px' }}>{getLabel(22016, '注意：安装完毕请重启计算机！')}</span>
|
||
</div>
|
||
)}
|
||
</div>
|
||
);
|
||
|
||
if (test) {
|
||
columns = [
|
||
{
|
||
key: 'index',
|
||
title: getLabel(15486, '序号'),
|
||
dataIndex: 'index',
|
||
width: '10%',
|
||
render: (text, record) => parseInt(record.index) - 1,
|
||
},
|
||
{ key: 'name', title: getLabel(195, '名称'), dataIndex: 'name', width: '15%' },
|
||
{ key: 'clsid', title: getLabel(22037, '控件') + getLabel(714, '编号'), dataIndex: 'clsid', width: '20%' },
|
||
{ key: 'clsname', title: getLabel(22037, '控件') + getLabel(195, '名称'), dataIndex: 'clsname', width: '20%' },
|
||
{ key: 'version', title: getLabel(567, '版本'), dataIndex: 'version', width: '10%' },
|
||
{
|
||
key: 'status',
|
||
title: getLabel(602, '状态'),
|
||
dataIndex: 'status',
|
||
width: '10%',
|
||
render: (text, record) => this.getPluginStatus(record.progid),
|
||
},
|
||
{
|
||
key: 'download',
|
||
title: getLabel(22011, '检测'),
|
||
dataIndex: 'download',
|
||
width: '15%',
|
||
render: (text, record) => (
|
||
<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@697817`} type="ghost" icon="search" onClick={() => this.onTest(record)}>
|
||
{getLabel(22011, '检测')}
|
||
</Button>
|
||
),
|
||
},
|
||
];
|
||
|
||
Content = (
|
||
<div className="wea-plugin-body">
|
||
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@6jnsc2`} title={getLabel(22006, '控件检测')} showGroup={true}>
|
||
<WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@gt14uz`} columns={columns} dataSource={plugins.slice(1)} pagination={false} />
|
||
</WeaSearchGroup>
|
||
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@0thqcu`} title={getLabel(22019, '如果控件不能够正常运行怎么办？')} showGroup={true}>
|
||
<div className="wea-plugin-step">
|
||
<div className="wea-plugin-step-num">1</div>
|
||
<span>
|
||
{getLabel(22020, '第一步：')}
|
||
{getLabel(83838, '从')} C:\WINDOWS\Downloaded Program Files {getLabel(22024, '删除通过自动提示安装方式注册的控件，对应名称参见clsname列；')}
|
||
</span>
|
||
</div>
|
||
<div className="wea-plugin-step">
|
||
<div className="wea-plugin-step-num">2</div>
|
||
<span>
|
||
{getLabel(22021, '第二步：')}
|
||
{getLabel(22025, '从“控制面板 -> 删除或添加程序”删除通过下载控件方式安装的控件；')}
|
||
</span>
|
||
</div>
|
||
<div className="wea-plugin-step">
|
||
<div className="wea-plugin-step-num">3</div>
|
||
<span>
|
||
{getLabel(22022, '第三步：')}
|
||
{getLabel(22026, '删除用手工方式注册的控件：')}
|
||
</span>
|
||
<div style={{ paddingLeft: '30px', color: '#666' }}>
|
||
<p>1、{getLabel(22027, '在命令行执行')} regedit.exe；</p>
|
||
<p>
|
||
2、{getLabel(22028, '在键 HKEY_CLASSES_ROOT\\CLSID 下查找对应的 clsid，如Office 控件的注册项为')} {'{23739A7E-5741-4D1C-88D5-D50B18F7C347}'}；
|
||
</p>
|
||
<p>
|
||
3、{getLabel(22029, '如果找到该注册项，表明控件已安装。安装的文件路径见 InprocServer32 项的值，')}
|
||
{getLabel(22027, '在命令行执行')}“regsvr32 /u <{getLabel(22030, '带路径的文件名称')}>”{getLabel(22031, '即可删除')}
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<div className="wea-plugin-step">
|
||
<div className="wea-plugin-step-num">4</div>
|
||
<span>
|
||
{getLabel(22023, '第四步：')}
|
||
{getLabel(22032, '重新下载控件方式安装控件！')}
|
||
</span>
|
||
</div>
|
||
</WeaSearchGroup>
|
||
<WeaSearchGroup ecId={`${this && this.props && this.props.ecId || ''}_WeaSearchGroup@wzu5n2`} title={getLabel(22033, '为什么通过下载插件安装方式卸载控件会报错？')} showGroup={true}>
|
||
<div>
|
||
<span>{getLabel(22034, '卸载控件之前需要关闭所有 IE 窗口和使用控件的程序。')}</span>
|
||
</div>
|
||
</WeaSearchGroup>
|
||
</div>
|
||
);
|
||
}
|
||
|
||
if (display == 'page') {
|
||
return (
|
||
<WeaTop ecId={`${this && this.props && this.props.ecId || ''}_WeaTop@d7oasy`}
|
||
loading={loading}
|
||
title={getLabel(83543, '插件下载')}
|
||
icon={<i className="icon-coms02-Plug-in" />}
|
||
iconBgcolor="#a7adb5"
|
||
buttons={this.getButtons(display)}
|
||
>
|
||
{Content}
|
||
</WeaTop>
|
||
);
|
||
}
|
||
|
||
return (
|
||
<WeaDialog ecId={`${this && this.props && this.props.ecId || ''}_WeaDialog@zyk0dk`}
|
||
visible={visible}
|
||
loading={loading}
|
||
title={getLabel(83543, '插件下载')}
|
||
icon="icon-coms02-Plug-in"
|
||
iconBgcolor="#a7adb5"
|
||
style={{ width: style.width || 810, height: style.height || 480 }}
|
||
zIndex={100}
|
||
hasScroll={true}
|
||
maskClosable={true}
|
||
buttons={this.getButtons()}
|
||
onCancel={this.onCancel}
|
||
>
|
||
{Content}
|
||
</WeaDialog>
|
||
);
|
||
}
|
||
|
||
getButtons = (display) => {
|
||
const buttons = [];
|
||
if (this.state.test) {
|
||
buttons.push(
|
||
<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@bub67g`} type="primary" onClick={() => this.setState({ test: false })}>
|
||
{getLabel(1290, '返回')}
|
||
</Button>,
|
||
);
|
||
} else if (isIE) {
|
||
buttons.push(
|
||
<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@p3b2ew`} type="primary" onClick={() => this.setState({ test: true })}>
|
||
{getLabel(22006, '控件检测')}
|
||
</Button>,
|
||
);
|
||
} else if (display != 'page') {
|
||
buttons.push(
|
||
<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@89ou00`} type="primary" onClick={this.onCancel}>
|
||
{getLabel(83446, '确定')}
|
||
</Button>,
|
||
);
|
||
}
|
||
return buttons;
|
||
};
|
||
|
||
getPlugins = () => {
|
||
this.setState({ loading: true });
|
||
WeaTools.callApi('/api/portal/systemInfo/getPlugins', 'GET').then((result) => {
|
||
const { data = {} } = result;
|
||
this.setState({ loading: false, isCheck: data.isCheck, data });
|
||
});
|
||
};
|
||
|
||
onChange = (e) => {
|
||
const checked = e.target.checked;
|
||
this.setState({ isCheck: checked });
|
||
WeaTools.callApi('/api/portal/systemInfo/setIsCheck', 'POST', { isCheck: checked ? '0' : '1' });
|
||
};
|
||
|
||
getPluginStatus = (progid) => {
|
||
if (!isIE) {
|
||
return <i className="icon-coms-Prompt" style={{ color: '#fa0', fontSize: '14px' }} title={getLabel(507433, '非IE浏览器无需安装')} />;
|
||
}
|
||
|
||
let status = false;
|
||
try {
|
||
if (progid) {
|
||
const obj = new ActiveXObject(progid);
|
||
if (obj) {
|
||
status = true;
|
||
}
|
||
} else {
|
||
const obj1 = new ActiveXObject('iWebOffice2003.iWebOffice');
|
||
const obj2 = new ActiveXObject('CHINAEXCELWEB.FormvwCtrl.1');
|
||
if (obj1 && obj2) {
|
||
status = true;
|
||
}
|
||
}
|
||
} catch (e) {}
|
||
|
||
return status ? (
|
||
<i className="icon-coms-Upload-successfully-o" style={{ color: '#70d256', fontSize: '14px' }} />
|
||
) : (
|
||
<i className="icon-coms-Clear" style={{ color: '#ff3f00', fontSize: '14px' }} />
|
||
);
|
||
};
|
||
|
||
onTest = (obj) => {
|
||
const dialog = new window.Dialog();
|
||
dialog.currentWindow = window;
|
||
dialog.Width = 650;
|
||
dialog.Height = 400;
|
||
dialog.Title = `${getLabel(22006, '控件检测')}: ${obj.name}`;
|
||
dialog.URL = obj.checkpageurl;
|
||
dialog.show();
|
||
};
|
||
|
||
onCancel = () => {
|
||
this.props.onShow(false);
|
||
};
|
||
}
|
||
|
||
export default WeaPlugin;
|