|
|
@@ -0,0 +1,611 @@
|
|
|
+import React, { Component } from "react";
|
|
|
+import {
|
|
|
+ Table,
|
|
|
+ Modal,
|
|
|
+ message,
|
|
|
+ Spin,
|
|
|
+ Input,
|
|
|
+ Select,
|
|
|
+ Button,
|
|
|
+ Form,
|
|
|
+ Upload,
|
|
|
+ Popconfirm,
|
|
|
+ AutoComplete,
|
|
|
+ DatePicker,
|
|
|
+ Col,
|
|
|
+ Tabs,
|
|
|
+ Tag,
|
|
|
+ Radio,
|
|
|
+ Group,
|
|
|
+ InputNumber,
|
|
|
+} from "antd";
|
|
|
+import SpinContainer from "../../SpinContainer";
|
|
|
+import $ from "jquery/src/ajax";
|
|
|
+const { TextArea } = Input;
|
|
|
+const RadioGroup = Radio.Group;
|
|
|
+const Option = AutoComplete.Option;
|
|
|
+const confirm = Modal.confirm;
|
|
|
+class Links extends Component {
|
|
|
+ constructor(props) {
|
|
|
+ super(props);
|
|
|
+ this.state = {
|
|
|
+ dataView: null,
|
|
|
+ PublicView: null,
|
|
|
+ contentView: "",
|
|
|
+ remarksView: "",
|
|
|
+ contentViewLength: 0,
|
|
|
+ contentViewLength1: 0,
|
|
|
+ hid:'none',
|
|
|
+ pagination: {
|
|
|
+ defaultCurrent: 1,
|
|
|
+ defaultPageSize: 10,
|
|
|
+ showQuickJumper: true,
|
|
|
+ pageSize: 10,
|
|
|
+ onChange: function (page) {
|
|
|
+ this.linkList(page);
|
|
|
+ this.setState({
|
|
|
+ selectedRowKeys: [],
|
|
|
+ });
|
|
|
+ }.bind(this),
|
|
|
+ showTotal: function (total) {
|
|
|
+ return "共" + total + "条数据";
|
|
|
+ },
|
|
|
+ },
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ title: "序号",
|
|
|
+ dataIndex: "id",
|
|
|
+ key: "id",
|
|
|
+ width: "80px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "排序",
|
|
|
+ dataIndex: "sort",
|
|
|
+ key: "sort",
|
|
|
+ width: "80px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "友情链接地址",
|
|
|
+ dataIndex: "url",
|
|
|
+ key: "url",
|
|
|
+ width: "100",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "显示名称",
|
|
|
+ dataIndex: "name",
|
|
|
+ key: "name",
|
|
|
+ width: "100",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "互链",
|
|
|
+ dataIndex: "mutualChain",
|
|
|
+ key: "mutualChain",
|
|
|
+ width: "100",
|
|
|
+ render: (text, record) => {
|
|
|
+ return <div>{text == 0 ? "否" : "是"}</div>;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "备注",
|
|
|
+ dataIndex: "remarks",
|
|
|
+ key: "remarks",
|
|
|
+ width: "100",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "状态",
|
|
|
+ dataIndex: "status",
|
|
|
+ key: "status",
|
|
|
+ width: "100",
|
|
|
+ render: (text, record) => {
|
|
|
+ return <div>{text == 0 ? "正常" : "冻结"}</div>;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "操作",
|
|
|
+ dataIndex: "cz",
|
|
|
+ key: "cz",
|
|
|
+ width: "100px",
|
|
|
+ render: (text, record) => {
|
|
|
+ return (
|
|
|
+ <div>
|
|
|
+ <Popconfirm
|
|
|
+ title={record.status == 0 ? "确认冻结?" : "确认恢复?"}
|
|
|
+ onConfirm={()=>this.linksUpdate(record)}
|
|
|
+ okText="确定"
|
|
|
+ cancelText="取消"
|
|
|
+ >
|
|
|
+ <Button
|
|
|
+ style={{background:record.status ?'#009966':''}}
|
|
|
+ type={record.status == 0 ? 'primary' :'primary'}
|
|
|
+ onClick={(e) => {
|
|
|
+ e.stopPropagation();
|
|
|
+
|
|
|
+ // this.setState({
|
|
|
+ // addFlag: false,
|
|
|
+ // });
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ {record.status == 0 ? "冻结" : "恢复"}
|
|
|
+ </Button>
|
|
|
+ </Popconfirm>
|
|
|
+ </div>
|
|
|
+ );
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ dataSourceView: [],
|
|
|
+ coorVisible: "none",
|
|
|
+ list: [],
|
|
|
+ visible: false,
|
|
|
+ viewKey: 0,
|
|
|
+ modalView: false,
|
|
|
+ modalRecord: false,
|
|
|
+ closable: false,
|
|
|
+ disabledView: "none",
|
|
|
+ loading: false,
|
|
|
+ };
|
|
|
+ this.formRef = {};
|
|
|
+ this.submitOrder = this.submitOrder.bind(this);
|
|
|
+ this.linkList = this.linkList.bind(this);
|
|
|
+ this.linksUpdate = this.linksUpdate.bind(this);
|
|
|
+ this.reset = this.reset.bind(this);
|
|
|
+ this.tableRowClick = this.tableRowClick.bind(this)
|
|
|
+ this.cleanAllLinks = this.cleanAllLinks.bind(this)
|
|
|
+ }
|
|
|
+ componentDidMount() {
|
|
|
+ this.linkList(1);
|
|
|
+ }
|
|
|
+ // 清除缓存
|
|
|
+ cleanAllLinks() {
|
|
|
+ $.ajax({
|
|
|
+ method: "get",
|
|
|
+ dataType: "json",
|
|
|
+ crossDomain: false,
|
|
|
+ url: globalConfig.context + "/api/admin/links/cleanAllLinks",
|
|
|
+ success: function (data) {
|
|
|
+ if (data.error.length) {
|
|
|
+ this.setState({
|
|
|
+ loading: false,
|
|
|
+ });
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ } else {
|
|
|
+ message.success("清除成功");
|
|
|
+ }
|
|
|
+ }.bind(this),
|
|
|
+ }).always(
|
|
|
+ function () {
|
|
|
+ this.setState({
|
|
|
+ loading: false,
|
|
|
+ });
|
|
|
+ }.bind(this)
|
|
|
+ );
|
|
|
+ }
|
|
|
+ // 修改链接状态
|
|
|
+ linksUpdate(record) {
|
|
|
+ if (!this.state.sort && !record.sort) {
|
|
|
+ message.warning("请填写排序");
|
|
|
+ return;
|
|
|
+ } else if (!this.state.url && !record.url) {
|
|
|
+ message.warning("请填写友情链接");
|
|
|
+ return;
|
|
|
+ } else if (!this.state.name && !record.name) {
|
|
|
+ message.warning("请输入链接名");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ // console.log(record);
|
|
|
+ // console.log(this.state.status);
|
|
|
+ $.ajax({
|
|
|
+ method: "post",
|
|
|
+ dataType: "json",
|
|
|
+ crossDomain: false,
|
|
|
+ url: globalConfig.context + "/api/admin/links/update",
|
|
|
+ data: {
|
|
|
+ sort: record.sort || this.state.sort,
|
|
|
+ status: record.status == 0 ? '1' :'0' || this.state.status,
|
|
|
+ mutualChain: record.mutualChain || this.state.mutualChain,
|
|
|
+ name: record.name || this.state.name,
|
|
|
+ url: record.url || this.state.url,
|
|
|
+ remarks: record.remarks || this.state.remarks,
|
|
|
+ id: record.id || this.state.id,
|
|
|
+ },
|
|
|
+ success: function (data) {
|
|
|
+ if (data.error.length) {
|
|
|
+ this.setState({
|
|
|
+ loading: false,
|
|
|
+ });
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ } else {
|
|
|
+ this.setState({
|
|
|
+ visible:false,
|
|
|
+ hid:'none'
|
|
|
+ })
|
|
|
+ this.linkList(1);
|
|
|
+ message.success("修改成功");
|
|
|
+ }
|
|
|
+ }.bind(this),
|
|
|
+ }).always(
|
|
|
+ function () {
|
|
|
+ this.setState({
|
|
|
+ loading: false,
|
|
|
+ });
|
|
|
+ }.bind(this)
|
|
|
+ );
|
|
|
+ }
|
|
|
+ reset() {
|
|
|
+ this.setState({
|
|
|
+ sortType1: undefined,
|
|
|
+ name1: undefined,
|
|
|
+ mutualChain1: undefined,
|
|
|
+ status1: undefined,
|
|
|
+ },()=>{
|
|
|
+ this.linkList();
|
|
|
+ });
|
|
|
+
|
|
|
+ }
|
|
|
+ // 新增友情链接
|
|
|
+ submitOrder() {
|
|
|
+ if (!this.state.sort) {
|
|
|
+ message.warning("请填写排序");
|
|
|
+ return;
|
|
|
+ } else if (!this.state.url) {
|
|
|
+ message.warning("请填写友情链接");
|
|
|
+ return;
|
|
|
+ } else if (!this.state.name) {
|
|
|
+ message.warning("请输入链接名");
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.setState({
|
|
|
+ loading: true,
|
|
|
+ });
|
|
|
+ $.ajax({
|
|
|
+ method: "post",
|
|
|
+ dataType: "json",
|
|
|
+ crossDomain: false,
|
|
|
+ url: globalConfig.context + "/api/admin/links/add",
|
|
|
+ data: {
|
|
|
+ sort: this.state.sort,
|
|
|
+ status: 0,
|
|
|
+ mutualChain: this.state.mutualChain || 0,
|
|
|
+ name: this.state.name,
|
|
|
+ url: this.state.url,
|
|
|
+ remarks: this.state.remarks,
|
|
|
+ },
|
|
|
+ success: function (data) {
|
|
|
+ if (data.error.length) {
|
|
|
+ this.setState({
|
|
|
+ loading: false,
|
|
|
+ });
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ } else {
|
|
|
+ this.setState({
|
|
|
+ loading: false,
|
|
|
+ visible: false,
|
|
|
+ viewKey: this.state.viewKey + 1,
|
|
|
+ sort: "",
|
|
|
+ mutualChain: "",
|
|
|
+ name: "",
|
|
|
+ url: "",
|
|
|
+ remarks: "",
|
|
|
+ });
|
|
|
+ this.linkList(1);
|
|
|
+ // this.assistList();
|
|
|
+ message.success("添加成功");
|
|
|
+ }
|
|
|
+ }.bind(this),
|
|
|
+ }).always(
|
|
|
+ function () {
|
|
|
+ this.setState({
|
|
|
+ loading: false,
|
|
|
+ });
|
|
|
+ }.bind(this)
|
|
|
+ );
|
|
|
+ }
|
|
|
+ linkList(page) {
|
|
|
+ $.ajax({
|
|
|
+ method: "get",
|
|
|
+ dataType: "json",
|
|
|
+ crossDomain: false,
|
|
|
+ url: globalConfig.context + "/api/admin/links/list",
|
|
|
+ data: {
|
|
|
+ sortType: this.state.sortType1 || undefined,
|
|
|
+ name: this.state.name1 || undefined,
|
|
|
+ mutualChain: this.state.mutualChain1 || undefined,
|
|
|
+ status: this.state.status1 || undefined,
|
|
|
+ pageNo: page || 1,
|
|
|
+ pageSize: 10,
|
|
|
+ },
|
|
|
+ success: function (data) {
|
|
|
+ if (data.error.length) {
|
|
|
+ this.setState({
|
|
|
+ loading: false,
|
|
|
+ });
|
|
|
+ message.warning(data.error[0].message);
|
|
|
+ } else {
|
|
|
+ this.setState({
|
|
|
+ list: data.data.list,
|
|
|
+ pagination: this.state.pagination
|
|
|
+ });
|
|
|
+ this.state.pagination.total = data.data.totalCount;
|
|
|
+ this.state.pagination.current = data.data.pageNo;
|
|
|
+ }
|
|
|
+ if (data.data && data.data.list && !data.data.list.length) {
|
|
|
+ this.state.pagination.total = 0;
|
|
|
+ }
|
|
|
+ }.bind(this),
|
|
|
+ }).always(
|
|
|
+ function () {
|
|
|
+ this.setState({
|
|
|
+ loading: false,
|
|
|
+ });
|
|
|
+ }.bind(this)
|
|
|
+ );
|
|
|
+ }
|
|
|
+ // 双击表格弹出修改
|
|
|
+ tableRowClick(record) {
|
|
|
+ this.setState({
|
|
|
+ visible:true,
|
|
|
+ sort: record.sort,
|
|
|
+ status: record.status,
|
|
|
+ mutualChain: record.mutualChain,
|
|
|
+ name: record.name,
|
|
|
+ url: record.url,
|
|
|
+ remarks: record.remarks,
|
|
|
+ id:record.id,
|
|
|
+ hid:'block'
|
|
|
+ })
|
|
|
+ }
|
|
|
+ render() {
|
|
|
+ const formItemLayout = {
|
|
|
+ labelCol: { span: 8 },
|
|
|
+ wrapperCol: { span: 14 },
|
|
|
+ };
|
|
|
+ return (
|
|
|
+ <div>
|
|
|
+ <div className="user-content">
|
|
|
+ <div className="content-title">
|
|
|
+ <span>产品管理</span>
|
|
|
+ </div>
|
|
|
+ <div className="user-search">
|
|
|
+ <Select
|
|
|
+ placeholder="排序从高到低"
|
|
|
+ style={{ width: 150 }}
|
|
|
+ value={this.state.sortType1}
|
|
|
+ onChange={(e) => {
|
|
|
+ this.setState({
|
|
|
+ sortType1: e,
|
|
|
+ });
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ <Option value="0">排序从高到低</Option>
|
|
|
+ <Option value="1">排序从低到高</Option>
|
|
|
+ </Select>
|
|
|
+ {/* 显示名称关键字 */}
|
|
|
+ <Input
|
|
|
+ style={{bottom:'6px'}}
|
|
|
+ placeholder="请输入显示名称关键字"
|
|
|
+ value={this.state.name1}
|
|
|
+ onChange={(e) => {
|
|
|
+ this.setState({ name1: e.target.value });
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ {/* 互链 */}
|
|
|
+ <Select
|
|
|
+ placeholder="互链"
|
|
|
+ style={{ width: 150 }}
|
|
|
+ value={this.state.mutualChain1}
|
|
|
+ onChange={(e) => {
|
|
|
+ this.setState({
|
|
|
+ mutualChain1: e,
|
|
|
+ });
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ <Option value="1">是,以互链</Option>
|
|
|
+ <Option value="0">否,没互链</Option>
|
|
|
+ </Select>
|
|
|
+ {/* */}
|
|
|
+ <Select
|
|
|
+ placeholder="状态"
|
|
|
+ style={{ width: 150 }}
|
|
|
+ value={this.state.status1}
|
|
|
+ onChange={(e) => {
|
|
|
+ this.setState({
|
|
|
+ status1: e,
|
|
|
+ });
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ <Option value="0">正常</Option>
|
|
|
+ <Option value="1">冻结</Option>
|
|
|
+ </Select>
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ onClick={() => this.linkList(1)}
|
|
|
+ style={{ marginLeft: "10px" }}
|
|
|
+ >
|
|
|
+ 搜索
|
|
|
+ </Button>
|
|
|
+ <Button onClick={this.reset}>重置</Button>
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ onClick={() => {
|
|
|
+ this.setState({
|
|
|
+ visible: true,
|
|
|
+ sort: "",
|
|
|
+ mutualChain: "",
|
|
|
+ name: "",
|
|
|
+ url: "",
|
|
|
+ remarks: "",
|
|
|
+ });
|
|
|
+ }}
|
|
|
+ style={{ marginLeft: "100px" }}
|
|
|
+ >
|
|
|
+ 新增链接
|
|
|
+ </Button>
|
|
|
+ <Button
|
|
|
+ type="primary"
|
|
|
+ onClick={() => this.cleanAllLinks()}
|
|
|
+ style={{ float: "right" }}
|
|
|
+ >
|
|
|
+ 清除友情链接缓存
|
|
|
+ </Button>
|
|
|
+ </div>
|
|
|
+ <div className="patent-table">
|
|
|
+ <SpinContainer spinning={this.state.loading}>
|
|
|
+ <Table
|
|
|
+ columns={this.state.columns}
|
|
|
+ dataSource={this.state.list}
|
|
|
+ pagination={this.state.pagination}
|
|
|
+ onRowClick={this.tableRowClick}
|
|
|
+ />
|
|
|
+ </SpinContainer>
|
|
|
+ </div>
|
|
|
+ <Modal
|
|
|
+ visible={this.state.visible}
|
|
|
+ key={this.state.viewKey}
|
|
|
+ title="新增/编辑友情链接"
|
|
|
+ onCancel={() => {
|
|
|
+ this.setState({
|
|
|
+ visible: false,
|
|
|
+ viewKey: this.state.viewKey + 1,
|
|
|
+ });
|
|
|
+ }}
|
|
|
+ onOk={() => {}}
|
|
|
+ footer={false}
|
|
|
+ >
|
|
|
+ <Form
|
|
|
+ onSubmit={this.handleSubmit}
|
|
|
+ ref={this.formRef}
|
|
|
+ style={{ marginRight: "120px" }}
|
|
|
+ >
|
|
|
+ <Form.Item
|
|
|
+ {...formItemLayout}
|
|
|
+ label="排序"
|
|
|
+ name="sort"
|
|
|
+ hasFeedback
|
|
|
+ >
|
|
|
+ <InputNumber
|
|
|
+ min={1}
|
|
|
+ value={this.state.sort}
|
|
|
+ onChange={(e) => {
|
|
|
+ if(isNaN(e)) {
|
|
|
+ message.info("请输入数字")
|
|
|
+ }
|
|
|
+ this.setState({ sort: e });
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ <span style={{ color: "red" }}>数字越大排序越前</span>
|
|
|
+ </Form.Item>
|
|
|
+ <Form.Item
|
|
|
+ {...formItemLayout}
|
|
|
+ label="友链地址"
|
|
|
+ name="url"
|
|
|
+ hasFeedback
|
|
|
+ >
|
|
|
+ <Input
|
|
|
+ style={{width:"120px"}}
|
|
|
+ alue={this.state.url}
|
|
|
+ placeholder="请输入http://地址"
|
|
|
+ onChange={(e) => {
|
|
|
+ this.setState({ url: e.target.value });
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ <span style={{ color: "red" }}>请输入http://地址</span>
|
|
|
+ </Form.Item>
|
|
|
+ <Form.Item
|
|
|
+ {...formItemLayout}
|
|
|
+ label="显示名称"
|
|
|
+ name="name"
|
|
|
+ hasFeedback
|
|
|
+ >
|
|
|
+ <Input
|
|
|
+ value={this.state.name}
|
|
|
+ placeholder="请输入显示在页面的网站名称"
|
|
|
+ onChange={(e) => {
|
|
|
+ this.setState({ name: e.target.value });
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ </Form.Item>
|
|
|
+ <Form.Item
|
|
|
+ {...formItemLayout}
|
|
|
+ label="是否互链"
|
|
|
+ name="mutualChain"
|
|
|
+ hasFeedback
|
|
|
+ >
|
|
|
+ <RadioGroup
|
|
|
+ onChange={(e) => {
|
|
|
+ this.setState({
|
|
|
+ mutualChain: e.target.value,
|
|
|
+ });
|
|
|
+ }}
|
|
|
+ value={this.state.mutualChain || 0}
|
|
|
+ >
|
|
|
+ <Radio value={1}>是</Radio>
|
|
|
+ <Radio value={0}>否</Radio>
|
|
|
+ </RadioGroup>
|
|
|
+ </Form.Item>
|
|
|
+ <Form.Item
|
|
|
+ {...formItemLayout}
|
|
|
+ label="备注"
|
|
|
+ name="remarks"
|
|
|
+ hasFeedback
|
|
|
+ >
|
|
|
+ <TextArea
|
|
|
+ value={this.state.remarks}
|
|
|
+ maxLength={500}
|
|
|
+ placeholder="请输入备注..."
|
|
|
+ rows={4}
|
|
|
+ onChange={(e) => {
|
|
|
+ this.setState({
|
|
|
+ remarks: e.target.value,
|
|
|
+ });
|
|
|
+ }}
|
|
|
+ />
|
|
|
+ </Form.Item>
|
|
|
+ </Form>
|
|
|
+ <div
|
|
|
+ style={{
|
|
|
+ display: "flex",
|
|
|
+ justifyContent: "center",
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ <Button
|
|
|
+ style={{display:this.state.hid == 'none' ? 'block' :'none'}}
|
|
|
+ onClick={this.submitOrder}
|
|
|
+ type="primary"
|
|
|
+ loading={this.state.loading}
|
|
|
+ >
|
|
|
+ 提交
|
|
|
+ </Button>
|
|
|
+ <Button
|
|
|
+ style={{display:this.state.hid}}
|
|
|
+ onClick={this.linksUpdate}
|
|
|
+ type="primary"
|
|
|
+ loading={this.state.loading}
|
|
|
+ >
|
|
|
+ 完成修改
|
|
|
+ </Button>
|
|
|
+ <Button
|
|
|
+ type="dashed"
|
|
|
+ style={{ marginLeft: "15px" }}
|
|
|
+ onClick={() => {
|
|
|
+ this.setState({
|
|
|
+ visible: false,
|
|
|
+ viewKey: this.state.viewKey + 1,
|
|
|
+ sort: "",
|
|
|
+ mutualChain: "",
|
|
|
+ name: "",
|
|
|
+ url: "",
|
|
|
+ remarks: "",
|
|
|
+ });
|
|
|
+ }}
|
|
|
+ >
|
|
|
+ 取消
|
|
|
+ </Button>
|
|
|
+ </div>
|
|
|
+ </Modal>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ );
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+export default Links;
|